Layout: The Shutter Falls
LIVE PREVIEW | IMAGE PREVIEW
TEMPLATE DETAILS
Name:
The Shutter Falls
Layout Style:
Flexible Squares
Account Type:
All Accounts
Tested in:
Firefox 5.0, Opera 9.50, Google Chrome 1.0, Internet Explorer 8 (Note: I make no guarantees for any version of IE, as it should be set on fire.)
Screen Resolutions:
Best in 1024x768+
Nav Bar:
Yes, customized.
Custom Comment Pages:
Yes.
Customizable:
Yes, please see below.
Notes:
Inspired by this site. The userpic and page summary are disabled on the sidebar.
INSTALLATION DIRECTIONS
From the main LJ navigation bar:
Go to the LJ Customization Page.
Under "2. Select a New Theme":
Enter "Flexible Squares" in the search box and click the button. From the results, choose any Flexible Squares theme.
Under "3. Choose a Page Setup":
Find "2 Column (sidebar on left) and click "Apply Layout." Click the "Customize Selected Theme" button on the bottom right.
Under "Custom CSS":
- Use layout's stylesheet(s) = Yes
- Use layout's stylesheet(s) when including custom external stylesheet = No
- Use external stylesheets = No
- Custom external stylesheet URL = Leave blank
- Custom stylesheet (The big box) = Paste in everything on this page, along with any additional customizations at the bottom.
- Click "Save Changes." That's it!
CUSTOMIZATION & TERMS OF USE
How to use custom colors:
Open the stylesheet in Notepad or similar text editor and do a find and replace the color listed below:
Teal: #3bb99e
Make sure that any "word wrap" feature is turned off in your text editor before you copy and paste your CSS into LJ's Customization area.
Adding a header:
It's easy to add a header like in the preview below (click for a larger screencap):
Your image can be any height you like, but must be 300px wide. Upload it to your own hosting (LJ's Scrapbook is very good for this if you have a paid account), and paste the following code into the bottom of your stylesheet, making sure to change the values as indicated:
#content {background:transparent url(http://URL TO YOUR IMAGE GOES HERE) top left no-repeat;}
#sidebar {margin-top:###px;}
Replace ### with the height of your image less 100px. For example, if my image height is 250px, I replace ### with 150. Note: Depending upon the type of image you have and how you want everything to look, you might want to add a greater value for a bit more padding between it and the sidebar.
Regarding additional customization:
If you know what you're doing, you're welcome to further customize this layout. Please give proper credit to circa77.
Crediting:
CREDIT IS REQUIRED FOR USE. It is the polite thing to do to let other people know where you got your layout. Acceptable crediting would be linking circa77 in your userinfo, or someplace obvious on your sidebar.
Regarding Support:
While I am happy to answer general questions/be reminded about things I might have missed, I DO NOT OFFER SUPPORT FOR MY LAYOUTS.
Comments are greatly appreciated!