anon_e_mousse (anon_e_mousse) wrote,
@ 2011-11-10 14:55:00

Entry tags:

layout: clean sailing w/colour, layouts, s2: smooth sailing

Clean Sailing with a Dash of Colour

Scribbld Instructions
1. Follow this tutorial to get a Smooth Sailing base layout.

2. Go to "Customize".

2. Select "Customize your theme".

3. Scroll down to where it says "Disable customized comment pages for your journal". Change it to "Yes". (This will disable the comment page that goes ugly after people comment). SAVE CHANGES.

4. Click on Entry Text. Change the section Link text to read comments to 1 // #. This is so only the number of comments appears and fits in the entry footer. SAVE CHANGES.

5. Click on Menu. Change the sections Text used to link to the Previous page (Default), Text used to link to the Previous Recent/Friends page and Text used to link to the Previous Entry page to ←. And change the sections Text used to link to the Next page (Default), Text used to link to the Next Recent/Friends page and Text used to link to the Next Entry page to →. The arrows are neater and take up less room so it doesn't throw the layout out of whack. SAVE CHANGES.

6. Click on sidebar. Delete everything in the Profile Title, the Profile Username Label and the Profile Name Label sections. Change the Free Text Position to </b>2</b>. Then add the following in the Free Text Sidebox Text. (Although you could really add anything. I just find the following is kind of nice)

7. Any other sidebar sections can be changed to hide or in positions 3 to 17. 3 being the section directly under the one just created and 17 being at the bottom of the page. Each section is pretty self explanatory as to what they are. Personally, I have changed all mine to hide except the Links section. SAVE CHANGES.

8. Go to Custom CSS. Choose Yes for using "Base Weblog" stylesheet.

6. Paste in your layout codes in the Custom Stylesheet box. SAVE CHANGES.

Codes:

/* Cleaned CSS: */
/* PAGE */

body {
     font-family: Arial, sans-serif;
     font-size: 10px;
     margin: 20px 0px 20px 0px;
     background-color: #000000;
     color: #666666;
     background-image: url();
     background-repeat: 
     }

a, a:visited {
     font-weight: none;
     color: #FF0066;
     text-decoration: none;
     }
  a:hover {
     color: #33ccff;
     text-decoration: none;
     background-color: #transparent;
     }

.pageblock{
     background-image: url();
     background-position: top center;
     background-repeat: no-repeat;
     padding-top: px;
     background-color: #transparent;
     width: 800px;
     margin: 0 auto;
     }
  .pagefooterblock {
     display: none;
     }
  .pagefooterblock a, .pagefooterblock a:visited {
     text-align: right;
     color: #666666;
     } 
.pageheaderblock {
    background-color: #f0f0f0;
    background-image: url('http://img821.imageshack.us/img821/7972/colourrainbow.jpg');
    }

/* HEADER */

.pageheaderblock {
     padding-top: 20px;
     text-align: center;
     }

.header-title {
display: none;
     }
  .header-subtitle {
display: none;
          }
  .header-icon {
     top: 0px;
     right: 0px;
     position: absolute;
     z-index: 1;
     }
  .header-menu {
     text-align: center;
     letter-spacing: 5px;
     padding-right: 18px;
     padding-bottom: 2px;
     background-color: #ffffff;
     font-family: arial;
     text-transform: uppercase; 
     font-size: 12pt;
     }
  .header-menu a, .header-menu a:visited {
     white-space: nowrap;
     text-align: right;
     padding: 2px 6px 2px 6px;
     color: #666666;
     text-decoration: none;
     }
  .header-menu a:hover {
     color: #999999;
     background-color: #ffffff;
     }
  .header-menu ul, #footer-menu ul {
     margin: 0px;
     padding: 0px;
     text-align: center;
     }
  .header-menu li, #footer-menu li {
     display: inline;
     }

/* BODY */

