Current mood:

tired

S2: Part 1 of 2
This is just a basic overview of how to create both layouts and layers, embed your CSS into a layer, and how to set up your S2 layout. I have made another post — which can be found here — which goes over some extras such as making your layers visible and whatnot.

‹ Layouts and Layers ›

Layouts?

I can not take credit for the following layout. The Opal port was found somewhere on GJ. I will not be offering layout codes for styles such as Flexible Squares, Smooth Sailing, and various other LJ layouts. Why? Because I'd rather it not to come back and bite me in the ass for offering stuff that shouldn't be used outside of LJ. Besides, with a little bit of looking around, I'm sure you can find the codes yourself.

• Opal

How do I create a new layout?

1. Go to Your Layers which can be found in the Advanced Customization area


2. Scroll down to the bottom where you will see Create top-level layer under the Create Layer section. Choose Layout from the drop down menu. Click Create.


3. The page will then refresh and your new layout can be seen. It should look something like this:
   123426 | layout | (none) | edit | delete
   
   Click on the edit button.


4. Delete everything in the box and then copy/paste your codes into the box. Click Compile.


5. If all goes well, it should refresh the page with a No errors message.

Themes?

Layers are where it's all at. Not only can you hack the default layout to bits with layers, but you can also use them for something as simple as embedding your CSS. The later will be a lifesaver if you don't have a host that will allow hot linking.

How do I create a new layer?

1. Go to Your Layers which can be found in the Advanced Customization area


2. Scroll down to the bottom where you will see Create layout-specific layer. Choose Theme from the drop down menu. Then choose your desired layout from the other drop down menu. Click Create.


3. The page will then refresh and your new layer can be seen. It should look something like this:
   123426 | theme | (none) | edit | delete

‹ Embedding CSS ›

Why should I embed my CSS in a S2 layer?

It will be a lot easier to handle and edit. This is also good for those who do not have a web host which allows it's users to hotlink.

Do I actually have to embed my CSS into a layer?

In all due honestly, you may not have to hard code (or embed) your CSS into a layer here on Scribbld. I actually wrote this tutorial up for Greatestjournal and that was the only way to get your CSS into your S2 layout. However, I personally recommend it just because you know it will work for a fact.

How do I embed my CSS into a layer?

1. Click on the Edit button next to your new layer.


2. Leave layerinfo "type" = "theme"; alone.


• You can actually add a name to your layer on the second line to make things a lot easier to find and edit later.
  Ex: layerinfo "name" = "S2 tutorial";


3. Add the following after layerinfo "name" = "";:
   function print_stylesheet() {
   """
   
   """;
   }


4. You then add your CSS between the """ & """;.
   Click compile. And it should, hopefully, come back with a no errors message.


5. Once it's all done it should look something like this.


• You can over look the layerinfo source_viewable = 1; that you see. That's just so you can actually view the layer. Sorry that the CSS is cramped.


• Since this is nothing more than an example, I just used the default Opal stylesheet and then ran it through an optimizer.

‹ Set Up ›

How do I set up my new layout?

1. Go to the Customize section.


2. Make sure you are using S2 style system. If you're not, then switch to it.


3. Click Your Custom Layers.


4. Click apply theme for the layout/layer you want.


5. If you want to make some minor changes (such as changing the way your navigation links are read, or enabling the use of the old comments page) then click on Customize your theme. If you don't want to change anything then leave it alone.