Entry tags:

layouts

Okay, well my new layout's pretty much finished. Aside from finishing up the banner, that is. So here are instructions if anyone else wants to install it. Unfortunately it's more complicated than the old S1 system was, because I cannot for the life of me figure out how to make a layer public, whereas before all you had to do was click this nice little clicky box and tada.

For examples of how the style looks, here's mine and telesilla's with the sidebar on the left (mine with graphic, hers without) and then anatsuno's with the sidebar on the right.


1. If you are not using S2 already, go here and choose S2 from the pulldown menu. Then press change.

2. Now go to the layer page here.

3. Choose "layout" from the "create top-level layer" section and press create.

4. Now your new layer should show in the list above. It doesn't have a name yet, but if you have other layers there already this will be the one with the highest number, since it was just created. Click edit.

5. Now there will be two lines of text in there. Delete them.

6. If you want to install the style with the sidebar on the right, click here. If you want the sidebar on the left, click here.

7. Copy the text from the layout you chose and paste it into the now blank layer on LJ. Press compile.

8. Click on the << up in the left-hand corner to get back to the layers page. Now you'll have a nice new layer called Modified Opal (left/right sidebar). Sometimes you may have to refresh to get it to show up.

9. Now go back here and under "step 1" choose it from the pulldown menu. Press change, and tada, it's installed.

10. Your style will now be the default, which for this style is greys and blues, like mine. If you want to further customize the colors and text and stuff like that, go here and go to "change individual settings". You can modify a whole bunch of stuff from there. To get the sidebar with the links, go here and input the links you want to show on the sidebar (if you were using S2 before and already had links defined, they will not have changed).



If you were using S2 before, you may already have had customizations that you want to keep. Here's how you can install them onto the new style.

1. In a new tab, go here. If you have customizations already, they will be in a layer called "user". Press edit.

2. In another tab, go to the layer page again.

3. Under "create layout-specific layer" choose user from the first menu and "modified opal" from the second. Press create.

4. Now that new layer will be in the list as well. It will be listed as being a child of "modified opal". Press edit.

5. Delete any text in there. Copy the text from your old layer, which you have opened in the other tab, and paste it into here. Press compile.

6. You now have the customizations set for this new style, but you need to install them. Go here.

7. In the "create style" box, type a name for your style so that you can find it easily if you ever need to. Now press create. Sometimes if LJ is being a bitch you may have to do this several times before the next page actually comes up.

8. Under "layout" choose the new style from the pulldown menu. Press change.

9. It will now give you the option to set a user layer as well. The number of your new layer should show up in the pulldown menu. Choose it and press "save changes".

10. Now you're back on the styles page. Press "use" next to the new style and that will install it, along with your new customizations. If you want to further customize, you can do so in the main customization area under "change individual settings".



Many S2 styles have present color themes you can use. anatsuno is using the one called Natural Forest (I'm using it on my JournalFen as well), which I really like. If you want to install a theme, you'll have to associate it with the new modified opal style you have installed.

1. To find the theme you want, go here and scroll down until you see the themes listed underneath the Opal style.

2. Once you've decided on a theme, click on the "view as HTML" link on the theme's page and open that in a new tab.

3. Now back in your old tab, go back to the layers page. Under "create layout-specific layer" choose theme from the first menu and "modified opal" from the second. Press create.

4. Now that new layer will be in the list as well. It will be listed as being a child of "modified opal". Press edit.

5. Delete any text in there. Copy the text from the preset theme, which you have opened in the other tab, and paste it into here. Press compile.

6. You now have the theme set for this new style, but you need to install it. Go here.

7. Press edit for the style you're using. In the theme box choose your new theme and press "save changes". Now your theme is installed.



If you want to add a graphic to your style, it's pretty simple. As you can see by looking at my layout, there's a place for a graphic right at the top. If your screen resolution is 1024x768, the width of your graphic should be 715 pixels to fit perfectly with the style.

1. Once you have your graphic ready to install, go back to the layers page.

2. Press edit on your modified opal layer. Scroll almost all the way down to the bottom. The bit of code you're looking for is this:

<div class="graphic">

</div>

3. What you want to do is insert the following code between those two lines:

<img src="your graphic's URL">

4. Press compile and your graphic is now added to the layout.


ETA: anatsuno wanted to add this nifty little search to her layout. It searches your last 50 entries, which is not quite as handy as if it searched your entire journal, but still pretty cool.

1. Go back to the layers page.

2. Press edit on your modified opal layer. Scroll almost all the way down to the bottom. The bit of code you're looking for is this:

$this->lay_print_sidebar();

"""

</div>

On the left sidebar style, it will be before the div with the graphic. On the right sidebar style, it will be below.

3. What you want to do is insert the following code between the line with the quotation marks and the line with the end div tag:

<div class="border4">
<div class="border3">
<div class="border2">
<div class="columncontent">
<form action="http://www.robohouse.com/lj/search.php" method="get">
<input type="hidden" name="action" value="search">
<input type="hidden" name="user" value="YOUR USERNAME HERE">
<b>search my last 50 entries</b>
<br>
<input type="text" size="25" name="search">
<select name="field">
<option value="all">All</option>
<option value="subjects">Subjects</option>
<option value="entry">Entries</option>
<option value="currents">Currents</option>
</select>
<br>
<input type="checkbox" name="strict" value="1"> Match exact word
<br>
<input type="submit" value=" search ">
</form>
</div>
</div>
</div>
</div>
<br />

4. Make sure you change the bit that says "YOUR USERNAME HERE" to your username.

5. Press compile and the search function is now added to the layout.

You can see what it looks like on telesilla's journal. It's on the very bottom of the sidebar, below the calendar.