Blog Showcase Shortcode

Updated on December 29, 2017

The blog showcase shortcode displays specific posts that you can select in the shortcode settings. This shortcode allows you to display posts of specific categories and specific authors.

In this article you’ll find out how to create posts, add the blog showcase shortcode to a page, and configure the shortcode settings.

Blog showcase shortcode - demo


Creating Blog Posts

Blog showcase shortcode displays blog posts. For more information about creating blog posts, read Creating a blog post article.


Displaying the Blog Showcase Shortcode

To add the Blog Showcase shortcode in a page to show in front end of the website please follow steps below:

1Add a new page or edit an existing page.
2From Visual Composer screen, click + button.

Blog showcase shortcode - visual composer screen

3In Add Element pop-up screen, search for Blog Showcase and click on it to be added to the page.

Blog showcase shortcode - add element

4When the shortcode is added, a new pop-up screen called Blog Showcase Settings opens. It gives you the ability to configure the shortcode settings.

Blog showcase shortcode - Blog showcase settings

5Click Save Changes and publish or update the page to check the result.

Showing Specific Posts

There are 3 settings in Blog Showcase Settings pop-up which allow you to show the posts based on specific categories, IDs or authors. Type the name of category, post or author to add them in the fields.

SettingDescription

Select Specific Categories Determines categories of blog posts. Posts from the selected categories will be only displayed.
Select Specific Posts Determines specific blog posts. The selected posts will be only displayed.
Select Specific Authors Determines authors of blog posts. Posts from the selected authors will be only displayed.

Blog Loop Content

There are 2 settings in Blog Showcase settings pop-up to configure the content shown in the blog loop.

SettingDescription

Offset Sets the number of post to displace or pass over, it means based on your order of the loop, this number will define how many posts to pass over and start from the nth number of the offset.
Post Excerpt Length Sets custom length of the excerpt by number of characters. Zero will disable excerpt.

Altering the Posts Sorting

There are 2 settings in Blog Teaser Settings pop-up which allow you to alter the posts sorting. By default, Order and Orderby settings are set to Ascending and Date therefore it sorts the older posts ahead of newer posts.

SettingDescription

Order  Sets the ascending or descending order of the Orderby parameter.
Orderby  Sorts the posts based on the selected parameter (date, menu order, title, …).

Adding Custom Class Name

If you need to go beyond the default settings to customize the look of the item’s design, you may add a custom CSS class in Extra Class Name setting to be able to add specific styling through CSS to this shortcode. To find out more information, read Adding custom CSS class to a shortcode article.

Did this answer your question?