Completely confused with LJ layouts! [Archive] - Lissa Explains it All: Web Design Forums

View Full Version : Completely confused with LJ layouts!

dizzyjess

08-07-2006, 09:11 PM

Hello,
I'm very new to the whole livejournal thing.
I am familiar and good with css, html and stylesheets & I know I would find inserting my own custom layout on LJ quite easy.
The only problem is, I have no idea how to start! Where do I go to insert my codes, pictures and colours? I tried inserting a code from a pre-made layouts site to see how it worked, but nothing happened and it seems I did something wrong.
Could someone explain to me how to get my own layout up on LJ? I'd appreciate the help =].
Thankyou, Jess.xxx.

bourdelson

08-07-2006, 10:09 PM

If you're using the S1 style [which is usually the default], go to Manage > Customize > Custom Options and enter your codes into the box under the heading "Overrides." :)

dizzyjess

08-08-2006, 11:05 AM

I copied this code into the overrides box:

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


<style type="text/css">









<style type="text/css">
.shadowed {
background: transparent;
}
-->
<style type="text/css">
body, td {
font-family: verdana, verdana;
font-size: 10pt;
}
tt, pre {
font-family: monospace;
}
a {
text-decoration: none;
}
a:hover {
text-decoration: underline;
}
.shadowed {
font-size: 8pt;
background: ;
}
.meta {
font-size: 8pt;
}
.index {
font-size: 8pt;
}
.caption, .index {
color: ;
}
.comments {
font-size: 8pt;
}
</style>
<style type="text/css">
body, td {
font-family: verdana, verdana;
font-size: 7.5pt;
}
tt, pre {
font-family: monospace;
}
a {
text-decoration: none;
}
a:hover {
text-decoration: underline;
}
.shadowed {
font-size: 7.5pt;
background: ;
}
.meta {
font-size: 7.5pt;
}
.index {
font-size: 7.5pt;
}
.caption, .index {
color: #f2329a;
}
.comments {
font-size: 7.5pt;
}

</style>
<=GLOBAL_HEAD

LASTN_TALK_READLINK=><P ALIGN="RIGHT"><FONT FACE="arial" SIZE=3><A HREF="%%urlread%%">0%%messagecount%% LOVED</A> ♥

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

</style>
<tr><td colspan="5" width="100%">
<table style="float:right" cellspacing="0" border="0" cellpadding="0">
<tr><td class="meta">

<a href="http://www.greatestjournal.com/userinfo.bml?user=BOOMBOXLOVE">SUGAR</a>pete<a href="http://BOOMBOXLOVE.greatestjournal.com/friends">WERE GOING</a>wentz<a href="HTTP://WWW.MYSPACE.COM/yourdirtylittlesecretx">DOWN</a>

</td></tr></table></td></tr>
<=LASTN_WEBSITE

LASTN_TALK_LINKS=><P ALIGN="RIGHT"><FONT FACE="arial" SIZE=3>%%readlink%%<A HREF="%%urlpost%%">A FALL OUT BOY</A></FONT></P>

& nothing has happened to my journal (http://gxess.livejournal.com). A layout is supposed to appear.

What am I doing wrong? =[

bourdelson

08-08-2006, 04:38 PM

Okay, I went through and cleaned up your overrides and made the a little easier to read:

GLOBAL_HEAD<=
<style type="text/css">
A:link
{text-decoration:none;
color:#f2329a;
text-transform:none;
font-weight:bold;}

A:visited
{text-decoration:none;
color:#f2329a;
text-transform:none;
font-weight:bold;}

A:active
{text-decoration:none;
color:#f2329a;
text-transform:none;
font-weight:bold;}

A:hover
{text-decoration:none;
color:#f2329a;
text-transform:none;
font-weight:bold;
cursor:default;
filter:glow(Color=#000000,Strength=2);
}

body {
background-color: black;
background-image: url(http://layouts.cbimg6.com/25/12734c.gif);
background-repeat: repeat;
background-attachment: fixed;
background-position: top left;
scrollbar-base-color: #d3f0e8;
scrollbar-track-color: #d3f0e8;
scrollbar-face-color: #d3f0e8;
scrollbar-highlight-color: black;
scrollbar-3dlight-color: black;
scrollbar-darkshadow-color: black;
scrollbar-shadow-color: black;
scrollbar-arrow-color: black;
}

div {
background-image: url(http://layouts.cbimg6.com/25/12734d.gif);
background-repeat: no-repeat;
background-position: top center;
padding-top: 312px;
padding-bottom: 20px;
text-align: center;
}

div div {
background: none;
width: auto;
height: auto;
padding: 2px;
}

div table {
width: 402;
}

div table table {
width: 100%;
}

div table table table {
width: auto;
}

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

/* change these numbers, make them add up to 100 or less*/
table {
width: 50%;
margin-left: 25%;
margin-right: 25%;
}
/* don't change these numbers */
table table {
width: 100%;
margin:0;
}
table table table {
width: 0;
}

table {
border: 1px double #000000;
}
table table {
border: 0;
}

tr.caption{
display:none;
}

.shadowed td div{
visibility: hidden;
position: absolute;
top: 1px
}

.shadowed img{
visibility:hidden;
position:absolute;
top:0px;
}

.showme{
visibility:hidden;
position:relative;
}

.shadowed {
background: transparent;
}

body, td {
font-family: verdana, verdana;
font-size: 8pt;
}
tt, pre {
font-family: monospace;
}

.shadowed {
font-size: 8pt;
background:#f2329a;
}

.meta {
font-size: 8pt;
}

.index {
font-size: 8pt;
}

.caption, .index {
color:#f2329a;
}

.comments {
font-size: 8pt;
}
</style>
<=GLOBAL_HEAD

LASTN_TALK_READLINK=><P ALIGN="RIGHT"><FONT FACE="arial" SIZE=3><A HREF="%%urlread%%">0%%messagecount%% LOVED</A> &hearts;

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;
}

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">
<a href="http://www.greatestjournal.com/userinfo.bml?user=BOOMBOXLOVE">SUGAR</a>pete<a href="http://BOOMBOXLOVE.greatestjournal.com/friends">WERE GOING</a>wentz<a href="HTTP://WWW.MYSPACE.COM/yourdirtylittlesecretx">DOWN</a>
</td></tr></table></td></tr>
<=LASTN_WEBSITE

LASTN_TALK_LINKS<=<P ALIGN="RIGHT"><FONT FACE="arial" SIZE=3>%%readlink%%<A HREF="%%urlpost%%">A FALL OUT BOY</A></FONT></P>
<=LASTN_TALK_LINKS

Delete what's in your override box now, paste this in there, save it and see if anything changes. :)

Also, have you remembered to change the actual style of your journal? If not, go to Manage > Customize > Look and Feel, and change Most Recent Events, Friends View, Calendar and Day View all to the style Generator. That might also help. :)

dizzyjess

08-10-2006, 02:42 PM

Thankyou very much, I'll try this out =].

dizzyjess

08-10-2006, 02:46 PM

Thanks! Everything's working now!
I can now adapt everything to my own layout =D.

bourdelson

08-10-2006, 04:32 PM

You're welcome! I'm glad it's working for you! :)