.bodyblock {
     padding: 2px 0px 0px 0px;
     }
  .bodyheaderblock {
     display: none;
     }
  .bodynavblock {
     padding-bottom: 10px;
     text-align: center;
     }
  .bodynavblock a, .bodynavblock a:visited {
     color: #666666;
     }
  .body-title {
     display: none;
     font-family: ;
     font-size: 18px;
     color: #000000;
     text-align: left;
     padding-left: 24px;
     }
  .body-midtitle {
     display: none;
     font-family: ;
     font-size: 18px;
     color: #000000;
     text-align: left;
     padding-left: 8px;
     }

/*ENTRIES*/
  .entryHolder {
     color: #666666;
     background-color: #ffffff;
     font-family: Arial, sans-serif;
     font-size: 10px;
     margin-top: 10px;
     padding: 8px;
     }
  .entryUserinfo {
     font-weight: none;
     font-family: Trebuchet MS, sans-serif;
     font-size: 10px;
     text-align: center;
     margin: 8px 4px 8px 8px;
     }

.entryUserinfo a{
     font-weight: lighter;
     font-family: Trebuchet MS, sans-serif;
     font-size: 10px;
     text-align: center;
     }

.entryUserinfo-usericon img { 
     font-weight: none;
     border: 0; 
     margin-top: -18px;
display: none;
     } 
  .entryText {
     font-weight: none;
     text-align: justify;
     padding: 6px;
     }
  .entryHeader {
     text-align: right;
     color: #000000;
     font-family: ;
     font-size: 12px;
     padding: 4px 4px 4px 8px;
     border-bottom: 1px #f0f0f0 solid;
     }
  .entryHeader a{
     font-weight: none;
     color: #000000;
     }
  .entryHeaderSubject {
     color: #666666;
     font-size: 10px;
     font-family: Trebuchet MS, sans-serif;
     font-weight: none;
     }
  .entryHeaderDate {
     color: #666666;
     font-size: 10px;
     font-family: Trebuchet MS, sans-serif;
     }
  .entryHeaderDate a {
     color : #000000;
     text-decoration : none;
     }
  .entryHeaderDate a:hover {
     color : #000000;
     text-decoration : underline;
     }
  .entryMetadata {
     text-align: right;
     padding-left: 2px;
     }
  .entryMetadata ul {
     margin: 0px;
     padding: 0px;
     }
  .entryMetadata li {
     list-style: none;
     padding: 1px;
     }
  .entryMetadata-label {
     font-weight: none;
     padding-right: 4px;
     }

.entryHeaderTags a {
     font-weight: none;
     color: #FF0066;
     text-decoration: none;
 font-size: 10px;
     font-family: Trebuchet MS, sans-serif;
}

.entryHeaderTags a:hover {
     text-decoration: none;
 font-family: Arial, sans-serif;
     font-size: 10px;
     font-family: Trebuchet MS, sans-serif;
     text-decoration: none;
color: #33ccff;}

/*FOOTER*/

#footer-menu {
     margin-top: 10px;
     text-align: center;
     font-family: Trebuchet MS, sans-serif;
     font-size: 10px;
     }
  #footer-menu a, .footer-menu a:visited {
     color: #666666;
     white-space: nowrap;
     padding: 6px;
     text-align: right;
     }

/*SIDEBAR*/
  
  .sidebar {
     background-color: #ffffff;
     font-family: Arial, sans-serif;
     color: #666666;
     font-size: 10px;
     margin-right: 8px;
     margin-top: 10px;
     width: 200px;
     margin-left: 0px;
     }
  .sidebox {
     color: #666666;
     margin: 0px 0px 10px 0px;
     }
  .sideboxTitle {
     text-align: left;
     font-family: Trebuchet MS;
     font-size: 10px;
     color: #444444;  
     text-transform: uppercase;   
     }
  .sideboxContent {
     text-align: left;
     padding: 5px 4px 2px 4px;
     }
  .sidebox #profile, .sidebox #search, .sidebox #latestmonth {
     text-align: center;
     }
  .sidebox #tags_sidebox {
     text-align: left;
     }
  .sidebox #systemlinks {
     padding-left: 5px;
     text-align: left;
     }
  .sidebox #latestmonth table{
     width: 90%;
     margin-left: auto;
     margin-right: auto;
     margin-top: 4px;
     }
  .sidebox #freetext {
     padding-right: 5px;
     padding-left: 5px;
     text-align: left;
     }

