InsaneJournal

Tweak says, "Sponges are fun!"

stellastars (stellastars) wrote in stelladesigns,
@ 2008-03-10 22:31:00

Layout #1 -- Corkboard
Name: Cork Board
Layout Style: S2 Bloggish
Best view: 1024x768 and up
Browser(s) Compatible: Tested in IE7 and Firefox
Account Levels: All
Credit:

stellastars
Preview: (click to view full-size)

Note: This layout uses many images and may not be ideal for users on dial-up. If using for livejournal on a Plus account, set Ad Placement to Vertical.

Directions for insanejournal:

1. Go to customize journal.
2. Click "Look and Feel" and select "Bloggish" in the "Layout and Language" section and "None" in the "Themes" menu.
3. Click "Custom Options" and in the "Layout Type" menu select "Two column (Sidebar on Left)" then click "Custom CSS."
4. Leave "Use layout's "Base Weblog" stylesheet" on "Yes" and leave "Custom external stylesheet URL" blank.
4.5 (Optional) Save images to your own image host and replace their URLs in the code.
5. Copy the code below and paste in the "Custom stylesheet" box.
6. Click "Save Changes."


Images for S2 Bloggish Cork Board Layout

CBBody.jpg	CBContainer.jpg	CBContainIn.jpg	CBPageBody.jpg
CBPageIn.jpg	CBAlphaHead.jpg	CBSkipLinks.jpg	CBBannerIn.jpg
CBEntry.jpg	CBDate.png	CBEntryMid.jpg	CBFooter.jpg
CBViewLinks.png	CBModMid.jpg	CBli.png	CBModLinksTop.png
CBModTagsTop.png	CBModPgSumTop.png	CBModBot.jpg	CBSynTop.jpg
CBPower.jpg	CBArchiveBeta.jpg	CBArchiveBetaUL.jpg	CBComments.png
CBCommentTag.jpg	CBReply.jpg

/* Cork Board */
/* S2 Style - Bloggish */
/* Theme - Unstyled on LJ or None on IJ */
/* Layout Type - Two column (Sidebar on Left) */
/* Made by stellastars.livejournal.com = stellastars.insanejournal.com */

/* Updated and Corrected on March 19, 2008 */

/*---All-Over Stuff---*/

* { margin: 0px; padding: 0px; }

font {font-family:inherit; font-size:inherit; color:inherit}

a {     
	color: #B60A15;
	text-decoration: none; 
	}

a:hover {
	color: #9c7146;
	}

blockquote {
	font-size: 10px;
	margin: 10px 50px; 
	padding: 12px; 
	font-style: italic;	
	}

ol, ul {
	margin: 10px 40px;
	padding: 0px 0px 10px 0px;
	}

input, textarea {
	margin: 1px; 
	background-color: #EDE8B1;
	}

h1, h2, h3, h4, h5, h6 {
	font-family: 'trebuchet ms', helvetica, arial, sans-serif;
	}

/*---Main Body---*/

body {
	background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Cork/CBBody.jpg) top left repeat #EDE8B1;
	font-family: 'trebuchet ms', helvetica, arial, sans-serif;
	font-size: 12px;
	}

#container {
	width: 900px; 
	background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Cork/CBContainer.jpg) bottom left no-repeat transparent;
	padding: 0px 0px 70px 0px;	
	}

#container-inner {
	background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Cork/CBContainIn.jpg)  top right repeat-y transparent; 
	padding: 0px 70px 0px 0px;
	}

#pagebody {
	background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Cork/CBPageBody.jpg) top left repeat #a87e4c;
	}

#pagebody-inner {
	padding: 0px;
	background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Cork/CBPageIn.jpg) top left repeat-y transparent;
	}

#alpha {
	width: 290px; 
	padding: 150px 0px 0px 0px;
	background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Cork/CBAlphaHead.jpg) top right no-repeat transparent;
	}

#beta {
	width: 540px; 
	}

#beta-inner {
	padding: 200px 0px 0px 0px;
	}

.content-nav {
	background: transparent;
	position: relative;
	top: -58px;
	right: 70px;
	text-align: right; 
	font-size: 0px; 
	color: transparent;
	z-index: 20;
	}

.skiplinks {
	background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Cork/CBSkipLinks.jpg) left center no-repeat transparent;
	font-size: 0px;
	color: transparent;
	padding: 38px 0px 38px 4px;
	}

.content-nav a, 
.skiplinks a {
	font-size: 12px;
	text-transform: lowercase;
	padding: 0px 0px 0px 8px;
	color: #4C4C4C;
	}

.content-nav a:hover, 
.skiplinks a:hover {
	color: #B60A15;
	}

/*---Header Image---*/

