The Posts Block - Otter Blocks Library
The Posts block allows displaying a certain number of posts on different pages.
The specific customizations available for this block cover four areas:
- Styles - can be opened from the pencil icon too.
- Grid - display the posts one next to the other.
- List - display the posts one by one, in a list.
- Post Types
- Post Type - select the types of posts: Post / Page / Product.
- Columns - insert the number of columns.
- Order By - select the order of the posts to be displayed: Newest to oldest / Oldest to newest / A - Z / Z - A.
- Categories - insert the categories of the posts, separated with commas or Enter key.
- Number of items - choose the number of items to be displayed.
- Offset - number of posts to displace or pass over.
- Design & Layout
- Customize the Image / Category / Title / Meta / Description
- Visibility - control the visibility of the elements by clicking on the 👁️ icon.
- Reorder the elements with a drag and drop movement.
Customizing the elements of the posts
Under the Design & Layout tab you will find a lot of options to customize the elements of the post. You can rearrange the order of the posts' elements or change their visibility.
- Image Size - adjust the size of the posts images, by choosing a predefined size from the drop-down list.
- Crop image to fit - enable this to crop the image.
- Display box shadow - adds a shadow to the image.
- Border Radius - rounds the corners of the image.
- Image Width - adjust the width of the image using the slider.
- 📝Note: If the Crop image to fit option is enabled, this one will not have an effect.
- Title Tag - modify the tag of the title by choosing one from the list ( H1, H2, ...).
- Font Size - use the slider to adjust the size of the title.
This panel contains the available meta and option to enable / disable them:
- Display post date
- Display author
- Display comments
- Display Category
- Excerpt Limit - limits the length of the post's content in the block.
- Display read more link - enable this option to add the Read more link.
- Font size - use the slider to adjust the font size of the content.
📝 Note: To add more fields, activate the Advanced Custom Fields plugin.