[paidaccount] [flexible squares] Adding a Header Image
Paid Accounts Only The following tutorial requires creating and editing a custom style, which in turn requires a paid, permanent, or early adopter account. Please read What are the paid account benefits? and How do I buy a paid account? to learn about the paid account benefits and how to buy a paid account.
This tutorial provides a method of adding a header image with the S2 style Flexible Squares, and uses the Print::print_custom_head () function. You will need to place the coding in a theme layer. If you already have a theme layer for the Flexible Squares style, you can edit it to include this code. Otherwise, you need to create one as explained in the Theme Layer tutorial.
Before beginning this customization, make sure you have the picture in a valid image format and uploaded to a website that allows remote loading.
You will need to add the code in the boxes below to your theme layer.
If you do not already have a theme layer, the following two lines are essential to identifying your new layer. You can replace the text in orange with any name you would like.
layerinfo "type" = "theme"; layerinfo "name" = "FlexiSquares - Header Image"; The next block of code contains the Print::print_custom_head () function, which will allow you to customize the size and position of your header image.
function Print::print_custom_head () { """ """; }
After pasting this code, you must edit the height attribute to the height of your image.
The lines in blue above show the different CSS declarations available to customize your header image. A separate tutorial explains how you can modify each background attribute. Only the background-image: attribute is necessary, but if you choose to use any, they must be in the order shown above.
You must replace the URL in lavender with your the URL of your image. Please remember that the website your image is stored on must allow remote loading to LiveJournal.
The code in green is not needed, but it does prevent your header image from directly touching the content of your LiveJournal by adding extra space. If you do decide to use it, the number 15 can be adjusted.
Compile your layer and it will be ready to use. If you created a new theme layer rather than editing one that was already in use, you will need to apply it using the theme layer dropdown of the Customize interface for it to take effect.
Additional References What are the different S2 layer types?
Adding header images in other styles
Contributed by deadmantalks. Some elements taken from a tutorial by phoenixdreaming and camomiletea.