.listtitle {
     font-weight: bold;
     }
  .profile-label {
     display: none;
     }
  .profile-content {
     display: none;
     }

.sidebox #systemlinks a {
display: block;
border-bottom: 1px #f0f0f0 solid;
}

.sidebox #systemlinks a:hover {
display: block;
border-bottom: 1px #f0f0f0 solid;
background-color: #ffffff;
color: #FF0066;
}

.sidebox #tags_sidebox {
font-size: 0px;}

.sidebox #tags_sidebox a {
display: block;
font-size: 10px;}

/*OTHER PAGES*/

/* COMMENT PAGE */

.commentHolder {
     font-family: Arial, sans-serif;
     color: #666666;
     background-color: #ffffff;
     border-top: 2px solid #ffffff;
     font-family: ;
     font-size: 10px;
     margin: 4px 0px 4px 0px;
     }
  .commentUserinfo {
     font-weight: none;
     font-family: Trebuchet MS, sans-serif;
     font-size: 10px;
     margin: 8px 4px 8px 8px;
     text-align: center; 
     background-color: #ffffff;
     }
  .commentUserinfo-usericon img { 
     border: 0; 
     } 
  .commentText {
     padding: 6px;
     }
  .commentHeader {
     text-align: right;
     border-bottom: 1px #f0f0f0 solid;
     font-family: Trebuchet MS, sans-serif;
     background-color: #ffffff;
     color: #666666;
     font-family: ;
     font-size: 10px;
     padding: 4px 0px 4px 8px;
     }
  .commentHeader a{
     color: #000000;
     }
  .commentHeaderScreened {
     font-family: Trebuchet MS, sans-serif;
     font-size: 10px;
     background-color: #f0f0f0;
     padding: 4px 4px 4px 8px;
     }
  .commentHeaderSubject {
     font-weight: none;
     }
  .commentLinkbar {
     font-family: Trebuchet MS, sans-serif;
     font-size: 10px;
     color: #666666;
     text-align: right;
     padding-top: 4px;
     padding-bottom: 4px;
     }
  .commentLinkbar ul {
     margin: 0px;
     padding: 0px;
     }
  .commentLinkbar li {
     padding: 0px 5px 0px 5px;
     margin: 0px;
     display: inline;
     }
  .replyform {
     background-color: #ffffff;
     color: #666666;
     padding-left: 10px;
     }
  #commenttext{
     width:100%;
     }

/*ARCHIVE PAGE*/
  .yearlinks{
     text-align: right;
     }
  .yearlink{
     padding-left:4px;
     padding-right: 4px;
     }
  .month {
     width: 500px;
     margin: 8px 8px 8px 40px;
     }
  .daysubjects {
     color: #666666;
     padding: 8px 8px 8px 40px;
     }
  .daytitles {
     text-align: center;
     background: #fffff;
     color: #000000;
     }
  .day-blank {
    }
  .day {
     }
  .day-date {
     color: #000000;
     width: 50%;
     text-align: center;
     }
  .day-count {
     width: 50%;
     text-align: center;
     float: right;
     font-size: 20px;
     }
  .day-count a {
     text-decoration: none;
     color: #666666;
     }

#welcomenoteHolder {
     margin-top: 10px;
     padding: 10px;
     }

