Post widgets tie steps 1 - 3 together. They're a customisable way of displaying links to your posts to your readers who can then click through to the post of their choice.
Firstly, you need to create a regular page to house your post widget(s). This is the page your readers will see when they click on, for example, the News page of your website and allow them to access specific posts. In short, it gives a condensed view of the each article.
The layout can be as simple or as complicated as you wish, by containing numerous different types of post widgets, and can include normal content as well.
Inserting a Post Widget
Click into the cell where you'd like to insert your widget then click the INSERT MEDIA button at the top of the toolbar. Select the POST LIST Widget:
Post Widget Settings
Once You've inserted your widget, you will be presented with a list of options. These settings are explained below.
NB: The preview of the post widget will only update when you click SAVE. So, apply some settings, then click save to see the effect in the preview pane.
Setting label: Give your setting a suitable name so you know what it is.
WHAT TO DISPLAY
Tag: Select a tag that was created in step 3 to only list posts with that tag assigned, or leave blank for all posts.
Order by: Posts can be ordered by... Publish Date (newest first), Publish Date (oldest first), Title (A-Z), Title (Z-A) or Random
Limit: Limits the number of posts displayed in the widget. Select from No Limit or choose the number you require. So for example if you only want to show the 3 most recent posts, choose 3 for your limit, and order by publish date (newest first).
WIDGET LAYOUT
Layout: Choose between... Vertical List, Grid, or Carousel (a bit like a gallery that you can drag or scroll horizontally)
Vertical List Settings:
Item spacing: Specifies Vertical space between posts in px
Grid Settings:
Column Width: Ideal width of each post in px. Note the system will adjust the column width to fit as many columns as close to the target width as possible. Hence the column width won't be the exact pixel width you define, but close to it, as best fits.
Column Gap: Horisontal gap between posts in px
Row Gap: Vertical gap between posts in px
Image Height: If you have uploaded a post image in the Post Settings dialogue box during step 3, here you can specify it's height as a percentage of it's width. No need to crop anything, the system dynamically fits the images to the height you define.
Common Settings:
Image: Choose between... No image, Below Title, Above Title, Left
Date display: Choose not to display a date, or choose a format with which to display the date.
Trim Content: Here you can select how much of your post's body content is shown in the widget. You can... Show whole post, Limit by characters (You are then given the option to choose how many characters in the Character limit input) or you can hide post content entirely
STYLING
Apply the text styles created in step 1... Title text, Date Text and Body Text. This styling is specific to this post widget setting, and will override any styling in your post itself.
Previewing your post widget
Once you are happy with how your post widget looks, save the setting and insert it into your page. Save the page, and you can then click the PREVIEW button to view the page in a new browser tab. Try clicking on any of the items in your post widget. They should link through to the post you have clicked on.
Further info
Remember that a post widget can be inserted anywhere on your website. You could have one on your home page, you could have a post widget in a sidebar on your post template. You can have several different post widgets on the same page, each showing posts with different tags. It is totally up to you.
Examples
It's all much easier when you can visualise things. Check out these example blog sites at the links below and our video detailing the process.
https://newshound.sketchanet.com
https://newsdesk.sketchanet.com