Archives
December 2004
12/31/04
12/27/04
12/26/04
12/24/04
12/24/04
12/23/04
12/23/04
12/22/04
12/21/04
12/20/04
12/19/04
12/18/04
12/17/04
12/16/04
12/16/04
12/15/04
12/14/04
12/13/04
12/11/04
12/7/04
12/7/04
12/6/04
12/5/04
12/4/04
With A Little Help From My Friends! :) !
12/4/04
Saturday, December 4, 2004
Subject: With A Little Help From My Friends! :) !
Time: 6:49:00 PM CST
Author: viviansullinwank
FROM JENNIFER
Adding backgrounds is easy, but it took me a little practice. That's why I have a second (private) journal for testing, cause I can practice and save and no one sees when I screw things up. :o)
First you need a background and then you need to upload it into your FTP. I found the leaves I used in one of my entries here: Thanksgiving, right clicked and saved it. Then named it autumn.gif when I uploaded it.
Now, before adding anything to the journal entry, I click from text to html, and copy this code:
<P style="BACKGROUND-IMAGE: url(http://hometown.aol.com/xzasporated1/autumn.gif); BACKGROUND-COLOR: #ffffff">
You will, of course, want to change to your screen name and your file.gif name. (But if you just paste in that code, it will link to the leaves I have uploaded!)
Then, it's back to text mode.
I like to add the background before adding text, but you can do it either way. I like to hit shift/enter about 9/10 times to give me the backdrop. Always remember to hit shift/enter rather than just enter, or your background will break apart. (I do that all the time, then have to back up, delete the break, and do it all over again.)
And that's all there is to it. There are a lot of neat places to find beautiful backgrounds.
FROM MEG
How to add backgrounds to your journal
First, I go to a search engine and search for backgrounds, then once I found some backgrounds that I like, I right click on the background then click save picture as..if I don't like the name that is in the little box, I usually change it to something I can remember, such as if the background is off candycanes, I might type candycane, then click SAVE.
Then I go to my ftp space...click the upload button and then a box comes up and then I type in candycane.gif then click select file, and then look for the background click on it, and then click send file then its done,
Then I go back to my journal change the setting to html, by pulling down the little arrow on the box all the way on the left side, and then paste this code into the blank screen..
<P style="BACKGROUND-IMAGE: url(http://hometown.aol.com/megzie212/YOURFILENAME.gif); BACKGROUND-COLOR: #ffffff">
Then I just fill the yourfilename with candycane and then go back to the text settingand click shift and enter at the same time, and then the background appears. Obviously the person will have to put their screen name in the megzie212 slot, and so forth. And then you can type your entry once you're back on the text setting! =)
FROM KATHY
What actually seemed to work for the people I helped was just this:
1 go in like you are going to make an entry
2 above where you key the entry it says "view as" text
3 change that "text" to "html"
4 Now key in this:
<p style="background-repeat: yes-repeat;background-image: url('http://hometown.aol.com/yourscreennamehere/nameofyourbackgroundgraphicgoeshere');">text goes here and here</p>
5 Now change the "view as" from html back to "text".
6 You should see part of your background appear. Ifyou don't then you haven't keyed the code in EXACTLY as I have it above. Try it again.
7 Once you get your code right and you can see part of you background appearing just keep keying in your entry. The background will expand as you key.
8 If you do spacing between paragraphs be sure to hold down the shift key at the same time you hit the enter key. This will keep your background solid. If you don't then your background will stop and start.
Thank you Suzy for the box of ornaments and the candles graphics. Thank you Meredith for your help with the graphics. Please click on each of the ladies' names and Dean's name to visit their wonderful journals. The 24k gold wreath is from http://www.goldclipart.com
THANK YOU VERY MUCH LADIES AND DEAN!
UPDATE: Dec 5
I thought it's only fitting that I should include some of the instructions from the man I learned adding background images from. I think Dean is the person who introduced this feature to J-Land. I wanted to capture this info from his journal before he deletes it.
http://journals.aol.com/deanhuns/TheFrugalWebDesigner/entries/453
Some background on backgrounds
These are some notes on adding backgrounds in AOL journal entries.
Basically, you add a background to a journal entry using HTML and inline styles. To add a background color, it looks like this.....
<P style="background-color: #fffff3;">
Where &#fffff3 is the hex code for the color. You could also use RGB color codes or there are some color names. Examples....
<span style="background-color: rgb(115,155,164);">
<span style="background-color: silver;">
To add a background image, it looks like.....
<P style="background-image: url('http://members.aol.com/screenname/picture.jpg'); ">
Where the url is an address to a picture file that is available on the internet. Use single quotes around the url and double quotes around the entire style value.
Other things to note are.....
If you are using a background image, set a background color also, even if it's white.
Background images tile by default. If you do not want the image to tile, add a background-repeat: no-repeat; style. Example so far......
<P style="background-image: url('http://members.aol.com/screenname/picture.jpg');background-color: #ffffff;background-repeat: no-repeat;">
HTML elements are sized to fit the content within them, except for backgrounds. If you want to be sure the whole background image displays, you must do 2 things. First, use a block-level element. In the list of tags that are allowed in AOL journals, the block-level element in which to use a background image is the <P> tag. The other thing is to set the width and height of the element to atleast the width and height of the background image. For example, from my previous entry.....
<P style="width: 587px;height: 390px;background-image: url('http://members.aol.com/deanhuns/clips/seaback.jpg');background-color: #ffffff;background-repeat: no-repeat;">
By default, the position of the background image is the top left corner of the element. You can position a background image with the background-position style. It looks like....
background-position: center center;
Where the first position, (center,left or right), is the horizontal position, and the second position, (center, top or bottom), is the vertical position. You may also use pixel or percentage coordinates that refer to the containing element, ( the P ).
You can have as many style values as you want. Basically each style begins with the name, then a colon, then the value, then a semi-colon. So far the example looks like.....
<P style="width: 587px;height: 390px;background-image: url('http://members.aol.com/deanhuns/clips/seaback.jpg');background-color: #ffffff;background-repeat: no-repeat;background-position: center center;">
That just about covers it for the backgrounds. I'll post something about other styles later, maybe.
Another thing to note about AOL journals is that even if you are in HTML mode, when you press the ENTER key the journals insert a P tag. When you are typing the content within a single paragraph, the best way to avoid typing the ENTER key and messing up your entry is to type the entry in Notepad, then paste it into the journal.
Another tip is that even though the <SPAN> tag is an inline element and will expand or contract to fit the content within it, you can use style="display: block; to make it behave like a block-level element.
One final note is about the picture size. I'm using a monitor display that is 800 by 600 pixels. This is probably the smallest target size that you'll want to consider if you want to display well across different environments. If your picture size is wider than the normal size any visitor views a journal paragraph or sidebar, the size will force horizontal scrolling for that visitor. As for myself, I think the widest picture I would use in an entry, ( backgroundor otherwise ), would probably not exceed around 570 pixels or so, and for the sidebar in my 2 column layout, I probably wouldn't exceed 150 pixels or so. This isn't absolute, I'm just giving estimates.
Have fun.
Written by viviansullinwank Blog about this entry |
Add to del.icio.us | 
digg this
Subject: With A Little Help From My Friends! :) !
Time: 6:49:00 PM CST
Author: viviansullinwank
Just as John Scalzi's current weekend assignment asked us to get in touch with some of our strengths, many of us also know our weaknesses. One of the things I don't feel I do well is to give instructions. I either repeat myself a zillion times and/or unknowingly leave something out. I love it when I get email asking how to add backgrounds to journal entries.
I learned it from Dean, the Frugal Web designer, who is unfortunately leaving AOL. Dean is an HTML expert. I had read enough HTML tutorials to follow his instructions. But my limited HTML experience made it challenging for me. But I'd wanted to learn how to add graphical backgrounds to my entries for so long that I wouldn't give up until I'd succeeded. Thank goodness for thoughts like "if at first you don't succeed...try, try, try again" and "practice makes perfect". I finally got it.
I can never find the email I saved with my own set of instructions. So I asked three of my journal buddies who frequently use backgrounds and have mastered it to send me their instructions because I know they've each often been asked for the information. Thank you ladies for responding so quickly. I think it's always a good idea to get more than one perspective. So I wanted to post this entry to not only share it, but to also know I'll be able to find it whenever I need it.
FROM JENNIFERAdding backgrounds is easy, but it took me a little practice. That's why I have a second (private) journal for testing, cause I can practice and save and no one sees when I screw things up. :o)
First you need a background and then you need to upload it into your FTP. I found the leaves I used in one of my entries here: Thanksgiving, right clicked and saved it. Then named it autumn.gif when I uploaded it.
Now, before adding anything to the journal entry, I click from text to html, and copy this code:
<P style="BACKGROUND-IMAGE: url(http://hometown.aol.com/xzasporated1/autumn.gif); BACKGROUND-COLOR: #ffffff">
You will, of course, want to change to your screen name and your file.gif name. (But if you just paste in that code, it will link to the leaves I have uploaded!)
Then, it's back to text mode.
I like to add the background before adding text, but you can do it either way. I like to hit shift/enter about 9/10 times to give me the backdrop. Always remember to hit shift/enter rather than just enter, or your background will break apart. (I do that all the time, then have to back up, delete the break, and do it all over again.)
And that's all there is to it. There are a lot of neat places to find beautiful backgrounds.
FROM MEGHow to add backgrounds to your journal
First, I go to a search engine and search for backgrounds, then once I found some backgrounds that I like, I right click on the background then click save picture as..if I don't like the name that is in the little box, I usually change it to something I can remember, such as if the background is off candycanes, I might type candycane, then click SAVE.
Then I go to my ftp space...click the upload button and then a box comes up and then I type in candycane.gif then click select file, and then look for the background click on it, and then click send file then its done,
Then I go back to my journal change the setting to html, by pulling down the little arrow on the box all the way on the left side, and then paste this code into the blank screen..
<P style="BACKGROUND-IMAGE: url(http://hometown.aol.com/megzie212/YOURFILENAME.gif); BACKGROUND-COLOR: #ffffff">
Then I just fill the yourfilename with candycane and then go back to the text settingand click shift and enter at the same time, and then the background appears. Obviously the person will have to put their screen name in the megzie212 slot, and so forth. And then you can type your entry once you're back on the text setting! =)
FROM KATHYWhat actually seemed to work for the people I helped was just this:
1 go in like you are going to make an entry
2 above where you key the entry it says "view as" text
3 change that "text" to "html"
4 Now key in this:
<p style="background-repeat: yes-repeat;background-image: url('http://hometown.aol.com/yourscreennamehere/nameofyourbackgroundgraphicgoeshere');">text goes here and here</p>
5 Now change the "view as" from html back to "text".
6 You should see part of your background appear. Ifyou don't then you haven't keyed the code in EXACTLY as I have it above. Try it again.
7 Once you get your code right and you can see part of you background appearing just keep keying in your entry. The background will expand as you key.
8 If you do spacing between paragraphs be sure to hold down the shift key at the same time you hit the enter key. This will keep your background solid. If you don't then your background will stop and start.
Thank you Suzy for the box of ornaments and the candles graphics. Thank you Meredith for your help with the graphics. Please click on each of the ladies' names and Dean's name to visit their wonderful journals. The 24k gold wreath is from http://www.goldclipart.com
THANK YOU VERY MUCH LADIES AND DEAN!
UPDATE: Dec 5
I thought it's only fitting that I should include some of the instructions from the man I learned adding background images from. I think Dean is the person who introduced this feature to J-Land. I wanted to capture this info from his journal before he deletes it.
http://journals.aol.com/deanhuns/TheFrugalWebDesigner/entries/453
Some background on backgrounds
These are some notes on adding backgrounds in AOL journal entries.
Basically, you add a background to a journal entry using HTML and inline styles. To add a background color, it looks like this.....
<P style="background-color: #fffff3;">
Where &#fffff3 is the hex code for the color. You could also use RGB color codes or there are some color names. Examples....
<span style="background-color: rgb(115,155,164);">
<span style="background-color: silver;">
To add a background image, it looks like.....
<P style="background-image: url('http://members.aol.com/screenname/picture.jpg'); ">
Where the url is an address to a picture file that is available on the internet. Use single quotes around the url and double quotes around the entire style value.
Other things to note are.....
If you are using a background image, set a background color also, even if it's white.
Background images tile by default. If you do not want the image to tile, add a background-repeat: no-repeat; style. Example so far......
<P style="background-image: url('http://members.aol.com/screenname/picture.jpg');background-color: #ffffff;background-repeat: no-repeat;">
HTML elements are sized to fit the content within them, except for backgrounds. If you want to be sure the whole background image displays, you must do 2 things. First, use a block-level element. In the list of tags that are allowed in AOL journals, the block-level element in which to use a background image is the <P> tag. The other thing is to set the width and height of the element to atleast the width and height of the background image. For example, from my previous entry.....
<P style="width: 587px;height: 390px;background-image: url('http://members.aol.com/deanhuns/clips/seaback.jpg');background-color: #ffffff;background-repeat: no-repeat;">
By default, the position of the background image is the top left corner of the element. You can position a background image with the background-position style. It looks like....
background-position: center center;
Where the first position, (center,left or right), is the horizontal position, and the second position, (center, top or bottom), is the vertical position. You may also use pixel or percentage coordinates that refer to the containing element, ( the P ).
You can have as many style values as you want. Basically each style begins with the name, then a colon, then the value, then a semi-colon. So far the example looks like.....
<P style="width: 587px;height: 390px;background-image: url('http://members.aol.com/deanhuns/clips/seaback.jpg');background-color: #ffffff;background-repeat: no-repeat;background-position: center center;">
That just about covers it for the backgrounds. I'll post something about other styles later, maybe.
Another thing to note about AOL journals is that even if you are in HTML mode, when you press the ENTER key the journals insert a P tag. When you are typing the content within a single paragraph, the best way to avoid typing the ENTER key and messing up your entry is to type the entry in Notepad, then paste it into the journal.
Another tip is that even though the <SPAN> tag is an inline element and will expand or contract to fit the content within it, you can use style="display: block; to make it behave like a block-level element.
One final note is about the picture size. I'm using a monitor display that is 800 by 600 pixels. This is probably the smallest target size that you'll want to consider if you want to display well across different environments. If your picture size is wider than the normal size any visitor views a journal paragraph or sidebar, the size will force horizontal scrolling for that visitor. As for myself, I think the widest picture I would use in an entry, ( backgroundor otherwise ), would probably not exceed around 570 pixels or so, and for the sidebar in my 2 column layout, I probably wouldn't exceed 150 pixels or so. This isn't absolute, I'm just giving estimates.
Have fun.
Written by viviansullinwank Blog about this entry |
Add to del.icio.us | digg this
This entry has 20 comments: (Add your own)
-
Your a god send....sooo glad I found this...thanks Vivian! -Raven
-
I am so glad this is still here.
I am using this as a "something to do" link for my Christmas entry.
Kathy -
Thank you, thank you, thank you for this :)
~Danielle -
Well I have figured out backgrounds. Now what I want to know is how to doside bordered backgrounds and how to fix it where you do not type on the border.
12/8/06 3:15 AM
http://journals.aol.com/rebuk