.entryHeader img[src="http://stat.scribbld.com/img/icon_protected.gif"]{
     width: 0;
     height: 0;
     padding: 0 8px 10px 0;
     background: url(http://layouts.cbimg8.com/34/17309c.gif);
  }

.entryHeader img[src="http://stat.scribbld.com/img/icon_private.gif"]{
     width: 0;
     height: 0;
     padding: 0 8px 10px 0;
     background: url(http://layouts.cbimg8.com/34/17309c.gif);
  }

.entryHeader img {
     width: 0;
     height: 0;
     background-repeat: no-repeat;
     background-image: url(http://layouts.cbimg8.com/34/17309c.gif);
     padding: 8px 10px 0 0;
  } 
 
  .ljuser img { 
     width: 0;
     height: 0;
     background-repeat: no-repeat;
     background-color: transparent;
     background-image: url(http://layouts.cbimg8.com/34/17309d.gif); 
     padding: 8px 6px 4px 2px;
     }

.ljuser img[src="http://stat.scribbld.com/img/userinfo.gif"] {
     background-color: transparent;
     background-image: url(http://layouts.cbimg8.com/34/17309d.gif);
     padding: 8px 6px 4px 2px;
     }

.ljuser img[src="http://stat.scribbld.com/img/community.gif"] {
     background-color: transparent;
     background-image: url(http://layouts.cbimg8.com/34/17309e.gif);
     padding: 7px 7px 2px 2px;
     }

/*TAGS PAGE*/

.tagstable, .tagstable td {
     border: 1px solid #dddddd;
     }
  .tagstable { width: 500px; }

blockquote {
border-left: 10px #33ccff solid;
padding: 6px;
color: #444444;
background-color: #EAEAEA;}

/* REPLACEMENT ICONS */

.entryLinkbar {margin-bottom: 10px; clear:both;padding-bottom: 40px; padding-top: 10px
}

.entryLinkbar a {  
line-height: 15px;  
font-size: 10px !important;  
float: right;  
display: block;  
padding-right: 15px !important;  
padding-left:0px !important;  
height: 15px !important;  
width: 10px !important;  
position: relative;  
left: 0%;  
overflow: hidden;  
text-align: left; 
}

.entryLinkbar a[href*=reply] , .entryLinkbar .permalink, .entryLinkbar a[href*=tellafriend], .entryLinkbar a[href*=editjournal], .entryLinkbar a[href*=edittags], .entryLinkbar a[href*=memadd], .entryLinkbar a[href*=subscriptions] {  
left: 0%;  
font-size: 1px;  
color: #f2f2f2 !important;  
padding-left: 5px !important;  
padding-right: 5px !important;  
}

*+.entryLinkbar a[href*=reply] , .entryLinkbar .permalink, .entryLinkbar a[href*=tellafriend], .entryLinkbar a[href*=editjournal], .entryLinkbar a[href*=edittags], .entryLinkbar a[href*=memadd], .entryLinkbar a[href*=subscriptions] {  
font-size: 0px !important;  
}

*.entryLinkbar a[href*=reply] , .entryLinkbar .permalink, .entryLinkbar a[href*=tellafriend], .entryLinkbar a[href*=editjournal], .entryLinkbar a[href*=edittags], .entryLinkbar a[href*=memadd], .entryLinkbar a[href*=subscriptions] {  
font-size: 0px !important;  
}

.entryLinkbar a[href*=reply] {  
background: url(http://i51.tinypic.com/l9t15.gif) left no-repeat transparent !important;  
}

.entryLinkbar .permalink { background: url( http://i55.tinypic.com/2nhqd1l.gif) left no-repeat transparent !important;  
}

.entryLinkbar a[href*=tellafriend], .entryLinkbar a[href*=flag] {  
display: none;  
}

.entryLinkbar a[href*=editjournal] {  
background: url(http://i55.tinypic.com/kcbjx1.gif) left no-repeat transparent !important;  
}

.entryLinkbar a[href*=edittags] {  
background: url(http://i51.tinypic.com/2nupvkw.gif) left no-repeat transparent !important;  
}

.entryLinkbar a[href*=memadd] {  
background: url(http://i56.tinypic.com/2q0ou2t.gif) left no-repeat transparent !important;  
}

.entryLinkbar a[href*=subscriptions] {  display:none;  
}

.entryLinkbar .separator {  
display:none !important;  
}

Images:
Header - http://img821.imageshack.us/img821/7972/colourrainbow.jpg
Note: To change the header to a bigger image you will have to change the size of the pageheaderblock section. I can help if requested.

Any problems? Comment here.

scribbld is part of the horse.13 network
Design by Jimmy B.
Logo created by hitsuzen.
Scribbld System Status