Blog Elements in Funnel and Website Builder
The blog elements in the funnel and website builder allow you to put previews of your recent posts in pages and allow you to make a navigation menu for your blog categories.
In This Article:
Blog Posts Element
You can add a preview of your most recent blog posts and a link to your full blog using the Blog Posts element.
To add the Blog Posts element, click on the plus sign in the upper left hand corner and select elements from the left side of the panel that opens. Find the Blog section, select the Blog Posts element and drag it to the desired location on the page.
Customizing Blog Element
From the options panel on the right side you can make a number of customizations to the blog posts element. You can:
- Change the name of the element.
- Modify the blog type layout (e.g., vertical with photo at the side or horizontal with photo above the text).
- Select the blog site you want to display if there are multiple sites.
- Choose how to sort posts: recent posts, by categories, or by author.
- Adjust the number of posts displayed on the page.
- Optimize image load for speed or turn it off if images appear pixelated.
- Customize the view all button text, color, and border color.
Advanced Customization
The advanced options panel allows you to add further customization. You can:
- Set margin and padding for the element. Margin will add spacing outside of the element, so outside of the orange outline, whereas padding adds space inside the element or inside the orange outline.
- Add a border with the option to round the corners of the element.
- You can create a box shadow for the element.
- Turn on or off visibility on mobile or desktop. Blue icons means that it is visible on that device, whereas gray icons means that it is hidden on that device.
- Custom class and CSS selector allow you to make CSS adjustments that target this element.
Category Navigation Element
You can use the category navigation element to add navigation to your blog category pages.
To add the Category Navigation element, click on the plus sign in the upper left hand corner and select elements from the left side of the panel that opens. Find the Blog section, select the Category Navigation element and drag it to the desired location on the page.
Customizing the Element
You can use the side menu options to customize and update your categories.
Adding and Changing Categories
From the Navigation List box in the options panel, you will see the existing categories that were added in a list.
- Clicking on any category name listed will allow you to set the category text to show and select the category in your blog.
- To rearrange the categories, click the set of horizontal lines to the left of the Category Name and drag the category where you want it placed in the list.
- Clicking the plus sign to the right of a category name will add a new category to the navigation menu.
- Clicking the box with a side and top border will clone the current category in the navigation menu.
- Clicking the garbage can icon will allow you to delete the category from the navigation menu.
Other Category Navigation Menu General Options
- Show/hide search bar.
- Show/hide home icon.
- Change the font size and weight
- Margin and padding adjustments.
- Change the color of the menu items, change the color on hover and change the background color of the element.
- Adjust the horizontal spacing between elements or the spacing between lines
Advanced Customization for Category Navigation
The advanced tab will allow you to:
- Change line height.
- Set border and box shadow.
- Toggle visibility on/off for certain devices.