Miscellaneous - Animals - Who let the dogs out?

Jul 23, 2008 10:01

Heeeeee, I'm back making layouts!!! You know, I missed this. This layout I started a long while ago, but just now I had time to finish it. It's in response to those people who requested a layout with puppies after I made the one with the kitty. It's a shareable layout and I hope you enjoy it ;-).

Style: S2 Smooth Sailing
Title: Miscellaneous - Animals - Who let the dogs out?
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 site iStockPhoto. Other resources (like brushes, textures and so on) are credited at my LJ Info Page.
Notes: For basic (free) and paid accounts and it works with Nav bar strip and Sponsored Plus Account.

Preview:



Working preview:bel_misc005



| 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. The FRIENDS ONLY BANNER and the ICON are optional.

Header:
http://i38.photobucket.com/albums/e107/bel_layouts/misc005/wholetthedogsout_header.jpg

Backgrounds:
http://i38.photobucket.com/albums/e107/bel_layouts/misc005/wholetthedogsout_back1.png
http://i38.photobucket.com/albums/e107/bel_layouts/misc005/wholetthedogsout_back2.png

Friends Only Banner:


Icon:


Extra images:
http://i38.photobucket.com/albums/e107/bel_layouts/misc005/wholetthedogsout_bones.png
http://i38.photobucket.com/albums/e107/bel_layouts/misc005/wholetthedogsout_doghouse.png
http://i38.photobucket.com/albums/e107/bel_layouts/misc005/wholetthedogsout_paws.png
http://i38.photobucket.com/albums/e107/bel_layouts/misc005/wholetthedogsout_ball.gif
http://i38.photobucket.com/albums/e107/bel_layouts/misc005/wholetthedogsout_credits.jpg

| CUSTOM COLORS |

You don't need to configurate the colors.

| CSS CODE |

