LiveJournal Layouts
Over the last few years I've made a couple of LJ layouts that I've decided to share with you. Obviously you can change the colour scheme and the banners as you desire, or use the ones I've provided with the stylesheets; either is cool just as long as I get credit for the stylesheet (and the header if you use it) and you upload the images to your own image host!
All of the following layouts are for Flexible Squares and the basic setup is as follows:
1. Go to the Customise page and make sure you're using S2
2. In the "Select a New Theme" section type "Flexible Sqaures" in the search box and select one of the themes. I used "Blue Grey" as it used to be the default.
3. In the "Choose a Page Setup" section select "2 Column (sidebar on left)"
4. Click on "Customise Selected Theme"
5. In the "Display section under "Presentation - Additional Options" set the user picture position to right
Layout 1
To use this layout go to "Custom CSS" in the "Customise Your Theme" section and set:
1. "Use layout's stylesheet(s)" to Yes
2. "Use layout's stylesheet(s) when including custom external stylesheet" to No
3. "Use external stylesheets" to No
4. Copy the following CSS into the "Custom stylesheet" box and "Save Changes"
Layout 2
To use this layout go to "Custom CSS" in the "Customise Your Theme" section and set:
1. "Use layout's stylesheet(s)" to No
2. "Use layout's stylesheet(s) when including custom external stylesheet" to No
3. "Use external stylesheets" to No
4. Copy the following CSS into the "Custom stylesheet" box and "Save Changes"
For this layout you need to add your images to the header and the sidebar seperatly.
Header
Sidebar Image
Content Background (yes I know it's just white, but this is important if you want to have a background on the body)
Notes:
1. Uploading the images to your own image host would be nice
2. Depending on the length of your navigation, and on your header image, you might want to change the location of your navigation and you can do this by changing the "padding" values under "ul.navheader" (use your text editor to Find (Edit >> Find) that in your code)
3. Again depending on your header image you may wish to move where the sidebar contents start and you can do this by changing the value of "padding-top" under "#sidebar" (again use your Text Editor (eg Notepad) to find that in your code)
4. Also, if you have a background you may want a border on the side of the sidebar and you can do this by increasing the final padding value on ".sbarheader", ".sbarbody" and ".sbarbody2" (Use a Text Editor to find it in the code)
Layout 3
To use this layout go to "Custom CSS" in the "Customise Your Theme" section and set:
1. "Use layout's stylesheet(s)" to No
2. "Use layout's stylesheet(s) when including custom external stylesheet" to No
3. "Use external stylesheets" to No
4. Copy the following CSS into the "Custom stylesheet" box and "Save Changes"