nameless_layout

S	M	T	W	T	F	S
		1	2	3	4	5
6	7	8	9	10	11	12
13	14	15	16	17	18	19
20	21	22	23	24	25	26
27	28	29	30

Name: Bubblegum
Layout Style: S2 Bloggish
Best view: 1024x768 and up
Browser(s) Compatible: Tested in IE7 and Firefox
Account Levels: All
Work with Nav bar?: Yes
Work with Ads?: Yes, Vertical Placement only.
Credit:

stellastars, in user info, please.
Preview: click to view full-size

Note: After the realism and linear qualities of my Corkboard Layout, I've gone in the completely opposite direction -- abstract, organic, and curvy -- for something different. Hope you like it!

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 Bubblegum Layout

BGBody3.png	BGContain.png	BGContainIn.png	BGPageBody.png
BGAlpha.png	BGBanner.png	BGEntry.png	BGEntryWrap.png
BGFooter.png	BGDot.png	BGVLinks.png	BGCalendar.png
BGPower.png	BGSideTitle.png	BGSideWrap.png	BGDotSum.png
BGSideBot.png

/* Bubblegum */
/* 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 */

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

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

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

a, a:link, a:visited, a:active  { color: #a34d63; text-decoration: underline;

font-weight: bold;}

a:hover {color: #ff5387;}

blockquote { border-top: 3px dashed #ff5387; border-bottom: 3px dashed #ff5387; margin:

20px 25px; padding: 3px 10px; font-size: 12px; }

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

input, textarea { margin: 2px; background: #ffd4e1; padding: 2px; }

h1, h2, h3, h4, h5, h6 { color: #ff5387; font-weight: bold; }

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

body { background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Bubblegum/BGBody3.png) top center repeat-y #ffd4e1;
	font-family: 'trebuchet ms', helvetica, arial, sans-serif; font-size: 14px; color:  #4C4C4C; }

#container { background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Bubblegum/BGContain.png) top right no-repeat transparent;
	width: 944px;
 	padding: 0px 66px 0px 10px; }

#container-inner { background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Bubblegum/BGContainIn.png) top right repeat-y #ffffff; 
	padding: 0px 0px 40px 0px; margin-left: 0px; }

#pagebody { background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Bubblegum/BGPageBody.png) top right no-repeat transparent; }

#alpha { width: 300px; background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Bubblegum/BGAlpha.png) top left no-repeat #ffffff; }

#alpha-inner { width: 270px; padding: 365px 0px 0px 0px; margin: 0px 0px 0px 29px; font-size: 12px;}

#alpha-inner a {font-weight: normal;}

#beta { width: 606px; }

#beta-inner {
	padding: 1px 0px;
	margin: 290px 0px 0px 0px;
	}

.content-nav {
	position: absolute;
	top: 205px;
	float: right;
	padding: 0px 0px 0px 480px; 
	text-align: right;
	font-size: 0px; 
	width: 100px;
	height: 40px;
	}

.content-nav a, 
.skiplinks a { font-weight: bold; font-size: 14px; text-transform: uppercase; padding: 0px 8px; }

.content-nav a:hover { color: #ffffff; }

.skiplinks { font-size: 0px; margin: 20px 0px 0px 0px; }

/*---Banner---*/

#banner { background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Bubblegum/BGBanner.png) top left no-repeat #ffffff;
	height: 20px;
	z-index: 20; 
	}

#banner h1, 
#banner h2 {
       	color: #a34d63; 
	font-weight: normal;
	float: left;
	position: absolute;
	overflow: hidden;
	}

#banner h1 {
	font-size: 26px;
	line-height: 28px;
	top: 58px;
	left: 28px;
	width: 245px;
	height: 110px; 
	}

#banner h2 {
	font-size: 14px;
	line-height: 18px;
	font-style: italic;
	top: 170px;
	left: 28px;
	width: 245px;
	height: 55px; 
	}

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

.entry {
	padding: 112px 0px 0px 0px;
	margin: 27px 0px 0px 0px;
	background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Bubblegum/BGEntry.png) top left no-repeat #ffffff; 	
	}

h2.date-header {
	font-size: 15px;
	margin: 0px 0px -27px 0px;
	padding: 0px 0px 0px 80px;
	text-transform: uppercase;
	}

