Chocolate - Melting pleasure
I made a layout that fits very well with this time of the year. You know, I have been seeing chocolate everywhere and I got inspired *chuckles*. If you liked it, just take and use it following my instructions. It's for free, just give me some credit. I know it's hard, but don't lick the screen, lol!!!
Style: S2 3 Column
Title: Chocolate - Melting pleasure
Website: Not needed
Default Icon: No needed
Best view: 800x600 and higher.
Browser(s) Compatible: Firefox, Internet Explorer, Netscape, Opera.
Maker: amavel_bel (Mabel). Credit me in your user info page.
Resources: Images from the web sites GettyImage and iStockPhoto. Other resources (like brushes, textures and so on) are credited at my LJ Info Page.
Notes: For free and paid accounts and it works with Nav bar strip and Sponsored Plus Account (just with vertical ads).
Preview:
Working preview: bel_food002
| IMAGES |
Obs.: The images are provided in the code for convenience. They are hosted and I don't intend to take them down (hopefully I won't have exceeding bandwidth problem). If you want, I'm providing the links below, so you can take the images and upload them in your own server. Just the FRIENDS ONLY BANNER and the ICON are optional.
Header:
http://i38.photobucket.com/albums/e107/bel_layouts/food002/chocolate_header.jpg
Background:
http://i38.photobucket.com/albums/e107/bel_layouts/food002/chocolate_back.jpg
Friends Only Banner:
Icon:
Extra images:
- http://img.photobucket.com/albums/e107/bel_layouts/food002/chocolate_melting.jpg
- http://img.photobucket.com/albums/e107/bel_layouts/food002/chocolate_backside.gif
- http://img.photobucket.com/albums/e107/bel_layouts/food002/chocolate_backentr.jpg
- http://img.photobucket.com/albums/e107/bel_layouts/food002/chocolate_bar.jpg
| CUSTOM COLORS |
You don't need to configurate the colors.
| CSS CODE |
body { font-family: Verdana, Arial; font-size: 8pt; color: #000000; background: #170C06 url('http://i38.photobucket.com/albums/e107/bel_layouts/food002/chocolate_back.jpg') repeat-y center top; margin: 0; } a { color: #230E0B; font-weight: bold; } a:hover { color: #F7F2EE; font-weight: bold; } h1{ font-size: 13pt; text-align: left; color: #230E0B; padding: 5px; margin: 0px; border: 0; border-bottom: 2px solid #4D261F; } h2{ font-size: 13px; text-align: left; color: #230E0B; margin: 0px 0px; padding: 0px; margin-bottom: 15px; background-color: transparent; border: 0; } h3{ color: #000000; text-align: left; font-family: Arial; font-weight: bold; font-style: italic; padding: 5px; margin: 0px; border: 0; } #header { position: relative; width: 780px; margin: auto; height: 234px; background: #DECEBC url('http://i38.photobucket.com/albums/e107/bel_layouts/food002/chocolate_header.jpg') center top no-repeat; border-left: 1px solid #020202; border-right: 1px solid #020202; } #container { position: relative; top: 0px; width: 780px; margin: auto; padding-top: 60px; background: #DECEBC url('http://i38.photobucket.com/albums/e107/bel_layouts/food002/chocolate_melting.jpg') no-repeat center top; border-left: 1px solid #020202; border-right: 1px solid #020202; } /* friends list user account */ #leftbar{ position: absolute; width: 170px; border: 0; background-color: transparent; top: 336px; left: 50%; margin: 0px -380px 0px -380px; } /* friends list comm account */ div#container #leftbar{ top: 60px; left: 0; margin: 0 !important; margin: 0 0 0 -5px; } /* friends list user account */ #rightbar{ position: absolute; width: 170px; border: 0; background-color: transparent; top: 336px; left: 50%; right: 0; margin: 0px 218px 0px 218px; } #rightbar h2 { text-align: right; } /* friends list comm account */ div#container #rightbar{ top: 60px; } #leftbar a, #rightbar a { color: #000000; font-weight: normal; text-decoration: none; } #leftbar a:hover, #rightbar a:hover { color: #F4EFEA; } #leftbar .calendarActive a { color: #61492F; background-color: transparent; padding: 0px; font-weight: normal; } #leftbar .calendarActive a:hover { color: #FFFFFF; } .sidebox{ border: 0; background-color: transparent; margin: 10px; padding: 5px 5px 25px 5px; background: transparent url('http://i38.photobucket.com/albums/e107/bel_layouts/food002/chocolate_backside.gif') no-repeat center top; } .sidebox h2{ border: 0; font-size: 13px; text-align: left; margin: 0px 0px; padding: 0px; margin-bottom: 15px; background-color: transparent; border-bottom: 1px solid #4D261F; color: #230E0B; } .blurb { color: #000000; padding-bottom: 25px; } .sidebox div a img { display: none; } .sidebox div span.ljuser a img { display: inline; } ul.links{ margin: 0px 0px; padding: 2px 0px 2px 0px; color: #000000; list-style-type: none; } li.links { margin-left: 5px; } li.links a { display: block; padding: 5px 0px 5px 0px; border-bottom: 1px solid #230E0B; text-decoration: none; width: 130px; font-family: Verdana, Arial; } li.links a:hover { font-weight: bold; background: transparent url('http://i38.photobucket.com/albums/e107/bel_layouts/food002/chocolate_bar.jpg') repeat center top; } li.links_header{ font-size: 11px; border-bottom: 1px solid #000000; padding-top: 7px; } .sidebox table { background-color: transparent; } .calendarActive{ font-weight: bold; } .calendarActive a: link, .calendarActive a: visited { color: #000000; font-weight: bold; text-decoration: none; } .calendarActive a:hover { color: #230E0B; } #entries{ position: relative; margin: 0px 160px 0px 160px; text-align: center; background-color: transparent; border: 0; padding: 5px 5px 25px 5px; } #readme { text-align: justify; padding: 2px; } div.entrylinks { font-family: Verdana; font-size: 8pt; text-align: right; padding: 2px 10px 2px 10px; line-height: 20px; margin: 0px 0px 0px 0px; border-top: 1px solid #404040; } div.entrylinks a { background-color: transparent; text-decoration: none; margin: 2px; padding: 2px; } div.entrylinks a:hover { background-color: transparent; } div.entrylinks img { border: 0px; text-decoration: none; } div.commentlinks { font-family: Verdana; font-size: 8pt; padding: 2px 10px 2px 10px; line-height: 20px; } div.commentlinks a { background-color: transparent; text-decoration: none; margin: 2px; padding: 2px; } div.commentlinks a:hover { background-color: transparent; } div.commentlinks img { border: 0px; text-decoration: none; } div.entry{ border: 0px; background-color: transparent; padding: 5px 5px 10px 5px; margin-bottom: 40px; background: transparent url('http://i38.photobucket.com/albums/e107/bel_layouts/food002/chocolate_backentr.jpg') no-repeat center bottom; } div.entry h1{ text-transform: uppercase; color: #230E0B; font-size: 8pt; font-weight: bold; letter-spacing: 1.5px; text-align: left; padding: 3px; margin-right: 0; border: 0; background-color: transparent; } .entrytext{ font-family: Verdana; font-size: 8pt; text-align: justify; color: #000000; width: 420px; margin-top: 10px; line-height: 16px; overflow: auto; } .aboutentry{ text-align: left; font-weight: normal; background-color: #E8DDD0; border-top: 1px solid #FFFFFF; border-right: 1px solid #404040; border-left: 1px solid #FFFFFF; padding-top: 5px; padding-bottom: 5px; } div.ljtags { margin: 0; margin-top: 6px; font-style: italic; font-weight: normal; } .userpic { margin: 5px; } .userpic2 { position: relative; float: left; padding: 0px 5px 5px 0px; margin: 0px 0px 0px 0px; } .userpic_reply { position: relative; float: left; padding: 5px; } .moodpic { float: right; padding-bottom: 5px; } .nosubject { font-style: italic; } .replyform { text-align: left; clear: both; padding-top: 10px; } .replyform textarea { width: 98% !important; } .replyform input { border: 1px solid #4D261F; font-size: 11px; } .replyform input: hover { background-color: #F4EFEA; } .replyform input#talkpostfromremote { border: 0; } .replyform input#prop_opt_preformatted, .replyform input#spellcheck { border: 0; } .comment_postedby { text-align: left; font-weight: bold; background-color: #E8DDD0; border-top: 1px solid #FFFFFF; border-right: 1px solid #404040; border-left: 1px solid #FFFFFF; } .comment_date{ text-align: left; background-color: #E8DDD0; border-right: 1px solid #404040; border-left: 1px solid #FFFFFF; } .comment_info .comment_date{ padding-bottom: 8px; } .comment_subject { text-transform: uppercase; color: #230E0B; font-size: 8pt; font-weight: bold; letter-spacing: 1.5px; text-align: left; padding: 3px; margin-right: 0; background-color: transparent; } .comment_wrapper{ border: 0px; background-color: transparent; padding: 5px 5px 10px 5px; margin-bottom: 40px; background: transparent url('http://i38.photobucket.com/albums/e107/bel_layouts/food002/chocolate_backentr.jpg') no-repeat center bottom; } .comment_info { width: 95%; } .comment_links { text-align: right; padding: 3px; margin: 0px; border: 0; border-top: 1px solid #404040; } .comment_info .comment_date, .comment_info .comment_postedby { background-color: transparent; border: 0; } .comment_links a { padding: 2px; text-decoration: none; } .comment_child { margin: 0px 0px 0px 20px; } .comment_child .entrytext { width: auto; } .minicomment { padding: 4px; border: 1px solid #BAA495; } .minicommentholder { border: 1px solid #BAA495; } div .systemmessage a { text-decoration: none; }
| SPECIAL INSTRUCTIONS |
Preparing the code:
- Copy the CSS code and paste it in the Notepad.
- If you decided to host the images in your own server, replace every i38.photobucket.com/albums/e107/bel_layouts/food002 by the server address where you uploaded the images.
Configuring the layout:
- In the LJ page, go to Journal >> Change Journal Theme.
- If you're using S1 style do the following. If not, skip this step: Click in the link Switch to S2 in the blue box on the right side of the page. Then, click in the button "Yes, I want to upgrade to S2".
- In the 2. Select a New Theme section, type 3 Column in the search box. Then select one of the themes listed and click in Apply Theme.
- Click in the button Customise your theme, in the bottom on the right side.
- Click in the option Custom CSS and under Use layout's stylesheet(s) choose No (THIS IS VERY IMPORTANT!). Then copy the CSS from the Notepad and paste it in the field Custom stylesheet.
- Then you can navigate through the links in the Customize Your Theme and personalize other things as you wish, like going to the Text option and entering a personalized text inside the Blurb Text, for example.
- Click in the button Save Changes and it's done.
Cross-posted to layouts_for_fun, freelayouts and freelayouts_s2.
Style: S2 3 Column
Title: Chocolate - Melting pleasure
Website: Not needed
Default Icon: No needed
Best view: 800x600 and higher.
Browser(s) Compatible: Firefox, Internet Explorer, Netscape, Opera.
Maker: amavel_bel (Mabel). Credit me in your user info page.
Resources: Images from the web sites GettyImage and iStockPhoto. Other resources (like brushes, textures and so on) are credited at my LJ Info Page.
Notes: For free and paid accounts and it works with Nav bar strip and Sponsored Plus Account (just with vertical ads).
Preview:
Working preview: bel_food002
| IMAGES |
Obs.: The images are provided in the code for convenience. They are hosted and I don't intend to take them down (hopefully I won't have exceeding bandwidth problem). If you want, I'm providing the links below, so you can take the images and upload them in your own server. Just the FRIENDS ONLY BANNER and the ICON are optional.
Header:
http://i38.photobucket.com/albums/e107/bel_layouts/food002/chocolate_header.jpg
Background:
http://i38.photobucket.com/albums/e107/bel_layouts/food002/chocolate_back.jpg
Friends Only Banner:
Icon:
Extra images:
- http://img.photobucket.com/albums/e107/bel_layouts/food002/chocolate_melting.jpg
- http://img.photobucket.com/albums/e107/bel_layouts/food002/chocolate_backside.gif
- http://img.photobucket.com/albums/e107/bel_layouts/food002/chocolate_backentr.jpg
- http://img.photobucket.com/albums/e107/bel_layouts/food002/chocolate_bar.jpg
| CUSTOM COLORS |
You don't need to configurate the colors.
| CSS CODE |
body { font-family: Verdana, Arial; font-size: 8pt; color: #000000; background: #170C06 url('http://i38.photobucket.com/albums/e107/bel_layouts/food002/chocolate_back.jpg') repeat-y center top; margin: 0; } a { color: #230E0B; font-weight: bold; } a:hover { color: #F7F2EE; font-weight: bold; } h1{ font-size: 13pt; text-align: left; color: #230E0B; padding: 5px; margin: 0px; border: 0; border-bottom: 2px solid #4D261F; } h2{ font-size: 13px; text-align: left; color: #230E0B; margin: 0px 0px; padding: 0px; margin-bottom: 15px; background-color: transparent; border: 0; } h3{ color: #000000; text-align: left; font-family: Arial; font-weight: bold; font-style: italic; padding: 5px; margin: 0px; border: 0; } #header { position: relative; width: 780px; margin: auto; height: 234px; background: #DECEBC url('http://i38.photobucket.com/albums/e107/bel_layouts/food002/chocolate_header.jpg') center top no-repeat; border-left: 1px solid #020202; border-right: 1px solid #020202; } #container { position: relative; top: 0px; width: 780px; margin: auto; padding-top: 60px; background: #DECEBC url('http://i38.photobucket.com/albums/e107/bel_layouts/food002/chocolate_melting.jpg') no-repeat center top; border-left: 1px solid #020202; border-right: 1px solid #020202; } /* friends list user account */ #leftbar{ position: absolute; width: 170px; border: 0; background-color: transparent; top: 336px; left: 50%; margin: 0px -380px 0px -380px; } /* friends list comm account */ div#container #leftbar{ top: 60px; left: 0; margin: 0 !important; margin: 0 0 0 -5px; } /* friends list user account */ #rightbar{ position: absolute; width: 170px; border: 0; background-color: transparent; top: 336px; left: 50%; right: 0; margin: 0px 218px 0px 218px; } #rightbar h2 { text-align: right; } /* friends list comm account */ div#container #rightbar{ top: 60px; } #leftbar a, #rightbar a { color: #000000; font-weight: normal; text-decoration: none; } #leftbar a:hover, #rightbar a:hover { color: #F4EFEA; } #leftbar .calendarActive a { color: #61492F; background-color: transparent; padding: 0px; font-weight: normal; } #leftbar .calendarActive a:hover { color: #FFFFFF; } .sidebox{ border: 0; background-color: transparent; margin: 10px; padding: 5px 5px 25px 5px; background: transparent url('http://i38.photobucket.com/albums/e107/bel_layouts/food002/chocolate_backside.gif') no-repeat center top; } .sidebox h2{ border: 0; font-size: 13px; text-align: left; margin: 0px 0px; padding: 0px; margin-bottom: 15px; background-color: transparent; border-bottom: 1px solid #4D261F; color: #230E0B; } .blurb { color: #000000; padding-bottom: 25px; } .sidebox div a img { display: none; } .sidebox div span.ljuser a img { display: inline; } ul.links{ margin: 0px 0px; padding: 2px 0px 2px 0px; color: #000000; list-style-type: none; } li.links { margin-left: 5px; } li.links a { display: block; padding: 5px 0px 5px 0px; border-bottom: 1px solid #230E0B; text-decoration: none; width: 130px; font-family: Verdana, Arial; } li.links a:hover { font-weight: bold; background: transparent url('http://i38.photobucket.com/albums/e107/bel_layouts/food002/chocolate_bar.jpg') repeat center top; } li.links_header{ font-size: 11px; border-bottom: 1px solid #000000; padding-top: 7px; } .sidebox table { background-color: transparent; } .calendarActive{ font-weight: bold; } .calendarActive a: link, .calendarActive a: visited { color: #000000; font-weight: bold; text-decoration: none; } .calendarActive a:hover { color: #230E0B; } #entries{ position: relative; margin: 0px 160px 0px 160px; text-align: center; background-color: transparent; border: 0; padding: 5px 5px 25px 5px; } #readme { text-align: justify; padding: 2px; } div.entrylinks { font-family: Verdana; font-size: 8pt; text-align: right; padding: 2px 10px 2px 10px; line-height: 20px; margin: 0px 0px 0px 0px; border-top: 1px solid #404040; } div.entrylinks a { background-color: transparent; text-decoration: none; margin: 2px; padding: 2px; } div.entrylinks a:hover { background-color: transparent; } div.entrylinks img { border: 0px; text-decoration: none; } div.commentlinks { font-family: Verdana; font-size: 8pt; padding: 2px 10px 2px 10px; line-height: 20px; } div.commentlinks a { background-color: transparent; text-decoration: none; margin: 2px; padding: 2px; } div.commentlinks a:hover { background-color: transparent; } div.commentlinks img { border: 0px; text-decoration: none; } div.entry{ border: 0px; background-color: transparent; padding: 5px 5px 10px 5px; margin-bottom: 40px; background: transparent url('http://i38.photobucket.com/albums/e107/bel_layouts/food002/chocolate_backentr.jpg') no-repeat center bottom; } div.entry h1{ text-transform: uppercase; color: #230E0B; font-size: 8pt; font-weight: bold; letter-spacing: 1.5px; text-align: left; padding: 3px; margin-right: 0; border: 0; background-color: transparent; } .entrytext{ font-family: Verdana; font-size: 8pt; text-align: justify; color: #000000; width: 420px; margin-top: 10px; line-height: 16px; overflow: auto; } .aboutentry{ text-align: left; font-weight: normal; background-color: #E8DDD0; border-top: 1px solid #FFFFFF; border-right: 1px solid #404040; border-left: 1px solid #FFFFFF; padding-top: 5px; padding-bottom: 5px; } div.ljtags { margin: 0; margin-top: 6px; font-style: italic; font-weight: normal; } .userpic { margin: 5px; } .userpic2 { position: relative; float: left; padding: 0px 5px 5px 0px; margin: 0px 0px 0px 0px; } .userpic_reply { position: relative; float: left; padding: 5px; } .moodpic { float: right; padding-bottom: 5px; } .nosubject { font-style: italic; } .replyform { text-align: left; clear: both; padding-top: 10px; } .replyform textarea { width: 98% !important; } .replyform input { border: 1px solid #4D261F; font-size: 11px; } .replyform input: hover { background-color: #F4EFEA; } .replyform input#talkpostfromremote { border: 0; } .replyform input#prop_opt_preformatted, .replyform input#spellcheck { border: 0; } .comment_postedby { text-align: left; font-weight: bold; background-color: #E8DDD0; border-top: 1px solid #FFFFFF; border-right: 1px solid #404040; border-left: 1px solid #FFFFFF; } .comment_date{ text-align: left; background-color: #E8DDD0; border-right: 1px solid #404040; border-left: 1px solid #FFFFFF; } .comment_info .comment_date{ padding-bottom: 8px; } .comment_subject { text-transform: uppercase; color: #230E0B; font-size: 8pt; font-weight: bold; letter-spacing: 1.5px; text-align: left; padding: 3px; margin-right: 0; background-color: transparent; } .comment_wrapper{ border: 0px; background-color: transparent; padding: 5px 5px 10px 5px; margin-bottom: 40px; background: transparent url('http://i38.photobucket.com/albums/e107/bel_layouts/food002/chocolate_backentr.jpg') no-repeat center bottom; } .comment_info { width: 95%; } .comment_links { text-align: right; padding: 3px; margin: 0px; border: 0; border-top: 1px solid #404040; } .comment_info .comment_date, .comment_info .comment_postedby { background-color: transparent; border: 0; } .comment_links a { padding: 2px; text-decoration: none; } .comment_child { margin: 0px 0px 0px 20px; } .comment_child .entrytext { width: auto; } .minicomment { padding: 4px; border: 1px solid #BAA495; } .minicommentholder { border: 1px solid #BAA495; } div .systemmessage a { text-decoration: none; }
| SPECIAL INSTRUCTIONS |
Preparing the code:
- Copy the CSS code and paste it in the Notepad.
- If you decided to host the images in your own server, replace every i38.photobucket.com/albums/e107/bel_layouts/food002 by the server address where you uploaded the images.
Configuring the layout:
- In the LJ page, go to Journal >> Change Journal Theme.
- If you're using S1 style do the following. If not, skip this step: Click in the link Switch to S2 in the blue box on the right side of the page. Then, click in the button "Yes, I want to upgrade to S2".
- In the 2. Select a New Theme section, type 3 Column in the search box. Then select one of the themes listed and click in Apply Theme.
- Click in the button Customise your theme, in the bottom on the right side.
- Click in the option Custom CSS and under Use layout's stylesheet(s) choose No (THIS IS VERY IMPORTANT!). Then copy the CSS from the Notepad and paste it in the field Custom stylesheet.
- Then you can navigate through the links in the Customize Your Theme and personalize other things as you wish, like going to the Text option and entering a personalized text inside the Blurb Text, for example.
- Click in the button Save Changes and it's done.
Cross-posted to layouts_for_fun, freelayouts and freelayouts_s2.