/* COLORS, BACKGROUND IMAGE AND GENERAL TEXT SETTINGS */ body { font-family: Tahoma, Arial; font-size: 9px; text-align: justify; letter-spacing: 1px; background: #EFD4A6 url(http://i38.photobucket.com/albums/e107/bel_layouts/misc005/wholetthedogsout_back1.png) repeat-x; font: normal small sans-serif; color: #000000; margin: 0; } /* PAGE HEADER AND HEADER IMAGE SETTINGS */ .pageheaderblock { background: transparent url(http://i38.photobucket.com/albums/e107/bel_layouts/misc005/wholetthedogsout_header.jpg) no-repeat top center; width: 780px; padding-top: 270px; margin: auto; text-align: center; border: 0; } /* PAGE SETTINGS */ .pageblock { width: 780px; margin: auto; border: 0px solid #C9CCB9; background-color: #FFFFFF; font: normal small sans-serif; color: #000000; } /* GENERAL LINKS */ a:link,a:active,a:visited { font-weight: bold; text-decoration: none; color: #000000; } a:hover { cursor: e-resize; font-weight: bold; text-decoration: none; color: #B60203; } blockquote { font-family: "Times New Roman", Verdana; font-size: 11px; font-style: italic; text-align: justfiy; background-color: #FBF4EA; margin: 15px; padding: 15px; border-left: 3px solid #EFD4A6; } /* HEADER TITLE AND SUBTITLE */ .header-title,.header-subtitle { display: none; } /* NAVIGATION BAR */ .header-menu { position: relative; font-family: verdana, sans-serif, Arial; text-align: center; background-color: transparent; margin: auto; width: auto; border: 0; margin-top: 6px; } .header-menu ul { margin: 0px; padding: 0px; } .header-menu li { position: relative; display: inline; padding: 0px; left: 0px; right: 0px; } /* NAVIGATION BAR LINKS */ .header-menu a, .header-menu a:visited, .header-menu a:active { font-size: 10px; line-height: 16px; font-weight: bold; padding: 18px 10px 18px 10px; text-decoration: none; color: #3E2002; background-color: transparent; } .header-menu a:hover { text-decoration: none; color: #000000; background: transparent url(http://i38.photobucket.com/albums/e107/bel_layouts/misc005/wholetthedogsout_ball.gif) no-repeat bottom center; } /* TITLE IN EACH PAGE (entries, friends, calendar) */ .body-title { font-family: "Times New Roman", Verdana; font-weight: bold; font-size: 11px; text-align: center; text-transform: uppercase; letter-spacing: 3px; color: #D7CFBF; line-height: 16px; width: 750px; margin: auto; margin-top: 20px; background-color: #000000; padding: 2px 0px 2px 0px; display: none; } .body-midtitle { font-family: Georgia, Verdana; font-size: 8pt; color: #FAF9F5; text-align: left; padding: 2px 0px 2px 0px; background-color: transparent; margin: auto; display: none; } /* MORE ENTRIES AND SIDEBAR BLOCK SETTINGS */ .bodyblock { color: #000000; padding: 35px 10px 0px 10px; margin: auto; width: auto; margin-top: 20px; border: 1px dashed #3E2002; background: #FFFFFF url(http://i38.photobucket.com/albums/e107/bel_layouts/misc005/wholetthedogsout_back2.png) repeat-x; } /* TITLE PAGE (entries, friends etc) SETTINGS */ .bodyheaderblock { border: 0; background-color: transparent; padding: 0px; margin: auto; } /* NAVIGATION LINKS (previous entries/top of page at the bottom) */ .bodynavblock { color: #000000; background-color: transparent; margin: 0; padding: 8px; text-align: right; border: 0; } .bodynavblock a, .bodynavblock a:visited { color: #000000; } .bodynavblock a:hover { color: #B60203; } /* SIDEBAR SETTINGS */ .sidebar { font-size: 11px; margin: 0px 10px 0px 0px; padding: 5px 0px 200px 0px; width: 188px; border: 0px solid #690303; background: none; } /* SIDEBAR BOX - BACKGROUND, BORDER, TEXT */ .sidebox { color: #000000; margin-bottom: 10px; padding: 0px; border: 0px solid #C9CCB9; background: none; } /* SIDEBAR - BOX TITLES */ .sideboxTitle { font-family: Verdana, Arial; font-weight: bold; text-transform: uppercase; font-size: 10px; margin: 0; padding: 0px 0px 0px 30px; background: transparent url(http://i38.photobucket.com/albums/e107/bel_layouts/misc005/wholetthedogsout_bones.png) no-repeat bottom left; border-bottom: 1px dashed #3E2002; line-height: 40px; } /* SIDEBAR - BOX CONTENTS */ .sideboxContent { font-family: Tahoma, Verdana; font-size: 9px; text-align: left; padding-left: 5px; } /* PROFILE */ .sidebox #profile { text-align: left; text-transform: lowercase; line-height: 16px; } #profile a, #profile a:active, #profile a:visited { color: #000000; } #profile a:hover { color: #B60203; } /* PROFILE USERPIC */ .profile-userpic { border: 0px solid #AF9C8F; padding: 2px; margin-left: 35px; margin-bottom: 15px; } /* PROFILE - user AND name */ .profile-label { font-weight: bold; text-transform: lowercase; } /* TITLE OF EACH LINKS SECTION IN THE SYSTEM LINKS */ .listtitle { display: block; text-decoration: underline; font-weight: bold; line-height: 16px; } /* SYSTEM LINKS IN THE SIDEBAR */ .sidebox #systemlinks { line-height: 13px; } .sidebox #systemlinks a:link, .sidebox #systemlinks a:active, .sidebox #systemlinks a:visited { display: block; font-weight: normal; color: #000000; padding-left: -10px; } .sidebox #systemlinks a:hover { color: #B60203; background-color: #FFFFFF; } /* TAGS LIST IN THE SIDEBAR */ .sidebox #tags_sidebox { line-height: 16px; text-align: left; color: #000000; /* commas color */ } #tags_sidebox a { display: block; margin-bottom: -16px; color: #FFFFFF; } .sidebox #tags_sidebox a:link, .sidebox #tags_sidebox a:active, .sidebox #tags_sidebox a:visited { display: inline; text-decoration: none; font-weight: normal; padding-bottom: 0px; padding-left: 0px; color: #000000; } .sidebox #tags_sidebox a:hover { color: #B60203; } /* FREETEXT IN THE SIDEBAR */ #freetext a:link, #freetext a:active, #freetext a:visited { line-height: 16px; display: block; padding-left: -10px; } #freetext a:hover { color: #B60203; line-height: 16px; display: block; padding-left: -10px; } /* SUMMARY IN THE SIDEBAR */ .summaryList { text-align: left; } .summaryList a:link, .summaryList a:active, .summaryList a:visited { line-height: 16px; font-weight:normal; color: #000000; } .summaryList a:hover { line-height: 16px; color: #B60203; } /* MINI-CALENDAR IN THE SIDEBAR */ .sidebox #latestmonth { text-align: left; } /* MINI-CALENDAR POSITION */ .sidebox #latestmonth table { width: 100%; margin-left: auto; margin-right: auto; margin-top: 2px; } /* SPACE AMONG DAYS IN MINI-CALENDAR */ #latestmonth table td { padding: 1px; text-align: center; color: #553E30; text-transform: uppercase; border: 0px solid #CDCDCD; } /* APPEARANCE OF DAYS IN MINI-CALENDAR */ .latestmonth-inactive { background-color: #FFFFFF; text-align: center; padding: 3px; } .latestmonth-active { background-color: #FFFFFF; text-align: center; padding: 3px; } .latestmonth-active a { text-decoration: none; } .latestmonth-active a:hover { color: #B60203; } /* APPEARANCE OF SEARCH AND COMMENTS BUTTONS */ .sidebox #search { text-align: left; } input { font-family: Verdana, Arial; font-size: 9.5px; text-transform: lowercase; letter-spacing: 1px; color: #000000; background-color: #FFFFFF; line-height: 20px; margin-bottom: 2px; margin-top: 2px; } /* WIDTH OF THE SEARCH BOX */ #SearchTerm { position: relative; left: 0; width: 90%; margin-left: 0; } /* CATEGORY LISTBOX IN SEARCH */ #SearchType, select { font-family: Verdana, Arial; font-size: 9.5px; text-transform: lowercase; letter-spacing: 1px; line-height: 20px; color: #000000; width: 100px; background-color: #FFFFFF; margin-bottom: 2px; margin-top: 2px; } /* ENTRIES BLOCK SETTINGS */ .entryHolder { font-family: Tahoma, Verdana; font-size: 8pt; color: #000000; margin: 0px 0px 20px 15px; padding-bottom: 10px; background: transparent url(http://i38.photobucket.com/albums/e107/bel_layouts/misc005/wholetthedogsout_paws.png) no-repeat left top; border: 0px solid #D7CFBF; } .entryHeader { text-align: left; padding: 5px 5px 0px 38px; margin-right: 0px; height: 40px; border: 0; border-bottom: 1px dashed #3E2002; background-color: transparent; } .entryHeader a{ color: #000000; } /* DATE IN THE ENTRIES */ .entryHeaderDate { font-family: Arial, Verdana; font-size: 7pt; font-weight: bold; text-align: left; text-transform: lowercase; color: #000000; padding: 5px 5px 5px 5px; } .entryHeaderDate a { color: #000000; text-decoration: none; } .entryHeaderDate a:hover { color: #B60203; text-decoration: underline; } /* SECURITY ICON */ .entryHeaderSubject img { margin-bottom: -2px; } /* ENTRIES SUBJECT */ .entryHeaderSubject { display: block; font-family: Verdana, Arial; font-weight: bold; text-transform: uppercase; text-align: left; font-size: 10px; color: #3E2002; padding-left: 4px; } .entryHeaderSubject a { color: #000000; text-decoration: none; } /* DISTANCE BETWEEN ICON AND ENTRIES */ .entryUserinfo { text-align: center; margin: 0px 0px 8px 8px; background-color: transparent; } /* ICON IN THE ENTRIES */ .entryUserinfo-usericon img { border: 1px solid #FFFFFF; margin-top: 5px; padding: 0px; } /* USERNAME IN THE FRIENDS PAGE */ .entryUserinfo-username { text-align: center; margin-top: 5px; } /* POSITION OF THE ENTRIES TEXT */ .entryText { font-family: Verdana, Arial; font-size: 7.5pt; letter-spacing: 0px; padding: 6px 0px 0px 0px; color: #000000; background-color: transparent; margin: 5px 4px 10px 4px; width: 400px; overflow: auto; } /* MOOD AND MUSIC */ .entryMetadata { padding-left: 6px; text-transform: lowercase; color: #000000; } .entryMetadata ul { margin: 0px; padding: 0px; } .entryMetadata li { list-style: none; padding-right: 0; } .entryMetadata-label { font-weight: bold; padding-right: 4px; } /* TAGS LINKS IN MOOD AND MUSIC */ .entryMetadata-content a:link, .entryMetadata-content a:active, .entryMetadata-content a:visited { color: #000000; font-weight: normal; } .entryMetadata-content a:hover { color: #B60203; text-decoration: underline; } /* COMMENTS IN THE ENTRIES */ .entryLinkbar { font-size: 10px; color: #430404; text-align: center; background-color: transparent; padding: 90px 5px 5px 5px; margin: 10px 5px 0px 0px; background: transparent url(http://i38.photobucket.com/albums/e107/bel_layouts/misc005/wholetthedogsout_doghouse.png) no-repeat right top; } .entryLinkbar ul { margin: 0px; padding: 0px; } .entryLinkbar li { padding: 0px 5px 0px 5px; margin: 0px; display: inline; } .entryLinkbar a, .entryLinkbar a:link, .entryLinkbar a:visited { text-decoration: none; padding-left: 8px; background-color: transparent; } .entryLinkbar a:hover, .entryLinkbar a:active { color: #B60203; text-decoration: none; } /* COMMENTS PAGE */ .commentHolder { font-family: Tahoma, Verdana; font-size: 9pt; text-align: left; color: #000000; background-color: transparent; margin: 4px 0px 4px 0px; border: 0; } .commentUserinfo { font-size: 8pt; text-align: center; background-color: transparent; margin: 0px 8px 8px 0px; } .commentUserinfo-usericon img { border: 1px solid #000000; padding: 2px; margin-top: 6px; } .commentText { font-family: Tahoma, Verdana; font-size: 8pt; padding: 6px; width: 90%; } .commentHeader { background-color: #53390F; color: #FFFFFF; font-size: 10px; padding: 4px 0px 4px 8px; } .commentHeader a{ color: #F3F1E2; } .commentHeaderScreened { font-size: 12px; background-color: #FFFFFF; padding: 4px 4px 4px 8px; } .commentHeaderSubject { font-weight: bold; padding: 4px 0px 4px 8px; } .commentLinkbar { font-size: 11px; color: #430404; text-align: center; padding-top: 4px; padding-bottom: 4px; } .commentLinkbar ul { margin: 0px; padding: 0px; } .commentLinkbar li { padding: 0px 5px 0px 5px; margin: 0px; display: inline; } .commentLinkbar a, .commentLinkbar a:link, .commentLinkbar a:visited { color: #000000; text-decoration: none; } .commentLinkbar a:hover, .commentLinkbar a:active { color: #B60203; text-decoration: none; } .replyform { padding-left: 10px; background-color: transparent; } .replyform textarea { width: 90%; } /* CALENDAR PAGE */ .yearlinks{ text-align: right; } .yearlink{ padding-left: 4px; padding-right: 4px; } .month { width: 90%; border: 1px solid #FFFFFF; margin: 8px 8px 8px 40px; } .daysubjects { color: #000000; padding: 8px 8px 8px 40px; } .daytitles { text-align: center; color: #000000; background-color: #FFFFFF; border: 0; } .day-blank { border: 1px solid #FFFFFF; } .day { border: 1px solid #FFFFFF; } .day-date { text-align: center; color: #000000; width: 50%; border-right: 1px solid #000000; border-bottom: 1px solid #000000; } .day-count { float: right; text-align: center; font-size: 12px; width: 50%; } .day-count a { text-decoration: none; color: #000000; } .day-count a:hover { text-decoration: none; color: #B60203; } /* TAGS PAGE */ .tagstable, .tagstable td { border: 1px solid #3E2002; text-align: left; } .tagstable { font-size:90%; width: 90%; } /* FOOTER SETTINGS */ .pagefooterblock { text-transform: lowercase; text-align: right; padding: 50px 0px 10px 0px; margin: auto; width: 780px; border: 0; background: #EFD4A6 url(http://i38.photobucket.com/albums/e107/bel_layouts/misc005/wholetthedogsout_credits.jpg) no-repeat bottom left; } .pagefooterblock a, .pagefooterblock a:link, .pagefooterblock a:visited { color: #000000; text-decoration: none; } .pagefooterblock a:hover, .pagefooterblock a:active { color: #B60203; text-decoration: none; } #footer-menu { text-transform: lowercase; text-align: right; background-color: transparent; } #footer-menu ul { margin: 0px; padding: 0px; } #footer-menu li { display: inline; } #footer-menu a, .footer-menu a:visited { color: #000000; white-space: nowrap; font-family: Georgia, Verdana; text-transform: uppercase; padding-left: 15px; } #footer-menu a:hover { color: #B60203; }

| 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/misc005 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 Smooth Sailing in the search box. Then select one of the themes listed and click in Apply Theme.
- In the 3. Choose a Page Setup section at the bottom of the page, choose "2 Column (sidebar on left)" and click in the button "Apply Layout".
- Then 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 Sidebar link and putting personalized labels or entering personalized texts inside the free text boxes, for example.
- Click in the button Save Changes and it's done.

Cross-posted to layouts_for_fun, freelayouts and freelayouts_s2.

s2 layouts

Previous post Next post
Up