h3.entry-header  {
	font-size: 22px;
	text-transform: capitalize;
	padding: 5px 0px 0px 50px;
	margin: 0px;
	position: relative;
	top: -40px; 
	}

.entry-userpic { padding: 0px 25px 0px 0px; margin: -60px 0px 10px 10px !important; }

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

.entry-content {
	background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Bubblegum/BGEntryWrap.png) top right repeat-y #ffffff;
	margin: 0px 0px 27px 0px; }

.entry-body { padding: 0px 25px 10px 25px; }

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

.metadata { margin-bottom: 20px; text-transform: capitalize; }

.metadata img { display: none; }

.ljtags {
	margin: 25px 0px 0px 0px;
	text-transform: capitalize;
	font-weight: bold; 
	}

.entry-footer, 
.comment-footer  {
	color: #a34d63;
	font-weight: bold;
	line-height: 18px;
	text-align: left;
	}

.entry-footer {
	background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Bubblegum/BGFooter.png) bottom left no-repeat #ffffff;
	padding: 25px 55px 10px 20px;
	margin: 0px;
	height: 77px;
	}

.comment-footer {
	padding: 20px 0px 10px 12px;
	margin: 0px;
	}

.entry-footer a, 
.lj-view-month #beta-inner.pkg a, 
.comment-footer a { text-transform: capitalize; }

.separator { background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Bubblegum/BGDot.png) top center no-repeat transparent;
	font-size: 0px;
	padding: 6px 8px 0px 8px; }

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

.module-viewlinks {
	background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Bubblegum/BGVLinks.png) top left no-repeat #ffffff;
	position: absolute;
	top: 0px; 
	left: 300px; 
	width: 99px;
	height: 150px;
	padding: 55px 19px 0px 51px;
	z-index: 20;
	}

.module-viewlinks ul { text-align: center; }

.module-viewlinks li {
	font-size: 18px;
	line-height: 18px;
	padding: 1px 0px 2px 0px;
	text-transform: lowercase;
	}

.module-viewlinks a {
	text-decoration: none; 
	color: #ffffff;
	font-weight: normal; 
	}

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

.module-photo {
	position: absolute;
	top: 210px;
	left: 146px;
	margin: auto;
	width: 120px;
	height: 110px;
	}

.module-calendar .module-header {
	font-size: 16px;
	margin: 0px 0px 0px -4px;
	}

.module-calendar {
	background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Bubblegum/BGCalendar.png) top left no-repeat #ffffff;
	position: absolute;
	top: 0px; 
	left: 469px; 
	width: 224px;
	height: 146px;
	padding: 28px 15px 45px 25px;
 	z-index: 20; 
	font-size: 12px;
	}

.module-syndicate .module-header {
	font-size: 18px;
	font-weight: normal;
	margin: 0px 0px 3px 0px;
	}

.module-syndicate {
	text-align: center;
	padding: 10px 0px 0px 0px;
	position: absolute;
	top: 72px;
	left: 738px; 
	width: 143px;
	z-index: 20; 
	}

.module-powered {
	text-align: center;
	background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Bubblegum/BGPower.png) top left no-repeat transparent;
	padding: 130px 25px 10px 5px;
	position: absolute;
	top: 0px; 
	left: 733px; 
	width: 143px;
	height: 147px;
	z-index: 0;
	font-size: 12px;
	}

.module-powered a:active, .module-powered a:visited, .module-powered a:link {
	color: #4C4C4C;
	font-weight: normal;
	text-decoration: none;
	z-index: 20;
	}

.module-powered a:hover { color: #ff5387; z-index: 20; }

.module-ads {
	background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Bubblegum/BGSideTitle.png) top left no-repeat #ffffff;
	padding: 65px 0px 5px 0px;
	}

.module-ads .module-content {
	background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Bubblegum/BGSideWrap.png) top left repeat-y #ffffff;
	padding: 20px 0px 10px 20px;
	margin: 0px 0px 11px 0px;
	}

.module-typelist .module-header,
.module-categories .module-header, 
.module-pagesummary .module-header {
	background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Bubblegum/BGSideTitle.png) top left no-repeat #ffffff;
	height: 48px;
	font-size: 20px;
	font-weight: normal;
	padding: 15px 20px 5px 120px;
        margin: 0px;
	}