#banner {
	width: 900px;
	}

#banner-inner {
	background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Cork/CBBannerIn.jpg) top left no-repeat transparent;
	height: 70px;
	}

#banner h1 {
position: relative;
top: 16px;
padding: 0px;
margin: 0px;
text-align: center;
color: #000000;
font-size: 19px;
text-transform: capitalize;
}

#banner h2 {
position: relative;
top: 13px; 
padding: 0px;
margin: 0px;
text-align: center;
color: #000000;
font-size: 12px;
text-transform: capitalize;
}

/*-----Entry-----*/

.entry {
	padding: 60px 0px 0px 0px;
	margin: 0px 0px 0px 35px;
        width: 505px;
	background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Cork/CBEntry.jpg) top left no-repeat #edde63;
	}

h2.date-header {
	font-size: 14px;
	text-transform: uppercase;
	font-weight: bold;
	margin: 5px 430px 0px 10px;
	padding: 31px 5px 33px 6px;
	text-align: center;
	background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Cork/CBDate.png) center center no-repeat transparent; 
	position: relative;
	top: 46px; 
	z-index: 20;
	}

h3.entry-header  {
	font-size: 20px;
	text-transform: capitalize;
	padding: 0px 0px 5px 30px;
	margin: 0px;
	background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Cork/CBEntryMid.jpg) top left repeat-y  #edde63; 
	}

h3.entry-header a {
	background: transparent;
	}

.entry-userpic {
	padding: 3px 50px 3px 3px;
	margin: 3px;
	background: transparent;
	}

p.poster, 
.poster .ljuser {
	display: block;
	font-size: 9px;
	text-transform: lowercase;
	}

.entry-content { 
	background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Cork/CBEntryMid.jpg) top left repeat-y #edde63; }

.entry-body a {
	font-weight: bold;
	}

.entry-body {
	padding: 10px 50px 10px 35px;
	margin: 0px 0px 0px 0px;
	}

.entry-body img {
	max-width: 412px;
	overflow: hidden;
	}

.metadata strong {
	font-weight: normal;
	}

.metadata, 
.metadata a,
.ljtags a, 
.entry-footer a {
	font-size: 9px;
	text-transform: lowercase;
	}

.ljtags {
	font-size: 9px;
	text-transform: lowercase;
	padding: 0px;
	}

.entry-footer {
	color: #B60A15;
	text-align: center;
	font-size: 9px;
	text-transform: lowercase;
	background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Cork/CBFooter.jpg) bottom left no-repeat #edde63;
	padding: 5px 50px 78px 40px;
	margin: 0px 0px 0px 0px;
	width: 415px;
	}

/*----Sidebar----*/

.module-viewlinks {
	background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Cork/CBViewLinks.png) top left no-repeat #ffffff;
	position: absolute;
	top: 0px;
	left: 500px; 
	width: 276px;
	height: 190px;
	padding: 0px;
	z-index: 20;
	}

.module-viewlinks ul {
	padding: 69px 0px 0px 30px;
	}

.module-viewlinks li {
	padding: 0px;
	line-height: 11px;
	}

.module-viewlinks a {
	color: #4C4C4C;
	background: transparent;
	text-transform: lowercase;
	}

.module-viewlinks a:hover {
	color: #B60A15;
	}

.module-ads {
	position: absolute;
	top: 200px;
	left: -180px;
	z-index: 0;
	}

.module-syndicate .module-content,
.module-powered .module-content {
	padding: 0px;
	margin: 0px;
	}

.module-typelist .module-content, 
.module-categories .module-content,
.module-pagesummary .module-content {
	background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Cork/CBModMid.jpg) top left repeat-y #b2bfd2;
	padding: 10px 0px;
	margin: 0px;
	}

.module-typelist li, 
.module-categories li,
.module-pagesummary li {
	background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Cork/CBli.png) top left no-repeat transparent;
	padding: 2px 2px 5px 15px;
	text-decoration: none;
	text-transform: lowercase;
	font-weight: normal;
	line-height: 12px;
	margin: 0px 12px;
	}

.module-typelist a, 
.module-categories a, 
.module-pagesummary a  {
	text-transform: lowercase;
	color: #000000;
	}

.module-typelist a:hover, 
.module-categories a:hover,
.module-pagesummary a:hover {
	color: #B60A15;
	}

.module-typelist .module-header {
	font-size: 0px;
	color: transparent;
	background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Cork/CBModLinksTop.png) top left no-repeat #b2bfd2;
	height: 82px;
	margin: 20px 0px 0px 0px;
	}

.module-categories .module-header {
	font-size: 0px;
color: transparent;
	background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Cork/CBModTagsTop.png) top left no-repeat #b2bfd2;
	height: 82px;
	margin: 20px 0px 0px 0px;
	}

