How
to place any object in the rail
or everywhere in the page
If
this post looks too much long to read then just try this way:
copy the code in the light box (relative at your theme)
insert in the code your widget (any object you are able to insert
in the welcome box)
paste the code in the welcome box
play a bit changing the position values (by using the properties:
top, left/right)
if you don't know what to do with the red box you get following this
procedure then ... read the post ;-)
Thesis:
It is possible to put in the rail any widget that you are able to insert
in the welcome box. (... not bad uh?.. I had written many times that this is not possible
...)
Demonstration:
It is necessary some concept about the layout of multiply , CSS and html
... but nothing of transcendental
I'm not a expert of css and html so forgive me some inappropriate term
or definition
the HTML Tag DIV
You can to insert a widget in the welcome box by using the HTML Tag: DIV
simply you must to think the html page like a sequence of boxes;
boxes like a table or simply the tag used for the text:
<p>here _the _text </p>
or used for a link:
<a href="URL">here_the_link</a>
the box I use for to content the widget (or simply a text or some link
or an image) is the html tag DIV
<div> Here_Is_My_Widget
</div>
this code above looks exactly so:
Here_Is_My_Widget
if used in this manner it is a neutral tag .. it is invisible.
experiment inserting this in the welcome box.
Using CSS inline
Now you must to know this:
I have always said to insert the CSS in the custom CSS box and the HTML
in the welcome box.
Remember the HTML give the structure of the web page
the CSS give the style of the web page
HTML and CSS are complementary but it exist html without css; do not
exist css without html.
Now you must to know CSS can to be added directly into the html istruction;
so if you want to change the style of the div box you can to write the
css inline; something like:
Now you must to displace the div box and all his content into the rail...
well you must to know a new CSS property and assignement:
position: absolute;
The default assignement for every object in the html page is position:static;
Definition:
An
element with position:absolute is positioned
at the specified coordinates relative to its containing block.
The element's position is specified with the "left", "top", "right",
and "bottom" properties.
in the definition above our element is the div box containing the widget;
the containing block of the definition is the Welcome Box of the site
(applying the code in the welcome box).
we will move our div-box by changing the assignements for the propertiestop and left (or right):
top: 5px; left: 15px;
changing the values assigned with the right value. An alternative assignement
is this:
top: 0% ; left: 0% ;
So the definitive code for my widget (just a simple text box) is this:
Here I have inserted this code and you see the box in the upper left
corner of the post.
If you put this in the welcome .. it come in the upper left of the welcome
box.
Kind of layouts on Multiply
now you must to notice this .. in some layout the rail is jointed with
the welcome box (and all the other boxez in the welcome)
in some other the position of the rail and the welcome box depend by
the size of the page used in the web reader...
just experiment resizing the browser's window.
I dont know the tech term for this two kind of layout sorry.
anyway I'll distinguish between the layout "fixed in the center",
for the themes: Custom Themes, News Paper, Blue Slate, Blocks, Mykonos, Melon,
Sandskrit, Petals, Retro, Outburst, Avlack, Red Frog, Shadow Box;
and the "expanded layout", for the themes: Oasis, Basecamp, SkyLine and Black Lily Note 1: Retro and Red Frog with a negative
value for left assignement; Note 2 : I have tested this ONLY on the custom
theme of the group and with skyline cause I'm becoming lazy Note 3 : That means that I have assigned one
of the two categories for all the other themes simply by observing the
layout in the page http://multiply.com/setup/pages/themes
Finally the code for to displace our box is this for the Themes:
Custom
Themes, News Paper, Blue Slate, Blocks, Mykonos, Melon, Sandskrit,
Petals, Retro, Outburst, Avlack, Red Frog, Shadow Box:
put the box externally to the upper right corner of the welcome box;
experiment this, and from this point change the values.
Note 2:
those assignements are good for the Custom theme; for the other themes
you must to consider that anyone has his rail-width and his margins between
rail and welcome box so you must to find the right values.
Note 3:
you must to assign the width at your div-box according
it to the widget width by using the property Width:
width:160px;
The height of the div-box is automatically assigned
Note 4:
you see I'm adding the box below the Google ADS
You cannot legally to remove the ADS
thought it is possible to displace that lower
the code for to displace our box is this for the Themes:
from this you look the relation between html and css code;
the use of a separated part for to declare the style allow to make thin
the html code
and more it is possible to change the style of a whole site (to all the
objects with a class My_Class) only by changing one file (the
css file)
Final Note:
I'll appreciate any feed back to get better this post.
IMPORTANT
Start experimenting with a simply text or a link or an image first! do
not start adding a chat box or some other strange thingie.
ok?
,,ok ! that's all folks
enjoy it
sure something I've said is wrong ,,, let me know
my brain's not working well today.. i actually have to read it a few times to understand.. lol... interesting.. might try it later.. after my coffee.. kudos to you.. as alwz..
my brain's not working well today.. i actually have to read it a few times to understand.. lol... interesting.. might try it later.. after my coffee.. kudos to you.. as alwz..
oh well not is necessary to read all ,, just copy the code in the light box (for your theme) and insert in the code your widget ,,, then paste it in the welcome box, then some little change to left and top values .
can i put a widget below or above the "ads by google" at the right side rail how? pls help.
oh well not is necessary to read all ,, just copy the code in the light box (for your theme) and insert in the code your widget ,,, then paste it in the welcome box, then some little change to left and top values let me know if you have some problem
mariatv wrote on Mar 25, '07, edited on Mar 25, '07
I have explained any thing in this post ,it is a bit long ,, I know ,, ,,, but you must to read the post cause this is the better explanation I can give! anyway you are at a good point =o)
chin001 wrote on Mar 27, '07, edited on Mar 27, '07
Here's the code of the google widget: script src="http://gmodules.com/ig/ifr?url=http://blog.outer-court.com/homepage/miniweb.xml&synd=open&w=320&h=190&title=Mini+Web&border=%23ffffff%7C3px%2C1px+solid+%23999999&output=js">
i would like to put the said widget below the "ads by google"
more .. remember your rail is about 160 px of width normally ,,, and probably your widget would be 320 pixel of width ......................=open&w=320&h=190&title=Mini+We.......................
you are supposed to replace the words "Here_Is_My_Widget" with your own widget codes. Do a test and try replacing it with other words or an image url or something.. you'll get what Maria means.. good luck..
:() tnx Zyanti a widget is a generic object just to indicate any object you want to put in the rail below the google ads such as a counter or a chat box or an image or a link so if you want to put a counter in that position you have to substitute the text here_is_my_widget with the code for to have the counter note: you have to define the right position of this object ; mine is an example but the position depends by the width of your "widget"
... now you can write this code at this manner (I prefer to put all the assignements for a section in the same place ..so it is more simple to modify the code) and you can insert this section where you want in the custom css box.. normally the body section is the first of the css code.
if i wanted a particular widget shown way below my page what would be the codes? like say, just above the "viewing history" box. but in the center portion. and can i make that "viewing history" transparent too??? do i ask a lot? wejejejejeje thanks in advance people =D
for to anchor the background to the right center of your page so the image to the right in background remains more visible with all the webreader sizes used by visitors
if i wanted a particular widget shown way below my page what would be the codes? like say, just above the "viewing history" box. but in the center portion. and can i make that "viewing history" transparent too??? do i ask a lot? wejejejejeje thanks in advance people =D
,,, sorry ... I had not viewed your question
for moving the widget you have to change the position top and left fore the position left it is simple with left:0% you have the widget contiguous to the left border of the post with left:45%; it is in the center (the right value depend by the width of the widget
for the top .. the vertical position .. it is more difficult.
you have to give the right value such as top: 1500px
the value depend by the heigth of your main page.
the real problem is the height of your main page change if you look the page with Intenet explorer or mozilla or other browsers
so the object in the rail can to be displaced more up or down with no problems cause do not perceive the difference in the various webreader in the center you could find some problem .. the position change dependig by the browser
you have to use top: 2000px; (you have to find the good value) left: 50%; (you have to find the good value...about 45%)
uhmmm ,., I have not understood perfectly the functioning when I have found the way to placing an object in the rail by using this I was really surpriesed cause it looks perfectly fixed with all the browsers and all the screen resolutions I did not believed to my eyes :-)
I'd say ... the positioning is perfect in any position into the box of the post and externally in the proximity of the post's box (the rail is in proximity)
the horizzontal position is perfectly fixed the vertical position could to change depending by the used browser I have not examined this so deeply :-)
i am using a widget in the rail and semi-transparencies in the main page.. errr... u dun see any widget there with IE6?.. I dun use IE6 so i can't tell u what i see and didnt see.. :-p
mmmh you are using semi transparency in the boxes except the welcome box that it is transparent such as in my site now sob ... it is changed something,.,.,
.,.,.,, it is incredible ,...,., in my home page I have removed transparency.. with transparent background I see the object but here in the group with ie6 the view is cut ,,., so I cannot use semitransparencies in welcome box and in group now I dont view the object with ie6 also if I have removed semi transparencies .. sigh
please dear tell me if you see some object in the rail here in the main of the group ,, using ie7
mariatv wrote on Apr 17, '07, edited on Apr 17, '07
and ... ehmmmm Zy... please could you add for a moment (one day just for let me to see it) a background color and semi transparency in your welcome box ??
hey.. u r rite.. i can't see any widgets in IE7. I just notice this.. even the nav bars looks different.. in Firefox they have rounded edges but in IE7.. they are squarish.. hmm..
i changed my welcome box to semi-transparent.. and yes.. the widget was cut in IE.. I shall keep it that way for one day for you to see.. he he.. ok together we say.. "IE SUCKS..!!"
You can't create a Market and Recipes category anymore if you don't have one already. They were discontinued. You already have a Notes section, but it's hidden: http://b1nt4n6.multiply.com/notes
Only you and your network can open this link and see the posts (Network Messages). You may add a link to it in your Welcome Message if you want, and to create new posts, use: http://b1nt4n6.multiply.com/notes/compose
you can add this code in any place you can add html in the other boxes or in the title NOT in the title of your group ,, you know why ;-) in reply boxes or in posts too
just you have to know the positions top and left refer the top-left corner of the box where you are inserting the code as top:0px; left:0px;
ive done this since even before seeing this post.. nice one maria.. really nice.. can i just ask.. i know this sounds crazy but can i put the midget over the place where the google ads are? hahaha as like covering it? hahaha
lols aright, i tried doing it-covering the ads with an image but it wont work! hahaha you can place your widget anywhere, even on the area of the google ads BUT it WONT cover it because the google ads is ALWAYS on TOP of any other things on the page.. hahaha silly me..
take a look the the post above there are two light boxes with the code choose one depending by the theme u are using. and paste the code where is here_is_my_widget
my brain's not working well today.. i actually have to read it a few times to understand.. lol... interesting.. might try it later.. after my coffee.. kudos to you.. as alwz.. 