.module-typelist .module-content,
.module-categories .module-content,
.module-pagesummary .module-content {
	background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Bubblegum/BGSideWrap.png) top left repeat-y #ffffff;
	padding: 20px 0px 0px 0px;
	margin: 0px;
	}

.module-typelist ul, 
.module-categories ul {
	background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Bubblegum/BGSideWrap.png) top left repeat-y #ffffff;
	width: 205px;
	float: left;
	padding: 2px 14px 2px 20px; 
	}

.module-typelist li, 
.module-categories li {
	float: left;
	display: inline;
	white-space: normal;
	margin: 0px 8px 0px 0px;
	}

.module-pagesummary ul { width: 210px; }

.module-pagesummary li {
	background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Bubblegum/BGDotSum.png) top left no-repeat transparent;
	line-height: 14px;
	padding: 0px 0px 0px 12px;
	margin: 10px 20px 0px 20px;
	}

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

.module-pagesummary a  { text-decoration: none; }

.module-typelist,
.module-categories, 
.module-pagesummary {
	background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Bubblegum/BGSideBot.png) bottom left no-repeat #ffffff;
	padding: 0px 0px 78px 0px;
	margin: 0px 0px 11px 0px;
	}

/*-Archive Pages-*/

.lj-view-archive #beta-inner.pkg {
	padding: 0px 0px 20px 0px;
	margin: 290px 0px 0px 0px;
	}

.lj-view-archive #beta ul {
	list-style-type: none;	
	padding: 30px 0px 0px 0px;
	margin: 0px;
	}

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

.lj-view-archive #beta li.active { color: #ff5387; }

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

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

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

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

.lj-view-day #beta-inner h2 {
	font-size: 15px;
	margin: 0px 0px -27px 0px;
	padding: 0px 0px 0px 80px;
	text-transform: uppercase;
	}

.lj-view-month #beta-inner.pkg {
	padding: 1px 0px;
	margin-top: 315px; 
	background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Bubblegum/BGEntry.png) top left no-repeat #ffffff; 
	font-weight: bold;
	}

.lj-view-month #beta-inner.pkg center {position: relative; top: 60px;}
	
.lj-view-month #beta-inner.pkg dt {
	font-size: 22px;
	font-weight: normal;
	background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Bubblegum/BGEntryWrap.png) top right repeat-y #ffffff;
	padding: 20px 35px 3px 35px;
	}

.lj-view-month #beta-inner.pkg dd,
.ljtaglist li  {
	background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Bubblegum/BGEntryWrap.png) top right repeat-y #ffffff;
	padding: 3px 35px;
	line-height: 22px;
	}

.ljtaglist li {
	list-style: none;
	font-weight: bold;
	text-transform: capitalize;
	}

.lj-view-month #beta-inner.pkg dl {
	background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Bubblegum/BGFooter.png) bottom left no-repeat #ffffff;
	padding: 0px 0px 115px 0px;
	margin: 120px 0px 0px 0px;
	}

/*-Comment Pages-*/

.lj-view-entry #beta-inner.pkg, 
ul.ljtaglist {
	background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Bubblegum/BGFooter.png) bottom left no-repeat #ffffff;
	padding: 0px 0px 115px 0px;
	margin: 315px 0px 0px 0px;
	}

ul.ljtaglist {
	margin: 0px; 
        }

h3.comments-header, 
.lj-view-tags #beta-inner.pkg h2 {
	font-size: 26px;
	font-weight: normal;
	text-align: center;
	}

h3.comments-header {
	position: relative;
	top: -10px;
	}

h3.comment-header,
h3.comment-header strong {	
	font-size: 18px;
	font-weight: normal;
	margin: 40px 0px 0px 0px;
	color: #a34d63;
	}

.comments, 
.lj-view-tags #beta-inner.pkg h2 {
	background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Bubblegum/BGEntry.png) top left no-repeat #ffffff; 	
	padding: 68px 0px 0px 0px;
	margin: 27px 0px 0px 0px;
	}

.lj-view-tags #beta-inner.pkg h2 {
	padding: 60px 0px 40px 0px;
	margin: 0px;
	}

.comments-content {
	background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Bubblegum/BGEntryWrap.png) top right repeat-y #ffffff;
	padding: 0px 25px;
	margin: 0px;
	}

.comment-content {
	padding: 0px 0px 0px 12px;
	margin: 0px;
	border-top: 3px dashed #ff5387;
	}