.module-pagesummary .module-header {
	font-size: 0px;
	color: transparent;
	background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Cork/CBModPgSumTop.png) top left no-repeat #b2bfd2;
	height: 82px;
	margin: 20px 0px 0px 0px;
	}

.module-typelist, 
.module-categories, 
.module-pagesummary {
	width: 200px !important;
	padding: 0px 0px 14px 0px;
	margin: 0px 10px 0px 70px;
	background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Cork/CBModBot.jpg) bottom left no-repeat transparent;
	}

.module-syndicate {
	text-align: center;
	background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Cork/CBSynTop.jpg) top left no-repeat #ffffff;
	width: 200px! important;
	padding: 58px 0px 0px 0px;
	margin: 20px 10px 0px 70px;
	}

.module-powered {
	text-align: center;
	background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Cork/CBPower.jpg) top left no-repeat #ffffff;
	width: 200px! important;
	padding: 5px 0px 40px 0px;
	margin: 0px 10px 0px 70px;
	font-style: italic;
	}

.module-powered a {
	font-weight: normal;
	background: transparent;
	font-style: italic;
	}

/*-Archive Pages-*/

.lj-view-archive #beta-inner.pkg {
	background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Cork/CBArchiveBeta.jpg)  bottom left repeat-y #30200d;
	padding: 0px 0px 20px 0px;
	margin: 200px 0px 0px 0px;
	}

.lj-view-archive #beta ul {
	list-style-type: none;	
	padding: 30px 0px 0px 0px;
	margin: 0px;
	background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Cork/CBArchiveBetaUL.jpg) top left no-repeat transparent; 
	}

.lj-view-archive #beta li {
	margin: 2px 0px;
	padding: 0px 0px 0px 40px;
	text-align: left;
	font-size: 16px;
	font-weight: bold;
	}

.lj-view-archive #beta table {
	width: 315px !important;
	border:  2px #000000 solid !important;
	}

.lj-view-archive #beta th {
	padding: 5px 10px;
	font-size: 14px;
	font-weight: bold;
	text-align: center !important;
	width: 45px !important;
	border:  2px #000000 solid !important;
	}

.lj-view-archive #beta td {
	padding: 2px 4px 10px 10px;
	font-size: 9px;
	text-decoration: none;
	height: 35px;
	border: 1px solid #000000 !important;
	}

.lj-view-archive #beta td a {
	font-size: 12px;
	font-weight: bold;
	text-align: center;
	padding: 0px !important;
	line-height: 10px !important;
	}

.lj-view-day #beta-inner h2 {
	font-size: 14px;
	text-transform: uppercase;
	font-weight: bold;
	margin: 5px 430px 0px 10px;
	padding: 30px 5px 33px 6px; 
	text-align: center;
	background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Cork/CBDate.png) center center no-repeat transparent;
	position: relative;
	top: 46px;
	z-index: 20;
	}

/*-Comment Pages-*/

h3.comments-header {
	font-size: 0px;
	color: transparent;
	}

.comments {
	padding: 60px 50px 0px 0px;
	margin: 0px 0px 0px 35px;
	background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Cork/CBComments.png) top left no-repeat #edde63;
	width: 455px;
	}

.comments-content {
	background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Cork/CBEntryMid.jpg) top left repeat-y #edde63;
	padding: 10px 50px 10px 35px;
	margin: 0px;
	width: 420px;
	}

h3.comment-header {
	font-size: 14px;
	text-transform: capitalize;
	border-top: 1px dashed #000000;
	padding: 0px 5px;
	}

.lj-view-entry #beta-inner.pkg {
	background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Cork/CBCommentTag.jpg) bottom right no-repeat transparent;
	padding:  0px 0px 28px 0px;
	margin: 200px 0px 0px 0px;
	width: 540px;
	}

.comment-content {
	padding: 0px 0px 0px 18px;
	}

.comment-content a {
	font-weight: bold;
	}

.comment-footer {
	color: #B60A15;
	text-align: center;
	font-size: 9px;
	text-transform: lowercase;
	border-bottom: 1px dashed #000000;
	padding: 0px 5px;
	}

.lj-view-month #beta-inner.pkg, 
.lj-view-reply #beta-inner.pkg  {
	background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Cork/CBReply.jpg) top left repeat #a87e4c;
	margin: 200px 0px 0px 0px;
	padding: 10px 10px 15px 20px;
	font-weight: bold;
	font-size: 14px;
	}
	
.lj-view-month #beta-inner.pkg a {
	text-transform: capitalize;
	}

.lj-view-reply #beta-inner.pkg a:hover,
.lj-view-month #beta-inner.pkg a:hover {
	color: #000000;
	}

