Savvy Blog Pages Documentation

Introduction

This Package includes a collection of three different Blog Page templates. The Package contains entire page templates that can be browsed from the Navigation / Menu Bar above. The page templates make use of a Column Content Section, the Zen Banner Section, and the CTA Banner Section to create an attractive layout. All templates utlize the site's header and footer, and defined color variables. This should result in a seamless integration with any Bootstrap enabled site. Have a look at the demo. The details are shown below.


Type # 1 (Cards Format)

Template Heading


Page: Savvy Blog Page (Cards Type)

The page template (blog_page_1.liquid) makes use of the corresponding partial template and outputs a complete page. The page includes the default Header / Footer (_header.liquid and _footer.liquid) and utilizes bootstrap classes, which mean that all set variables are automatically set (allowing seamless integration). The Page Template also uses the Zen Banner, CTA Banner, and Unraveled Column Content to make up the entire page. If you require the page to be in a consistent format with other pages in your site, you might need to use the partial template in order to better integrate the template.

In order to use the template, you must select it as the page template in Article Settings. When creating a page, use the following steps:

Click on the Plus Icon in the top left of the CMS. Then select Savvy Blog Page (Cards Type). Then you can make any neccessary settings / customizations.


Partial: Blog Posts Section - Cards (Partial)

The partial template (_blog_section_1.liquid) outputs the main content area (the cards containing the blog posts) of type # 1. It can be included with a single line and has various fields that can be set by the editor to customize the look of the section.

It has following inputs

  • posts - A list containing all Blog Posts to be displayed.
  • blog_url - The complete URL of the blog. It defaults to "entity.url".
  • show_tags - If set to true, will display all Tags associated with the Blog Post.
  • show_authors - If set to true, will display all Authors associated with the Blog Post.
Usage (Liquid Markup)

Show Full

{%- include "/marketpath/savvy-blog-pages/partials/_blog_section_2.liquid" -%}

Type # 2 (Rows Format)

Template Heading


Page: Savvy Blog Page (Rows Type)

The page template (blog_page_2.liquid) makes use of the corresponding partial template and outputs a complete page. The page includes the default Header / Footer (_header.liquid and _footer.liquid) and utilizes bootstrap classes, which mean that all set variables are automatically set (allowing seamless integration). The Page Template also uses the Zen Banner, CTA Banner, and Unraveled Column Content to make up the entire page. If you require the page to be in a consistent format with other pages in your site, you might need to use the partial template in order to better integrate the template.

In order to use the template, you must select it as the page template in Article Settings. When creating a page, use the following steps:

Click on the Plus Icon in the top left of the CMS. Then select Savvy Blog Page (Rows Type). Then you can make any neccessary settings / customizations.


Partial: Blog Posts Section - Rows (Partial)

The partial template (_blog_section_2.liquid) outputs the main content area (the rows containing the blog posts) of type # 2. It can be included with a single line and has various fields that can be set by the editor to customize the look of the section.

It has following inputs

  • posts - A list containing all Blog Posts to be displayed.
  • blog_url - The complete URL of the blog. It defaults to "entity.url".
  • show_tags - If set to true, will display all Tags associated with the Blog Post.
  • show_authors - If set to true, will display all Authors associated with the Blog Post.
Usage (Liquid Markup)

Show Full

{%- include "/marketpath/savvy-blog-pages/partials/_blog_section_2.liquid" -%}

Type # 3 (Rows Format)

Template Heading


Page: Savvy Blog Page (Hover Cards Type)

The page template (blog_page_3.liquid) makes use of the corresponding partial template and outputs a complete page. The page includes the default Header / Footer (_header.liquid and _footer.liquid) and utilizes bootstrap classes, which mean that all set variables are automatically set (allowing seamless integration). The Page Template also uses the Zen Banner, CTA Banner, and Unraveled Column Content to make up the entire page. If you require the page to be in a consistent format with other pages in your site, you might need to use the partial template in order to better integrate the template.

In order to use the template, you must select it as the page template in Article Settings. When creating a page, use the following steps:

Click on the Plus Icon in the top left of the CMS. Then select Savvy Blog Page (Hover Cards Type). Then you can make any neccessary settings / customizations.


Partial: Blog Posts Section - Hover Cards (Partial)

The partial template (_blog_section_3.liquid) outputs the main content area (the hover cards containing the blog posts) of type # 3. It can be included with a single line and has various fields that can be set by the editor to customize the look of the section.

It has following inputs

  • posts - A list containing all Blog Posts to be displayed.
  • blog_url - The complete URL of the blog. It defaults to "entity.url".
  • show_tags - If set to true, will display all Tags associated with the Blog Post.
  • show_authors - If set to true, will display all Authors associated with the Blog Post.
Usage (Liquid Markup)

Show Full

{%- include "/marketpath/savvy-blog-pages/partials/_blog_section_2.liquid" -%}

Blog Post Page

Template Heading


Page: Savvy Blog Post Page

The page template (blog_post_page.liquid) makes use of the corresponding partial template and outputs a complete page of Blog Post. The page includes the default Header / Footer (_header.liquid and _footer.liquid) and utilizes bootstrap classes, which mean that all set variables are automatically set (allowing seamless integration). The Page Template also uses the Zen Banner to make up the entire page. If you require the page to be in a consistent format with other pages in your site, you might need to use the partial template in order to better integrate the template.

In order to use the template, you must select it as the page template in Article Settings. When creating a page, use the following steps:

Click on the Plus Icon in the top left of the CMS. Then select Savvy Blog Post Page. Then select the Blog in which you want to create the Post and you can make any neccessary settings / customizations.