InsaneJournal

Tweak says, "...Montegues and thee!"

Doesn't give a shit about what you think (lace_and_cream) wrote in abeautifulmind,
@ 2011-12-12 11:16:00

Entry tags:

!journal layouts, maker: lace_and_cream, style: s1 generator

static preview
Live Example:

arcissa
Compatibility: Firefox, Google Chrome, Safari. Not tested in IE.
Type: s1 Generator

The Code

GLOBAL_HEAD<=

<!--

/* HIDES YOUR ICON */

.shadowed img{

display:none;

}

/* BACKGROUND IMAGE AND COLOR FOR THE PAGE */

/* MARGIN-TOP SHOULD BE AT LEAST THE HEIGHT OF YOUR HEADER */

body {

background-color:#117788;

background-image:url(http://i303.photobucket.com/albums/nn127/immortalaussie/Patterns/background1.png);

background-repeat:repeat;

background-attachment:fixed;

background-position:top left;

text-align:center;

margin:0;

margin-top:10px;

padding:0;

}

/*HEADER IMAGE WIDTH IS THE WIDTH OF THE HEADER HEIGHT IS THE HEIGHT OF YOUR HEADER MARGIN LEFT IS THE NEGATIVE HALF WIDTH OF YOUR HEADER */

#header{

background-image:url();

position:absolute;

visibility:visible;

top:0px;

width:600px;

left:50%;

margin-left:-300px;

height:10px;

text-align:center;

font-size:20pt;

}

/* SUBJECT */

p table table td.caption {

font-weight:bold;

}

/* SHIFTS THE ENTRYBOXES CLOSER TOGETHER */

p {

margin:0;

padding:0;

}

.entrybox p{

margin: 1.2em 0;

}

/* HIDES THE OLD DATE LINE AND THE DATE BRACKETS */

.entrybox td.index, .index3{

display:none;

}

/* DEFINES THE LOOK OF THE DATE LINE.*/

.index2{

width:100%;

text-align:right;

border-bottom:1px dotted grey;

display:block;

text-transform:uppercase;

letter-spacing:1.5;

font-size:8pt;

}

/* COMMENTS LINKS */

.comments{

text-align:center;

padding-bottom:50px;

}

/* LINK APEAREANCE FOR COMMENTS */

.comments a, .comments a:visited,.comments a:hover{

color:#99ddee;

}

.comments img{

border:0;

}

/* TOP NAVIGATION YOU MIGHT HAVE TO CHANGE THE LEFT VALUE TO CENTER THE NAVIGATION LINKS UNDER THE HEADER*/

.nav1, .nav2{

padding-top:2;

padding-bottom:2;

position:relative;

left:-2pt;

display:block;

}

/* FIRST LINE OF TOP NAVIGATON */

.nav1{

background-color: #117788; text-transform:uppercase;

word-spacing:14px;

}

/* DO NOT CHANGE ANYTHING HERE */

table table td.shadowed table{

width:100%;

}

table td, .entrybox .meta{

padding:0;

}

.entrybox td{

padding:5px 10px;

}

/* LINK APEAREANCE OF THE SECOND NAVIGATION LINK ROW */

.nav2 a, .nav2 a:active, .nav2 a:visited, .nav2 a:hover{

color:#99ddee;

font-variant:small-caps;

}

/* THE OTHER LINKS */

a {

color: #99ddee;

text-decoration:none;

}

a:visited {

color:#55aabb;

}

a:hover {

text-decoration: underline;

}

/* SETS THE WIDTH OF THE TABLE (CHOOSE THE SAME WITH AS YOUR HEADER) AND BACKGROUND_COLOR */

div {

margin:0 auto;

width:600px;

background:#117788;

}

div div { background: none; width: auto; height: auto; padding: 0; }

div table { width: 98%; }

div table table { width: 100%; }

div table table table { width: auto; }

div table table table table { width: 100%; }

-->

</style>

<=GLOBAL_HEAD

FRIENDS_WEBSITE<=
<style type="text/css"> 
<!-- 
table table table table .meta {visibility:hidden;position:absolute;top:1px}
table table table table table .meta {visibility:visible;position:relative;top:1px}

tr.caption{
display:none
}
.shadowed td div{
visibility: hidden; 
position: absolute; 
top: 1px
}
--> 
</style> 
<tr><td colspan="5" width="100%">
<table style="float:right" cellspacing="0" border="0" cellpadding="0">
<tr><td class="meta">

<font size="3" color="#44ddff">THIS IS YOUR JOURNAL NAME</font></br></br></br><span class="nav1">

<font color="#88bbcc">♥ <a href="http://journalname.insanejournal.com/info"><font color="#88bbcc">userinfo</font></a> ♥
<a href="http://www.insanejournal.com/users/journalname/friends"><font color="#88bbcc">friends</font></a> ♥
<a href="http://www.insanejournal.com/users/journalname/calander"><font color="#88bbcc">calander</font></a> ♥
<a href="http://www.insanejournal.com/users/journalname"><font color="#88bbcc">recent</font></a> ♥</font>
<br /></span><br />

<span class="nav2">
♥ <a href="URL">LINK</a> ♥
<a href="URL">LINK</a> ♥
<a href="http://asylums.insanejournal.com/abeautifulmind">CREDIT</a> ♥
</span></center>

</td></tr></table></td></tr>
<=FRIENDS_WEBSITE

LASTN_WEBSITE<=
<style type="text/css"> 
<!-- 
table table table table .meta {visibility:hidden;position:absolute;top:1px}
table table table table table .meta {visibility:visible;position:relative;top:1px}

<font size="3" color="#44ddff">THIS IS YOUR JOURNAL NAME</font></br></br></br><span class="nav1">

<span class="nav2">
♥ <a href="URL">LINK</a> ♥
<a href="URL">LINK</a> ♥
<a href="http://asylums.insanejournal.com/abeautifulmind">CREDIT</a> ♥
</span></center>

</td></tr></table></td></tr>

<=LASTN_WEBSITE

1. Click on customize journal
2. Under Basics select s1
3. Under Look and Feel Choose Generator
4. Under custom colours delete all the hex values as seen here. (Hex values are the #000000 etc). Save your changes.
5. Click Custom Options
6. Copy the above code into the box. Save and then you are done!
7. PLEASE CREDIT

abeautifulmind
8. Comments aren't necessary but appreciated. I would love to know people are using my layouts

	nightstars 2011-12-31 07:34 am UTC (link)
	Using here! I switched out the background. (Reply to this) (Thread)

	lace_and_cream 2012-01-01 08:42 am UTC (link)
	Looks good! If you want the custom nav to appear make sure to add a website, I forgot to mention that in the instructions (oops!) (Reply to this) (Parent)