.lj-view-entry .comment-content .metadata,
.lj-view-entry .comment-content .metadata strong {
	margin: 0px 0px 5px 0px;
	font-weight: normal;
	font-size: 12px;
	font-style: italic;
	}

.lj-view-reply #beta-inner.pkg  { padding: 0px 10px 15px 40px; }

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

.lj-view-reply #beta-inner.pkg hr { margin: 25px 0px 15px 0px; }

.lj-view-reply #beta-inner.pkg .ljtags {
	margin: 30px 0px 0px 0px;
	text-transform: capitalize;
	}

.lj-view-tags #beta-inner.pkg { padding: 33px 0px 0px 0px; }

Tags: account type: free, layout: journal: full, s2: bloggish, subject: general, user: stellastars

Posted on Feb. 14th, 2008 at 01:38 pm | Link | Leave a comment | Add to Memories | Tell a Friend

Comments

lteagleeyes

Very cute layout! I may be using this in the future :)

Great job :D

Posted on Feb. 14th, 2008 10:48 pm (UTC) | Link | Thread | Reply

stellastars

Thank you! I'm glad you liked it!

Posted on Feb. 15th, 2008 12:41 am (UTC) | Link | Parent | Reply

pen

I am currently using this layout on LJ and the corkboard here. Your layouts are freakin' fantastic!

Mind if I friend you?

Posted on Feb. 15th, 2008 03:08 am (UTC) | Link | Thread | Reply

Thank you very much! I'm tickled to hear you've enjoyed both the layouts!

And I don't mind at all! Friend away and I shall reciprocate!

Posted on Feb. 15th, 2008 04:42 am (UTC) | Link | Parent | Reply

rowenachase

I love this layout! It's gorgeous. I definitely plan on using and crediting this layout when I get off work in a couple hours. Thanks!

Posted on Mar. 20th, 2008 04:15 am (UTC) | Link | Thread | Reply

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

Posted on Mar. 20th, 2008 05:01 am (UTC) | Link | Parent | Reply

gerund

this layout is absolutely precious and i will definitely be using it! however, i was wondering if there was a friends only graphic to go with it.

Posted on May. 20th, 2008 06:17 pm (UTC) | Link | Thread | Reply

spangle

I may use this for another character...I just wanted to let you know it's really, really lovely!

Posted on Jul. 27th, 2008 04:44 am (UTC) | Link | Parent | Reply

daddysbabygirl

I've taken for this journal. It's absolutely wonderful.

Credit is given. :D

Posted on Aug. 24th, 2008 05:51 am (UTC) | Link | Thread | Reply

*beams* Thank you very much!

Posted on Aug. 25th, 2008 02:35 pm (UTC) | Link | Parent | Thread | Reply

whotheeff

This is so cute!

Posted on Oct. 16th, 2008 11:44 pm (UTC) | Link | Parent | Thread | Reply

Thank you!

Posted on Oct. 17th, 2008 11:01 am (UTC) | Link | Parent | Reply

sarastrange

How do you use this in Livejournal?

Posted on Jan. 19th, 2009 10:35 pm (UTC) | Link | Thread | Reply

Directions are right over here.

Posted on Jan. 19th, 2009 10:44 pm (UTC) | Link | Parent | Thread | Reply

I am having a few problems with Step Number 3. how do i find "unstyled"

Posted on Jan. 19th, 2009 11:26 pm (UTC) | Link | Parent | Thread | Reply

When you search for "Bloggish" it will show all the themes available, listed in alphabetical order. I think by default 12 styles are shown on a page, so "Unstyled" will be on the second page. A picture to illustrate is here with the important parts underlined in red. Hope that helps!

Posted on Jan. 20th, 2009 08:51 am (UTC) | Link | Parent | Reply

the_other_side

I'm using for this journal. I credited you in the "about me" post. Thank you so much!

Posted on Apr. 4th, 2009 10:05 pm (UTC) | Link | Thread | Reply

Sorry for the delay in replying! (Broken computer-woes having me running behind.) Just wanted to say thank you for the comment and I'm glad that you liked the layout!

Posted on May. 6th, 2009 11:02 am (UTC) | Link | Parent | Reply

for the creative, or the creatively lacking

Journal

September 2009

Other Communities

Browsers

S2 Bloggish Bubblegum Layout

Comments

Tags