Layout: #3 - "Frances The Mute"
Featuring Omar Rodriguez-Lopez and lyrics from 'Frances The Mute'.
I promise the next layout I make will have no blue or green in it :p
Please:
- Comment on this post if you use the layout
- credit plush_designs in your userinfo and/or somewhere on your journal
- do not claim you made the layout
- do not redistribute
- do not direct link the images
Info Layout Name:Frances The Mute Account Types:All account levels Layout Style: S2 Flexible Squares Tested In:Firefox 1, Internet Explorer 6 (meta info looks a bit shoddy in IE) Screen Resolutions:800x600 or higher Credits:Textures by Trextures. Background by Squidfingers, recoloured by me. Font in header is called 'Alpha Mac'. The coding for this layout was found at thefulcrum, so I take no credit for that, only for the images and colour theme I've used. Customizing:If you want to change the header and/or colour theme, feel free to do so! A link back to plush_designs would be cool, but is not required. The only time a link is required is if you use this layout as it is here with no changes made. Notes:You need to have your journal title enabled for this layout to work.
Click the image above to view the full-page screenshot.
(Please ignore the non-matched up parts of the background in this screencap. It will not be like that when you use the layout. It's just a screencapping mess up.)
Directions Go to Manage:Customize On the "Basics" tab:make sure S2 is chosen from the Style System box. Click "save changes". On the "Look And Feel" tab:choose "Flexible Squares" from the dropdown menu in the Layout & Language box.
Click "save changes". On the "Custom Options" tab:select the following:
Images Please save the images to your computer and upload them to an image hosting service such as Photobucket or ImageShack. Remember to change the URLs in the style sheet!
The Code Copy and paste this into the above mentioned "custom stylesheet" box on the "Custom Options" tab. Custom Style Sheet
/* Template: (#03) Frances The Mute */ /* Date: March 30, 2007 */ /* S2 Style: Flexible Squares */ /* Available at http://community.livejournal.com/plush_designs/ */ /* Made by Sam a.k.a. purple-ivy.livejournal.com */ /* Note the original layout coding was by http://community.livejournal.com/thefulcrum */ /* ------------------------------ */ /* ------------ MAIN ------------ */ /* ------------------------------ */ html { margin: 0px; padding: 0px; } body { margin: 0px; padding: 0px; background: #3d5043; background:url(http://yoursite.com/03-omar-bg.gif) top left repeat #b2b577 fixed; color: #657865; font-size: 11px; font-family: verdana, tahoma, arial, sans-serif; text-align: center; } a, a:link, a:visited { color: #1e3726; text-decoration: none; font-weight: bold; } a:hover { text-decoration: none; } blockquote { margin: 10px 10px; padding: 10px 10px 10px 10px; border: 1px solid #657865; background: #889988; color: #1e3726; line-height: 18px; text-align: justify; } code, kbd, pre, tt { font-family: monospace; } /* --------------------------------------------- */ /* ------------ CONTAINING ELEMENTS ------------ */ /* --------------------------------------------- */ #content { width: 780px; margin: 0px auto; padding: 20px 0px 0px 0px; text-align: left; background: #889988; border-left: 10px solid #657865; border-right: 10px solid #657865; } #header { margin: 0px; padding: 0px; background: #889988; text-align: left; } #maincontent { margin: 20px 220px 0px 0px; text-align: left; } #sidebar { float: right; width: 200px; margin: 20px 0px 0px 0px; padding: 20px 0px; border: 1px solid #0d1b27; background: #354f3d; text-align: left; } #footer { margin: 0px; padding: 0px; background: #889988; text-align: right; } /* -------------------------------- */ /* ------------ HEADER ------------ */ /* -------------------------------- */ ul.navheader { margin: 0px; padding: 2px 0px 1px 0px; border-bottom: 10px solid #0d1b27; font-size: 12px; line-height: 24px; text-transform: lowercase; white-space: nowrap; } .navheader li { margin: 0px; padding: 0px; display: inline; list-style-type: none; } .navheader li a { padding: 6px 20px; color: #657865; font-size: 12px; line-height: 24px; text-transform: lowercase; } .navheader a:link, .navheader a:visited, .navheader a:active { padding: 6px 20px; border-left: 1px solid #0d1b27; border-top: 1px solid #0d1b27; border-right: 1px solid #0d1b27; background: #354f3d; color: #657865; text-decoration: none; } .navheader a:hover { border-left: 1px solid #0d1b27; border-top: 1px solid #0d1b27; border-right: 1px solid #0d1b27; background: #0d1b27; color: #354f3d; text-decoration: none; } li.view { margin: 0px; padding: 6px 20px; border-left: 1px solid #0d1b27; border-top: 1px solid #0d1b27; border-right: 1px solid #0d1b27; background: #0d1b27; color: #889988; font-weight: bold; } .title { padding: 0; border-left: 1px solid #0d1b27; border-right: 1px solid #0d1b27; border-bottom: 10px solid #0d1b27; background:url(http://yoursite.com/03-omar-header.jpg) top left no-repeat #354f3d; color: #657865; font-size: 0px; font-family: century gothic, tahoma, verdana, arial, sans-serif; text-transform: uppercase; text-align: right; letter-spacing: 3px; height:411px; } .subtitle { display: none; } /* --------------------------------- */ /* ------------ SIDEBAR ------------ */ /* --------------------------------- */ div#sidebar a, div#sidebar a:link, div#sidebar a:visited { } div#sidebar a:hover { text-decoration: none; } .defaultuserpic { margin: 0px 20px; padding: 20px 0px; background: #0d1b27; text-align: center; } .defaultuserpic a img {border: 10px solid #657865;} .defaultuserpic a:hover img {border: 10px solid #1e3726;} .sbarheader { margin: 0px; padding: 0px; } .sbarbody { margin: 0px 0px 0px 0px; padding: 0px 20px 0px 20px; } .sbarbody2 { padding-left:18px; padding-right:18px; padding-top:0px; padding-bottom:0px; } table.calendar { margin-right: auto; margin-left: auto; } .sbarcalendar { border: 1px solid #1e3726; text-align: center; font-size: 11px; } .sbarcalendarposts { border: 1px solid #657865; text-align: center; font-size: 11px; } ul.sbarlist { margin: 0px; padding: 0px 0px 10px 0px; list-style: none; } li.sbaritem { } li.sbaritem a { display: block; padding: 4px 0px; } li.sbaritem a:hover { background: #657865; color: #1e3726; } li.sbartitle { margin: 20px 0px 0px 0px; padding: 10px 0px 0px 0px; color: #1e3726; font-family: century gothic, tahoma, arial, verdana, sans-serif; font-size: 14px; font-weight: bold; text-transform: uppercase; } /* -------------------------------------- */ /* ------------ MAIN CONTENT ------------ */ /* -------------------------------------- */ .subcontent { margin: 0px 0px 20px 0px; padding: 20px; border: 1px solid #0d1b27; background: #354f3d; } .entry ol, .entry ul { margin:0px; margin-left:15px; padding:0px; padding-left:20px; line-height: 15px; } .entry_text { line-height: 22px; } .entry a:hover { background: #657865; color: #1e3726; } .userpic, .userpicfriends { position: relative; float: right; z-index: 15; margin: 0px 0px 5px 5px; text-align: center; background: #354f3d !important; } .userpic img, .userpicfriends img { border: 5px solid #657865; } .date { color: #1e3726; font-size: 12px; text-transform: uppercase; } .subject { padding: 8px 0px; color: #1e3726; font-family: century gothic, tahoma, arial, verdana, sans-serif; font-size: 18px; text-transform: uppercase; } .subject a, .subject a:link, .subject a:visited { } .subject a:hover { } .datesubject { } .currents, .currentmood, .currentmusic, .currentlocation { margin: 0px 10px 0px 0px; } .currentlocation a {font-weight: normal;} .currentmood img {display: none;} .ljtags { margin: 10px 0px 0px 0px; padding: 10px 0px 0px 0px; border-top: 1px solid #1e3726; font-weight: bold; } .ljtags a {font-weight: normal;} .comments { margin: 15px 0px 0px 0px; padding: 10px 0px 0px 0px; border-top: 1px solid #1e3726; color: #1e3726; text-align: right; } div.comments a, div.comments a:link, div.comments a:visited { } div.comments a:hover { color: #1e3726; text-decoration: none; } /* ----------------------------------------------------- */ /* ------------ CONTENT: ENTRY, REPLY PAGES ------------ */ /* ----------------------------------------------------- */ .datesubjectcomment { padding: 5px; margin-top: 20px; } .userpiccomment { position: relative; top: -30px; left: 0px; padding: 5px; margin: 10px 10px -20px 10px; z-index: 15; float: right; } .box { border-style: solid; border-width: 1px 0px 0px 0px; padding: 10px; clear: left; } input, textarea { } textarea.textbox { width: 100% !important; } .reply { position: relative; margin: 20px 30px 10px 30px; padding: 25px 10px 10px 10px; text-align: left; } .replytosubject { font-weight: bold; } .commentreply { position: relative; margin: 10px; } .commentbox { padding: 10px; margin: 10px; } .datesubjectcomment a:link, .datesubjectcomment a:visited { } .datesubjectcomment a:hover { } .commentboxpartial { padding: 10px; margin: 10px; } .commentinfo { margin-top: 10px; width: 100%; } /* ------------------------------------------- */ /* ------------ CONTENT: ARCHIVES ------------ */ /* ------------------------------------------- */ ul.year { text-align: center; padding-bottom: 40px; } ul.year li { display: inline; color: #1e3726; font-size: 18px; font-weight: bold; } table.yeartable { margin-left: auto; margin-right: auto; width: 90%; } table.yeartable td.yeardate, table.yeartable td.yearday { border: 1px solid #0d1b27; } table.yeartable td.yearday { background: #354f3d; text-align: center; } td.yearmonth { border-style: none; font-size: 12px; font-weight: bold; } /* -------------------------------- */ /* ------------ FOOTER ------------ */ /* -------------------------------- */ ul.navfooter { margin: 0px; padding: 1px 0px 2px 0px; border-top: 10px solid #0d1b27; background: #889988; font-size: 12px; line-height: 24px; text-transform: lowercase; white-space: nowrap; } .navfooter li { margin: 0px; padding: 0px; display: inline; list-style-type: none; } .navfooter a { padding: 6px 20px; color: #0d1b27; font-size: 12px; line-height: 24px; text-transform: lowercase; } .navfooter a:link, .navfooter a:visited, .navfooter a:active { padding: 6px 20px; border-left: 1px solid #0d1b27; border-bottom: 1px solid #0d1b27; border-right: 1px solid #0d1b27; background: #354f3d; color: #657865; text-decoration: none; } .navfooter a:hover { border-left: 1px solid #0d1b27; border-bottom: 1px solid #0d1b27; border-right: 1px solid #0d1b27; background: #0d1b27; color: #483121; text-decoration: none; } li.viewing { margin: 0px; padding: 6px 20px; border-left: 1px solid #0d1b27; border-bottom: 1px solid #0d1b27; border-right: 1px solid #0d1b27; background: #0d1b27; color: #889988; font-weight: bold; } .clearfoot { display: none; clear: both; height: 0px; } /* ------------------------------ */ /* ------------ MISC ------------ */ /* ------------------------------ */ .clear { height: 0px; } .skiplinks { text-align: center; } .headerimage { } .separator{ height: 0px; } You're now finished! If you have any questions regarding this layout, using the layout or customizing it, please leave a comment on this post and I'll see if I can help you.
I promise the next layout I make will have no blue or green in it :p
Please:
- Comment on this post if you use the layout
- credit plush_designs in your userinfo and/or somewhere on your journal
- do not claim you made the layout
- do not redistribute
- do not direct link the images
Info Layout Name:Frances The Mute Account Types:All account levels Layout Style: S2 Flexible Squares Tested In:Firefox 1, Internet Explorer 6 (meta info looks a bit shoddy in IE) Screen Resolutions:800x600 or higher Credits:Textures by Trextures. Background by Squidfingers, recoloured by me. Font in header is called 'Alpha Mac'. The coding for this layout was found at thefulcrum, so I take no credit for that, only for the images and colour theme I've used. Customizing:If you want to change the header and/or colour theme, feel free to do so! A link back to plush_designs would be cool, but is not required. The only time a link is required is if you use this layout as it is here with no changes made. Notes:You need to have your journal title enabled for this layout to work.
Click the image above to view the full-page screenshot.
(Please ignore the non-matched up parts of the background in this screencap. It will not be like that when you use the layout. It's just a screencapping mess up.)
Directions Go to Manage:Customize On the "Basics" tab:make sure S2 is chosen from the Style System box. Click "save changes". On the "Look And Feel" tab:choose "Flexible Squares" from the dropdown menu in the Layout & Language box.
Click "save changes". On the "Custom Options" tab:select the following:
- click on Section: Presentation
- Set the user picture position for each entry: choose "right" from the menu.
- click on Section: Sidebar
- Show the sidebar?: choose "yes" from the menu.
- Set sidebar position: choose "right" from the menu.
- click on Section: Custom CSS
- Use layout's stylesheet(s): choose "no" from the menu.
- Use layout's stylesheet(s) when including custom external stylesheet: choose "no" from the menu.
- Use external stylesheets: choose "no" from the menu.
- Custom external stylesheet URL: leave field blank.
- Custom stylesheet: paste style sheet contents in this box.
Images Please save the images to your computer and upload them to an image hosting service such as Photobucket or ImageShack. Remember to change the URLs in the style sheet!
The Code Copy and paste this into the above mentioned "custom stylesheet" box on the "Custom Options" tab. Custom Style Sheet
/* Template: (#03) Frances The Mute */ /* Date: March 30, 2007 */ /* S2 Style: Flexible Squares */ /* Available at http://community.livejournal.com/plush_designs/ */ /* Made by Sam a.k.a. purple-ivy.livejournal.com */ /* Note the original layout coding was by http://community.livejournal.com/thefulcrum */ /* ------------------------------ */ /* ------------ MAIN ------------ */ /* ------------------------------ */ html { margin: 0px; padding: 0px; } body { margin: 0px; padding: 0px; background: #3d5043; background:url(http://yoursite.com/03-omar-bg.gif) top left repeat #b2b577 fixed; color: #657865; font-size: 11px; font-family: verdana, tahoma, arial, sans-serif; text-align: center; } a, a:link, a:visited { color: #1e3726; text-decoration: none; font-weight: bold; } a:hover { text-decoration: none; } blockquote { margin: 10px 10px; padding: 10px 10px 10px 10px; border: 1px solid #657865; background: #889988; color: #1e3726; line-height: 18px; text-align: justify; } code, kbd, pre, tt { font-family: monospace; } /* --------------------------------------------- */ /* ------------ CONTAINING ELEMENTS ------------ */ /* --------------------------------------------- */ #content { width: 780px; margin: 0px auto; padding: 20px 0px 0px 0px; text-align: left; background: #889988; border-left: 10px solid #657865; border-right: 10px solid #657865; } #header { margin: 0px; padding: 0px; background: #889988; text-align: left; } #maincontent { margin: 20px 220px 0px 0px; text-align: left; } #sidebar { float: right; width: 200px; margin: 20px 0px 0px 0px; padding: 20px 0px; border: 1px solid #0d1b27; background: #354f3d; text-align: left; } #footer { margin: 0px; padding: 0px; background: #889988; text-align: right; } /* -------------------------------- */ /* ------------ HEADER ------------ */ /* -------------------------------- */ ul.navheader { margin: 0px; padding: 2px 0px 1px 0px; border-bottom: 10px solid #0d1b27; font-size: 12px; line-height: 24px; text-transform: lowercase; white-space: nowrap; } .navheader li { margin: 0px; padding: 0px; display: inline; list-style-type: none; } .navheader li a { padding: 6px 20px; color: #657865; font-size: 12px; line-height: 24px; text-transform: lowercase; } .navheader a:link, .navheader a:visited, .navheader a:active { padding: 6px 20px; border-left: 1px solid #0d1b27; border-top: 1px solid #0d1b27; border-right: 1px solid #0d1b27; background: #354f3d; color: #657865; text-decoration: none; } .navheader a:hover { border-left: 1px solid #0d1b27; border-top: 1px solid #0d1b27; border-right: 1px solid #0d1b27; background: #0d1b27; color: #354f3d; text-decoration: none; } li.view { margin: 0px; padding: 6px 20px; border-left: 1px solid #0d1b27; border-top: 1px solid #0d1b27; border-right: 1px solid #0d1b27; background: #0d1b27; color: #889988; font-weight: bold; } .title { padding: 0; border-left: 1px solid #0d1b27; border-right: 1px solid #0d1b27; border-bottom: 10px solid #0d1b27; background:url(http://yoursite.com/03-omar-header.jpg) top left no-repeat #354f3d; color: #657865; font-size: 0px; font-family: century gothic, tahoma, verdana, arial, sans-serif; text-transform: uppercase; text-align: right; letter-spacing: 3px; height:411px; } .subtitle { display: none; } /* --------------------------------- */ /* ------------ SIDEBAR ------------ */ /* --------------------------------- */ div#sidebar a, div#sidebar a:link, div#sidebar a:visited { } div#sidebar a:hover { text-decoration: none; } .defaultuserpic { margin: 0px 20px; padding: 20px 0px; background: #0d1b27; text-align: center; } .defaultuserpic a img {border: 10px solid #657865;} .defaultuserpic a:hover img {border: 10px solid #1e3726;} .sbarheader { margin: 0px; padding: 0px; } .sbarbody { margin: 0px 0px 0px 0px; padding: 0px 20px 0px 20px; } .sbarbody2 { padding-left:18px; padding-right:18px; padding-top:0px; padding-bottom:0px; } table.calendar { margin-right: auto; margin-left: auto; } .sbarcalendar { border: 1px solid #1e3726; text-align: center; font-size: 11px; } .sbarcalendarposts { border: 1px solid #657865; text-align: center; font-size: 11px; } ul.sbarlist { margin: 0px; padding: 0px 0px 10px 0px; list-style: none; } li.sbaritem { } li.sbaritem a { display: block; padding: 4px 0px; } li.sbaritem a:hover { background: #657865; color: #1e3726; } li.sbartitle { margin: 20px 0px 0px 0px; padding: 10px 0px 0px 0px; color: #1e3726; font-family: century gothic, tahoma, arial, verdana, sans-serif; font-size: 14px; font-weight: bold; text-transform: uppercase; } /* -------------------------------------- */ /* ------------ MAIN CONTENT ------------ */ /* -------------------------------------- */ .subcontent { margin: 0px 0px 20px 0px; padding: 20px; border: 1px solid #0d1b27; background: #354f3d; } .entry ol, .entry ul { margin:0px; margin-left:15px; padding:0px; padding-left:20px; line-height: 15px; } .entry_text { line-height: 22px; } .entry a:hover { background: #657865; color: #1e3726; } .userpic, .userpicfriends { position: relative; float: right; z-index: 15; margin: 0px 0px 5px 5px; text-align: center; background: #354f3d !important; } .userpic img, .userpicfriends img { border: 5px solid #657865; } .date { color: #1e3726; font-size: 12px; text-transform: uppercase; } .subject { padding: 8px 0px; color: #1e3726; font-family: century gothic, tahoma, arial, verdana, sans-serif; font-size: 18px; text-transform: uppercase; } .subject a, .subject a:link, .subject a:visited { } .subject a:hover { } .datesubject { } .currents, .currentmood, .currentmusic, .currentlocation { margin: 0px 10px 0px 0px; } .currentlocation a {font-weight: normal;} .currentmood img {display: none;} .ljtags { margin: 10px 0px 0px 0px; padding: 10px 0px 0px 0px; border-top: 1px solid #1e3726; font-weight: bold; } .ljtags a {font-weight: normal;} .comments { margin: 15px 0px 0px 0px; padding: 10px 0px 0px 0px; border-top: 1px solid #1e3726; color: #1e3726; text-align: right; } div.comments a, div.comments a:link, div.comments a:visited { } div.comments a:hover { color: #1e3726; text-decoration: none; } /* ----------------------------------------------------- */ /* ------------ CONTENT: ENTRY, REPLY PAGES ------------ */ /* ----------------------------------------------------- */ .datesubjectcomment { padding: 5px; margin-top: 20px; } .userpiccomment { position: relative; top: -30px; left: 0px; padding: 5px; margin: 10px 10px -20px 10px; z-index: 15; float: right; } .box { border-style: solid; border-width: 1px 0px 0px 0px; padding: 10px; clear: left; } input, textarea { } textarea.textbox { width: 100% !important; } .reply { position: relative; margin: 20px 30px 10px 30px; padding: 25px 10px 10px 10px; text-align: left; } .replytosubject { font-weight: bold; } .commentreply { position: relative; margin: 10px; } .commentbox { padding: 10px; margin: 10px; } .datesubjectcomment a:link, .datesubjectcomment a:visited { } .datesubjectcomment a:hover { } .commentboxpartial { padding: 10px; margin: 10px; } .commentinfo { margin-top: 10px; width: 100%; } /* ------------------------------------------- */ /* ------------ CONTENT: ARCHIVES ------------ */ /* ------------------------------------------- */ ul.year { text-align: center; padding-bottom: 40px; } ul.year li { display: inline; color: #1e3726; font-size: 18px; font-weight: bold; } table.yeartable { margin-left: auto; margin-right: auto; width: 90%; } table.yeartable td.yeardate, table.yeartable td.yearday { border: 1px solid #0d1b27; } table.yeartable td.yearday { background: #354f3d; text-align: center; } td.yearmonth { border-style: none; font-size: 12px; font-weight: bold; } /* -------------------------------- */ /* ------------ FOOTER ------------ */ /* -------------------------------- */ ul.navfooter { margin: 0px; padding: 1px 0px 2px 0px; border-top: 10px solid #0d1b27; background: #889988; font-size: 12px; line-height: 24px; text-transform: lowercase; white-space: nowrap; } .navfooter li { margin: 0px; padding: 0px; display: inline; list-style-type: none; } .navfooter a { padding: 6px 20px; color: #0d1b27; font-size: 12px; line-height: 24px; text-transform: lowercase; } .navfooter a:link, .navfooter a:visited, .navfooter a:active { padding: 6px 20px; border-left: 1px solid #0d1b27; border-bottom: 1px solid #0d1b27; border-right: 1px solid #0d1b27; background: #354f3d; color: #657865; text-decoration: none; } .navfooter a:hover { border-left: 1px solid #0d1b27; border-bottom: 1px solid #0d1b27; border-right: 1px solid #0d1b27; background: #0d1b27; color: #483121; text-decoration: none; } li.viewing { margin: 0px; padding: 6px 20px; border-left: 1px solid #0d1b27; border-bottom: 1px solid #0d1b27; border-right: 1px solid #0d1b27; background: #0d1b27; color: #889988; font-weight: bold; } .clearfoot { display: none; clear: both; height: 0px; } /* ------------------------------ */ /* ------------ MISC ------------ */ /* ------------------------------ */ .clear { height: 0px; } .skiplinks { text-align: center; } .headerimage { } .separator{ height: 0px; } You're now finished! If you have any questions regarding this layout, using the layout or customizing it, please leave a comment on this post and I'll see if I can help you.
