carrie

Dark Tower Layout

This layout was created for the "Literature" theme in the Last Layout Standing competition. The layout is based on the "Dark Tower" series by Stephen King. Images and codes can be found under the cut.

Style: Generator
Website: You need a website in your userinfo
Custom Colors: leave blank
Default Icon: ok, doesn't show
Best view: 800x600 and above
Browser(s) Compatible: FF and IE

Image(s):
MAIN BACKGROUND IMAGE
FOOTER IMAGE
USERINFO LINK IMAGE
RECENT ENTRIES LINK IMAGE
FRIENDS PAGE LINK IMAGE
ARCHIVE PAGE LINK IMAGE
HEADER IMAGE
COMMENT DIVIDER IMAGE

GLOBAL_HEAD<=
<style type="text/css">
<!--
/*GETS RID OF ICON*/
.shadowed img{
display:none;
}
table.entrybox td{
padding:0;
}

/*HIDES YOUR NAVIGATION*/
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
}

/*POSITION YOUR HEADER*/
.x{
position:absolute;
top:0px;
width: 700px;
height:495px;
left:50%;
margin-left:-352px;}

/*BACKGROUND IMAGE*/
body {
background-color:#2d1e02;
background-image: url(http://pics.livejournal.com/carriep63/pic/000396x4);
background-repeat:repeat-y;
background-position:top center;
margin:0;
padding:0;
margin-top:495px;
color:#702F07;
}

body, table, td{
font-size:10px;
}

div{
margin-bottom:-20px;
padding-bottom:175px;
background-image: url(http://pics.livejournal.com/carriep63/pic/0003r6pt);
background-repeat: no-repeat;
background-position:bottom center;
}

/*JUSTIFIES TEXT*/
.entrybox td{
text-align: justify;
}
.entrybox td.index{
text-align: right;
}

.entrybox td.index, .index3{
display: none;
}

.entrybox .caption{
text-align:center;
color:#3F3F3F;
font-family:serif;
font-variant:small-caps;
font-size:18px;
font-weight:bolder;
letter-spacing:.1em;
}
.entrybox .index2{
text-align:center;
color:#B86E23;
padding-bottom:.5em;
}
a{
color:#000000;
font-weight:bold;
}
a:hover{
color:#B86E23;
}

table.entrybox td.comments{
text-align:center;
padding-bottom:20px;
padding-top:.5em;
}
.entrybox td.comments a{
color:#3F3F3F;
font-family:serif;
font-variant:small-caps;
font-size:11pt;
letter-spacing:.1em;
}
.entrybox td.comments a:hover{
color:#B86E23;
text-decoration:none;
}
.entrybox .meta{
display:none;
}

#nav{
position:absolute;
top:204px;
left:50%;
width:160px;
height:auto;
margin-left:-314px;
z-index:5;
visibility:visible;
background:none;
}
.info a{
background-image: url(http://pics.livejournal.com/carriep63/pic/0003hhcw);
background-position:top left;
width:76px;
height:17px;
display:block;
margin-bottom:1px;
}
.info a:hover{
background-position: top right;
}
.recent a{
background-image: url(http://pics.livejournal.com/carriep63/pic/0003k7s2);
background-position:top left;
width:124px;
height:17px;
display:block;
margin-bottom:1px;
}
.recent a:hover{
background-position: top right;
}
.friends a{
background-image: url(http://pics.livejournal.com/carriep63/pic/0003g8ba);
background-position:top left;
width:104px;
height:16px;
display:block;
margin-bottom:1px;
}
.friends a:hover{
background-position: top right;
}
.archive a{
background-image: url(http://pics.livejournal.com/carriep63/pic/0003pdwk);
background-position:top left;
width:70px;
height:16px;
display:block;
}
.archive a:hover{
background-position: top right;
}

-->
</style>
<=GLOBAL_HEAD

LASTN_TALK_READLINK=><a href="%%urlread%%">read (%%messagecount%%)</a> -

LASTN_DATE_FORMAT<=
</td></tr><tr><td class="index2">
%%m%%/%%d%%/%%yy%% - %%12h%%:%%min%% %%ampm%%

</td></tr><tr><td class="index3">
<=LASTN_DATE_FORMAT

LASTN_WEBSITE<=
<div id="nav">
<span class="info"><a href="http://YOURNAME.livejournal.com/info"></a></span>
<span class="recent"><a href="http://YOURNAME.livejournal.com"></a></span>
<span class="friends"><a href="http://YOURNAME.livejournal.com/friends"></a></span>
<span class="archive"><a href="http://YOURNAME.livejournal.com/calendar"></a></span>
</div>

<img src="http://pics.livejournal.com/carriep63/pic/0003d407" class="x" style="display:inline;">
<=LASTN_WEBSITE

LASTN_TALK_LINKS<=
<tr>
<td align="center" colspan="2" width="100%" bgcolor="%%color:weak_back%%" class="comments">

%%readlink%%<a href="%%urlpost%%">Reply</a>
<br />
<img src="http://pics.livejournal.com/carriep63/pic/0003wge5" />
</td>
</tr>
<=LASTN_TALK_LINKS

FRIENDS_TALK_READLINK=><a href="%%urlread%%">read (%%messagecount%%)</a> -

FRIENDS_DATE_FORMAT<=
</td></tr><tr><td class="index2">
%%m%%/%%d%%/%%yy%% - %%12h%%:%%min%% %%ampm%%

</td></tr><tr><td class="index3">
<=FRIENDS_DATE_FORMAT

FRIENDS_WEBSITE<=
<div id="nav">
<span class="info"><a href="http://YOURNAME.livejournal.com/info"></a></span>
<span class="recent"><a href="http://YOURNAME.livejournal.com"></a></span>
<span class="friends"><a href="http://YOURNAME.livejournal.com/friends"></a></span>
<span class="archive"><a href="http://YOURNAME.livejournal.com/calendar"></a></span>
</div>

<img src="http://pics.livejournal.com/carriep63/pic/0003d407" class="x" style="display:inline;">
<=FRIENDS_WEBSITE

FRIENDS_TALK_LINKS<=
<tr>
<td align="center" colspan="2" width="100%" bgcolor="%%color:weak_back%%" class="comments">

%%readlink%%<a href="%%urlpost%%">Reply</a>
<br />
<img src="http://pics.livejournal.com/carriep63/pic/0003wge5" />
</td>
</tr>
<=FRIENDS_TALK_LINKS

CALENDAR_WEBSITE<=
<style type="text/css">

</style>

<img src="http://pics.livejournal.com/carriep63/pic/0003d407" class="x" style="display:inline;">
<=CALENDAR_WEBSITE

DAY_WEBSITE<=
<div id="nav">
<span class="info"><a href="http://YOURNAME.livejournal.com/info"></a></span>
<span class="recent"><a href="http://YOURNAME.livejournal.com"></a></span>
<span class="friends"><a href="http://YOURNAME.livejournal.com/friends"></a></span>
<span class="archive"><a href="http://YOURNAME.livejournal.com/calendar"></a></span>
</div>

<img src="http://pics.livejournal.com/carriep63/pic/0003d407" class="x" style="display:inline;">
<=DAY_WEBSITE

Subject for test entry.

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper

Everybody's favorite layout (new sidebar tutorial)

I had it in my head to revamp our existing sidebar tutorial with a few "upgrades" and ended up writing a whole new code. This is more than just a sidebar tutorial. I have taken everyone's favorite layout (EFL) and came up with this.

EFL has a header image, a sidebar, hidden navigation and hidden icon.

The text is justified in the entries and in the sidebar

The entries are on top of the header in both Internet Explorer and in Mozilla Firefox.

The whole thing is centered (no more layouts to the left)!

There is no "overflow" in FF or in IE so hiding the bottom scrollbar is not necessary.

Images are easier to put in the sidebar.

You STILL NEED A WEBSITE listed in your userinfo!

GLOBAL_HEAD<=
<style type="text/css">

</style>
<=GLOBAL_HEAD

LASTN_WEBSITE<=


<div id="sidebar">
The text, links, and pictures you want in your sidebar.<br />
--------------------
<br />
I am going to put an image in this sidebar. Usually when you hide
your icon, you have to put a visibility code in every image you use.
That is not necessary with this layout. We have not hidden our icon,
we have DESTROYED it! It's gone. Not hiding. I just put a simple
code in the HEAD overrides that will allow all of the sidebar pictures
to show without extra code. Look:<br /><br />
<center>
<img src="http://pics.livejournal.com/carriep63/pic/0000rec6">
</center>
</div>


<div> </div>


<img src="http://pics.livejournal.com/carriep63/pic/0000qkxc" class="x" style="display:inline;">

<=LASTN_WEBSITE

Positioning codes explained
You may notice that in this tutorial, I have positioned everything with the margin-left override and no margin-right overrides. Using this method will keep the content of your page in the same spot regardless of the screen resolution. It also gets rid of the bottom scrollbar (bonus!). When you are using this method, you may use either positive or negative numbers.

You MUST define a width or this will NOT work.

A left:50% line is in all overrides EXCEPT for the table.

A positive margin-left will push your content to the right.

A negative margin-left will push your content to the left.

A negative margin-left that is exactly half of the width will center the content

More on centering... Notice the header image positioning. It has a width of 780px and the margin-left is negative 390px. 390 is exactly half of 780, so that puts the header in the center. All of the position codes have the left:50% override in them except for the table code. You do not need to put this in the table(entries) code!

Subject line

You know every community has rules! This community is no different.

First and foremost; you have to be nice!! This is a non-negotiable rule. Do it.

#2. Take the time to read the tutorials, the howto journal memories, and the Livejournal FAQ's. They exists to make your life easier by not having to ask for help. If you post a question that is easily found in one of these places, we will point and laugh at you.

#3. Posting in everything_lj...

If you have a question about your overrides, you must post them so we can see what you are talking about. We can't help you if we don't know what is happening.

Don't pick and choose which overrides to show us. Just post them all, please. Often there is more than one part to an override and if we can't see what you are doing then we can not help you.

In order to post your overrides, you must transform them or they will not show up. Edit your post if you don't put them in: do not make a new post.

Please include a subject line in your post. People who actually look for their answers in the memories and in the archive can find what they are looking for much more easily!

#4. Respect other people's friends pages. Use an when you are posting your overrides.

#5. Community promotion by email ONLY. Read the box at the top of this page that says "important".

#6. Under no circumstance are you to ask for help in a maintainers journal, by IM or by email. This is absolutely forbidden. You will get the help you need here.

#7. If you decide to copy a source code from another user and post it in this community, your post will be deleted and you will be banned. We have plenty of do-it-yourself tutorials and you can get free codes at freelayouts. NO STEALING!

#8. You may not know this, but the maintainers in this community also maintain other help communities on Livejournal. Crossposting your question to another help community such as overridehelp will not get your answer any faster. It will annoy the maintainers because then they have to answer you twice. Please refrain from doing this.

#9. **New Rule** DO NOT, and I repeat: DO NOT ask us for the code to put background music on your journal. Also DO NOT and I repeat again: DO NOT give out the code for background music in this community and expect me not to hate you. If you are a paid user, you can find the code for background music here, but keep in mind:

~Background Music is friggin annoying. I have never visited a page with background music where I did not want to kill the maker of that page.

~Background Music is not browser friendly, nor is it supported in all browsers. It slows everything down, and by the time the crap is done loading I am done looking at your page anyway so it is worthless!!

~The code for Background Music must be merged correctly or it screws up your whole journal. I am so sick of walking people through this music override that it is now BANNED from this community.

That wasn't so hard, was it?
</textarea>

To add one or more links to the system's Generator style, simply piggyback the website link override.

This override will be operational only if the livejournalist actually specifies a personal website under the user profile settings. In the sample code given above, display of the website link is retained. The segment that retains the website link can be deleted from the override if so desired, as long as a website is still specified within the user's profile.

Note that although the website link code here can use LiveJournal variables that automatically pick up the right values (%%--%% and %%--%%), no variables can be used in any tag-along links. Thus, to add links to items that you would normally be able to use those variables for, you will need to use the full url.

You can use as many sections for tag along links as you would like. If you would only like to add one extra link then you would remove the second set of tag along link code.

A livejournalist who uses a background image frequently wishes to use no background color or a semi-transparent background color for the areas that contain the text of the livejournal content. Only one or the other of the following overrides can be used at a time.

The following override can be used to achieve content area transparency under Punquin, Generator, Default, Tabular Indent, and Refried Paper. The notable exception being Magazine which cannot use table transparency and is mostly transparent as is; and Disjointed which uses a different override entirely--

The opacity level, set to 80 in the above example, can be changed to any number that you prefer. Setting the opacity to 100, or 1.0, will make the background completely opaque. If you want your background to be solid there is no need to use any override at all.

Using this filter will change the opacity of the entire table, including the text within it so you will need to choose an opacity level that still allows the text to be visible.

NOTE: Opacity filters are a resource intensive customization. Use of an opacity filter can cause older browsers, computers with lower resources, and computers where much of the system memory is already in use to freeze, crash, or otherwise behave unexpectedly. If after using the above opacity filter override, you are expierencing a sudden problem with your journal loading slowly (or not at all), your browser freezing, or your operating system freezing, please try removing the opacity filter override and reloading your journal page to see if the problem persists before submitting a Support request.

subject

Welcome to my test journal. Please do not comment here or add me to your friends list. This journal is only for me to test layouts. If you need a layout made, you can contact me at livejournal and fill out a request form at one of my layout communities. Have a pleasant day.