Blogs: Add a description of your blog and image height
This customization adds the ability to change the Featured image banner height and also adds the option to have a description of your blog.
Example: Description added below standard blog index title:
Example: Title and description centred with no banner:
Example: Featured image with short height setting and right aligned title & description:
How to:
Always make a duplicate of your theme before adding any code. This will save you if anything goes wrong or if you decide not to use the added code in the future. We can not support or be responsible of any code changes that you make to your theme. For that reason, save yourself and make a duplicate first.
Make a duplicate before any code changes:
Next, open the Code Editor:
From your list of themes, find the Actions link for the theme you'd like to edit. Then select Edit code. Example draft theme:
Verify your theme version - This customization has links for different versions of Pipeline. Be sure you know exactly which version of Pipeline you are running:
Click to check your version of Pipeline
- 1
-
Replace code
Open the Code Editor - Choose Edit code from Theme actions:
From the Sections folder, open blog.liquid:
Use Command-A (Mac) or Control-A (Win) to select all:
Erase all the code in that file and replace it with all the code from one of these options:
Option 1: Pipeline 4.2 and higher:
OR
Option 2: Pipeline 4.0 - 4.1
OR
Option 3: Earlier versions of Pipeline 2.0 - 3.1:
Save the file:
- 2
-
View the new setting option in the Theme Editor
Customize your theme, open the Theme Editor:
Use the top drop-down menu:
Change to Blogs (1):
Then click on Blog (2) for the settings.
These are the new settings for your blog description and alignment:
The description uses HTML tags to style the content. If you need to use a line break, use the code: <br>
Height settings for Featured image banner:
Save the changes:
Undo
To undo this customization, use your duplicate/backup that you created at the start. Another option is to use the "Older versions" link for blog.liquid:
