Different font when typing in guestbook.
Original post: http://makulitrepublic.multiply.com/notes/item/89
By: Francesca



As you see below, when you type in my guestbook, it comes with a different font
than the default one.
look below:

How to do this one on your site:
Click Customize my site.
You will be seeing a yellow strip popping out.
Click Custom Css.
Copy this code on the first line:


table, td {
background: transparent;
border: 0px;
line-height: 14px;font-family:TYPE THE FONT TYPE HERE!important;font-weight:bold!important; }
input, textarea, font, p, table, td, div, strong, u, i {font-size:TYPE THE FONT SIZE HEREpx!important;font-family:TYPE THE FONT YOU WANT TO APPEAR AFTER TYPING!important;font-weight:normal!important; letter-spacing: 0px; font-color: #TYPE THE COLORCODING HERE.;}

body {
background-image:url(http://i29.tinypic.com/e1c6ir.png);
background-attachment: fixed;
background-color: #fff;
font-family: arial ;
font-size: 9pt;
color: #707070;

See this text in the code:
1.TYPE HERE THE FONT TYPE
2.TYPE HERE THE FONT TYPE YOU WANT TO SEE AFTER TYPING
3.TYPE HERE THE COLOR CODING
And then. highlight them and edit it with your own..

Examples:
Font type = Lucida Console
Font type after typing text = Arial
Color coding= #330000

Hope it does works for you and will help you, any problems shall be PMed to me (personal messaged)
Thanks!

Ok so here it goes..

When you visit my multiply site, you'll notice that my favicon is quite different from the default one provided by multiply. There have been PREVIOUS javascripts that allowed to edit and change that icon but multiply has then disabled that and this can no longer be done.

Ok forgive me for keeping it a secret for sometime, but there are just things that you tend to keep and reserve for yourself only sometimes right?

It's actually one of my kept-secrets here in multiply. I share it to some close contacts only but now (since a similar post has already been posted publicly - on another group) I'm ready to share it (as if I had better choices lol)..




Anyway, enough of the intros, here it is: (You might find this long and confusing, but it's actually easy)

1. Get your own favicon image and host it on your Photos section (any image will do). Remember to use small images since it's a favicon (I personally prefer 16x16 but you may choose a different size). You may use jpeg/jpg, gif, png files.

2.  Take note of the Image Url of your favicon.

    **How to get you Image URL:
              http://makulitrepublic.multiply.com/journal/item/57

3. The actual code for the favicon (Placed in your Site Title) is:


4. See that the Code says "Modified Image URL". This is because the Image URL should be edited first (in Notepad) for it to work.

5. Here's an example of an Modified Image Url:

http%3A//i166.photobucket.com/albums/u83/jnamakulit/Icons/animated_favicon1.gif

*Notice that there's a 'slight' difference on a normal Image URL. %3A replaced what's (supposed to be) ":" see?

<span style="display:none;">%3Clink%20href%3D%22http%3A//i166.photobucket.com/albums/u83/jnamakulit/Icons/animated_favicon1.gif%22%20rel%3D%22shortcut%20icon%22%20type%3D%22image/x-icon%20/%22%3E</span>

6. Edit your Favicon Image Url (Do the same as above) and paste it on your Site Title.

7. Save it and refresh you page. (if you don't see it, try reading back and make sure you have done it correctly).



NOTE: There's a glitch! Save the finished code that you have in notepad. Once you have saved it in the Site Title, you wont be able to see that again. If you want to edit the Site Title, you need to enter the same codes all over.

See this Note Entry:
http://makulitrepublic.multiply.com/notes/item/50

Here are the CSS Tags for the right rail links:

All:
.sidelist {value}

One by One:
ul.sidelist li.customize a {value}       customize
ul.sidelist li.select a {value}              promote
ul.sidelist li.contacts a {value}          contacts
ul.sidelist li.photos a {value}             photos on profile
ul.sidelist li.pm a {value}                   send a PM
ul.sidelist li.invite a {value}                invite user
ul.sidelist li.join a {value}                   join - for group
ul.sidelist li.quit a {value}                  quit - for group
ul.sidelist li.delete a {value}              delete - for group admins
ul.sidelist li.rss a {value}                   RSS feeds
ul.sidelist li.report a {value}               Report Abuse
ul.sidelist li.block a {value}                Block user




Now, for changing the icons, just remove "a" in the line "ul.sidelist li.contacts a {value}"


Let's take this line for a sample:

ul.sidelist li.contacts a {value}
into
ul.sidelist li.contacts {value} - see that "a" is omitted
then add the values

ul.sidelist li.contacts {
background:transparent url(IMAGE_URL) no-repeat scroll top left;
height:16px;
width:108px;
overflow:hidden;
white-space:nowrap;
}

or:

ul li {
list-style-image: url(IMAGE_URL);
}




See also: Right Rail Labels

There are two steps..

• Remove the default Icons
• http://makulitrepublic.multiply.com/journal/item/17

• Put your own Icon/Image as a replacement
• http://makulitrepublic.multiply.com/journal/item/23
  

See also:
Default Icons (Part I)
Default Icons Part II

Go here first: http://multiply.com/setup/messages



Make sure that the box of "Hide mini-profile mouseover popups" is NOT CHECKED.



Afterwhich, go to "My Network"



Then, hover on the Headshot of your contact and you'll see the a link that allows you to change relationships..

deadlyshot

'''© deadlyshot™ Your employee Philippines View Contacts (2) Personal Message Remove as Contact Change Relationship

To delete a contact: You can access this page..

<blank></blank>

You can do so by adding these codes on tha PART of the CSS codes you wanted to change.

DEFINITONS

COLOR OF FONTS           =    font-color: #000000;
THICKNESS OF FONTS    =    font-weight: bold;       or       font-weight:100%;
SIZE OF FONTS               =    font-size: 4px;
TYPE OF FONT*               =    font-family: 'arial'; 

*Suggested font types are the FONTS that are seen on a TYPICAL computer like:

ARIAL
IMPACT
TIMES NEW ROMAN
COPPERPLATE GOTHIC
GEORGIA

etc..

EXAMPLE 1: (changing the fonts on the body part)

body {
font-color: #FFFFFF;
font-weight: bold;
font-size: 6px;
font-family: 'Comic Sans MS';
}

EXAMPLE 2: (changing the fonts on the Page Header)

div.owner_nav {

font-color: #696969;
font-weight: normal;
font-size: 8px;
font-family: 'Arial';



**If for example, you put in "Chiller" on the body:

body {
font-color: #000000;
font-weight: normal;
font-size: 4px;
font-family: 'Chiller';
}


**If the viewer HAS the font "Chiller" available on his computer, he MAY see the fonts on the page properly.

**If the viewer DOES NOT HAVE "Chiller" on his computer, he MAY NOT see the fonts as is, but rather, the fonts will REVERT to the DEFAULT FONTS of Multiply.

div#mainbox_1 div.relatedlinks {
width:780px;
}

div#mainbox_1 .itembox,
div#mainbox_2 .itembox,
div#mainbox_3 .itembox,
div#mainbox_4 .itembox,
div#mainbox_5 .itembox,
div#mainbox_6 .itembox,
div#mainbox_7 .itembox,
div#mainbox_8 .itembox,
div#mainbox_9 .itembox,
div#mainbox_10 .itembox,
div#mainbox_11 .itembox {
-moz-opacity:0.70;
filter:alpha(opacity=70);
opacity:0.70;
-khtml-opacity:0.70;
}

div#mainbox_ (NUMBER depends on the positioning of boxes in the Home Page)

example for single boxes:

div#mainbox_1 .itembox {
-moz-opacity:0.70;
filter:alpha(opacity=70);
opacity:0.70;
-khtml-opacity:0.70;
}


You can also add the code in other parts of your CSS like .itembox etc..

sample:

.itembox {
-moz-opacity:0.70;
filter:alpha(opacity=70);
opacity:0.70;
-khtml-opacity:0.70;
}

Here are the Basic CSS codes..

/* FONTS */
a:link {color:#000000;} - this are the links in your page
a:visited {color:#000000;} - the color of links which were already visited by the viewer
a.topt, a:visited.topt {color:#000000;} - Home Blog Photos etc.
a.toptsel, a:visited.toptsel {color:#000000;} - Home Blog Photos etc. when visited already

.replydeleted {color:#000000;} - the color of "reply deleted" on posts which were deleted already.

**********************************************************************************************************
/*USER ID*/
span.signoutid a, span.signoutid a:link, span.signoutid a:visited {
color:#000000;
}

/*USER ID*/
.user_id_signout a {
color:#000000;
}

/*LOGOUT*/
a.signout {
color:#000000;
}

/*ITEM BOX*/
.itembox {
color:#000000;
}

/* ITEM BOX TITLES */
.itemboxsub {
color: #000000;
}

/*ITEM BOX DATE*/
.itemsubsub {
color: #000000;
}

/*REPLY BOX*/
.replybox {
color: #000000;
}

/*LINKS INSIDE BOXES*/
a.add, a.add:link, a.add:visited {
color: #000000;
}
a.select, a.select:link, a.select:visited {
color: #000000;
}

/*HEADER*/
.header .globalnav ul.gnopt a {
color: #000000;
}

Insert This To your CSS Box

scrollbar {
scrollbar-face-color: #000000;
scrollbar-arrow-color: #000000;
scrollbar-shadow-color: #000000; 
scrollbar-darkshadow-color: #000000;
scrollbar-highlight-color: #000000;
scrollbar-3dlight-color: #000000;
scrollbar-track-color: #000000;
}

** #000000 is black. you may replace it with any color you like.
** Only works on IE I think..

* CURSOR: BODY */
body { cursor:url("IMAGE URL"),default; }

/* CURSOR: LINKS */
a,a:link,a:visited,a:active,a:hover { cursor:url("IMAGE URL "),default; }