Blogging is core WordPress functionality, and with Avada, we have added many ways to get the most out of this core custom post type. For a full rundown on how to blog, in conjunction with Avada, please see the full series of Blog Post type documentation here.
A great way to add blog posts to a page however, is to use the Blog Element. This is a fantastic method to use, because it allows you to place your blog posts on any page, select any of our layouts, assign custom categories to display, and so much more. Using the Blog Element gives you the flexibility to add a blog feed on any page, and indeed, anywhere on the page. Each Blog element can have a different set of categories, layouts and other unique blog settings. It’s also great to use if you want to only display a few posts on a page along with other content. Before you can display blog posts, you must, of course, first create them.
Read on to find out about all the options for this Element, and watch the video for a visual overview.
For privacy reasons YouTube needs your permission to be loaded.
The Blog Element is a versatile way to add blog posts anywhere on your site. Simply add the Element to your desired Column.
Once you have added the element it’s time to configure the Blog element to your liking. This is where the action happens. The Blog Element comes with 7 different blog layouts for you to choose from. They can then all be customized to your liking. To view the possibilities of this element, make sure you visit the Blog Element Demo page. There are way too many options to go through for this element, but if you start with your preferred layout, and then slowly go down the options list, customizing its appearance to suit your wishes, you will soon get the blog page you are looking for! There is almost nothing that cannot be customized, and it is a very versatile way to add blogs to a page.
IMPORTANT NOTE: When using the Blog element, the general Avada Global Options on the Blog tab will not take effect. This is because each Blog Element has its own set of options built directly into the element. This allows you to set all the options per instance of the element. The single post Page Options in Avada Global Options will still apply.
Note: The Default setting will use the global settings assigned for this element at Options > Avada Builder Elements > Blog. Also, please note that the displayed options screens below show ALL the available options for the element. If you have Avada’s Option Network Dependencies turned on, you will only see options relevant to your selections, and so the options screen may look somewhat different.
Posts Per Page
Select number of posts per page. Set to -1 to display all. Set to 0 to use number of posts from Settings > Reading.
Select the status(es) of the posts that should be included or leave blank for published only posts.
The number of posts to skip. ex: 1.
Pull Posts By
Choose to show posts by category or tag.
Select categories or leave blank for all.
Select categories to exclude.
Select a tag or leave blank for all.
Select a tag to exclude.
Defines how posts should be ordered.
Defines the sorting order of posts.
Display the post featured image.
Display the post title below the featured image.
Controls if the blog post content is displayed as excerpt, full content or is completely disabled.
Insert the number of words/characters you want to show in the excerpt.
Strip HTML from Posts Content
Choose to strip HTML from the post content.
Show Meta Info
Choose to show all meta data.
Show Author Name
Choose to show the author.
Choose to show the categories.
Show Comment Count
Choose to show the comments.
Choose to show the date.
Show Read More Link
Choose to show the Read More link.
Choose to show the tags.
Choose to show or hide the element on small, medium or large screens. You can choose more than one at a time.
Add a class to the wrapping HTML element.
Add an ID to the wrapping HTML element.
Select the layout for the element
Number of Columns
Set the number of columns per row. IMPORTANT: Masonry layout does not work with 1 column.
Controls the column spacing for blog posts.
Masonry Image Aspect Ratio
Set the ratio to decide when an image should become landscape (ratio being width : height) and portrait (ratio being height : width). IMPORTANT: The value of "1.0" represents a special case, which will use the auto calculated ratios like in versions prior to Avada 5.5.
Masonry 2x2 Width
This option decides when a square 1x1 image should become 2x2. This will not apply to images that highly favor landscape or portrait layouts. IMPORTANT: There is a “Masonry Image Layout” setting for every image in the WP media library that allows you to manually set how an image will appear (1x1, landscape, portrait or 2x2), regardless of the original ratio. In pixels.
Set to yes to display grid boxes with equal heights per row.
Choose HTML tag of the title heading, either div or the heading tag, h1-h6.
Post Title Typography
Controls the title typography
Timeline Title Size
Choose HTML tag of the timeline title heading, either div or the heading tag, h1-h6.
Timeline Title Typography
Controls the timeline title typography
Link Title To Post
Choose if the title should be a link to the single post page.
Controls the alignment of contents.
Choose the type of pagination.
Grid Box Color
Controls the background color for the grid boxes.
Grid Element Color
Controls the color of borders/date box/timeline dots and arrows for the grid boxes.
Grid Separator Style
Controls the line style of grid separators. NOTE: Separators will display, when excerpt/content or meta data below the separators is displayed.
Grid Separator Color
Controls the line style color of grid separators.
Blog Grid Text Padding
Controls the padding for the blog text when using grid / masonry or timeline layout. Enter values including any valid CSS unit, ex: 30px, 25px, 0px, 25px.