.lj-view-reply #beta-inner.pkg h2 {
	font-size: 20px;
	text-transform: capitalize;
	}

/*-Tags Pages-*/

.lj-view-tags #beta-inner.pkg h2 {
	font-size: 20px;
	text-transform: capitalize;
	font-weight: normal;
	padding: 60px 50px 15px 40px;
	margin: 0px 0px 0px 35px;
	background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Cork/CBEntry.jpg) top left no-repeat #edde63;
	}

.ljtaglist li {
	background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Cork/CBEntryMid.jpg) top left repeat-y #edde63;
	padding: 2px 0px 2px 60px;
	margin: 0px 0px 0px 35px;
	width: 440px;
	list-style: none;
	}

ul.ljtaglist {
	background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Cork/CBCommentTag.jpg) bottom right no-repeat transparent;
	padding: 0px 0px 28px 0px;
	margin: 0px;
	width: 540px;
	}

/*-Hidden Elements-*/

.module-photo,  
.module-calendar, 
.module-syndicate .module-header, 
.lj-view-friends .module-powered, 
.lj-view-archive .module-powered, 
.lj-view-month .module-powered,
.lj-view-day .module-powered, 
.lj-view-reply .module-powered, 
.lj-view-entry .module-powered, 
.lj-view-tags .module-powered, 
.lj-view-reply #beta-inner.pkg hr {
	display: none;
	}

This is the first layout that I've made specifically to share. I'd be very, very grateful for any criticism, as I do so enjoy playing with this stuff and would like to do a better job of it. ♥

Ads by Project Wonderful! Your ad here, right now: $0

(Post a new comment)

	ladybug218 2008-03-20 01:46 pm UTC (link)
	I love this and when I get home and can upload all the images to my photobucket, I'm totally going to use it (with credit, of course)!! I hope you keep making IJ specific layouts! (Reply to this) (Thread)

stellastars
2008-03-20 04:36 pm UTC (link)

Thank you very, very much! I'm so glad you liked it!

And thank you for hosting the images on your own photobucket -- I really do appreciate it when people do that! Which, now that I'm thinking about it, one person had some trouble with the saving the pics to photobucket (the issue had to do with setting the maximums on file size as dimensions vs. file size -- it needs to be set on 1 MB, as I recall) so please let me know if you have any issues and I will try to be of assistance. Or, you are welcome to use the pics from my account, whatever works!

I fully intend to keep on making layouts for IJ -- I'm having a lot of fun doing it. I'm not sure anything I create in the future though will live up to the Cork Board!

Also, hope you don't mind, but I glanced at your journal (I'm always curious who's using the layouts!) and just wanted to thank you for your PSA on internet and blog security... I hadn't heard anything about that Spokeo site and it is very creepy! I'm going to be checking out what people can see about me later.

(Reply to this) (Parent) (Thread)

	ladybug218 2008-03-20 05:15 pm UTC (link)
	Thanks - I will keep that in mind when I save all the images to my computer :) And I don't mind at all! Anything in my journal that's public is that way for a reason. (Reply to this) (Parent) (Thread)

	stellastars 2008-03-21 04:02 am UTC (link)
	No problem! Glad to help! And thanks again! (Reply to this) (Parent) (Thread)

	ladybug218 2008-03-21 12:51 pm UTC (link)
	I uploaded the layout to my journal! I didn't have time to d/l and save all the images and upload them to my Photobucket, but I will do that this weekend and replace the code so that I'm not leeching your bandwith :) It looks AMAZING though!! :) (Reply to this) (Parent) (Thread)

	stellastars 2008-03-28 05:01 am UTC (link)
	No problem on waiting on saving the images -- I know there are a lot of them! Thank you though -- I really appreciate you taking the time to dl and upload them! And thank you for the compliment!! :D (Reply to this) (Parent)

	i love it (Anonymous) 2008-04-08 08:38 am UTC (link)
	I love it. Is it possible to put the entries in a scrollbox, so my page won't be so long? Contact me at vwbuslover106@aol.com, please. (Reply to this)

	noenvy_nofear 2009-07-24 10:02 pm UTC (link)
	I love this! I used one of your other ones for a character journal (credited, of course!), and upon doing my new CDJ - immediately thought of you! I will be downloading the pictures to my own server, but I need to wait until I get home (I'm currently at work). Thanks so much for making such beautiful layouts! (Reply to this) (Thread)

	stellastars 2009-09-15 08:01 pm UTC (link)
	Many apologies for the delay in replying. Thank you very much for your lovely comment -- I really appreciate your kind words! And thank you for offering to download/host the pics, too! ♥ (Reply to this) (Parent)