Element
How to use elements from the blog builder to create blog posts that are highly engaging to audiences
One of the core features of our blog app is the Notion-like editor, powered by the building block architecture instead of the Rich Text editor inside the Shopify admin. If you are familiar with Notion, or Medium, or GhostCMS, you will love this blog editing experience.
Blog builder helps you create blogs easier and faster just because you will love writing blogs again over the plain text editor you are having. In blog builder, there are 2 main actions you can take to create blogs: add elements (blocks of content) and style.
Elements
In SEOon Blog, we support several types of content and media, which is currently widely supported by Shopify blog and Shopify theme on the market.
🧰 Basic
Heading
Paragraph
Image
Video
List
Quote
Divider
Table
Product
Spacer
TikTok Embed
Instagram Embed
🚀 Advanced
Button
Text & image
Text & text
Text & product
Table of content
Related posts
Recent posts
FAQs
Testimonials
Heading
We support heading from heading 2 to heading 4. By default, the heading would be the heading 2 level. One thing missing is the heading anchor link. We have not supported this feature at the moment due to wide theme support.

You can also make the heading bold, italic, underlined, or add a link to the text. Highlight the text you want to edit and select.

Remember to structure your heading level correctly for the sake of SEO and readability of the audiences.
Paragraph

You can make text bold, italic, underlined, or attach links to text. Highlight the text you want to edit and select.
Currently, we have not yet support the link title, link target. But soonly enough we will.

Image
You can normally add the image to the editor like other blocks:
Upload an image file
Select from your media library
Insert from URL

You can also add other details for image:
Alt text
Image ratio
Image alignment
Caption
Image link

Video
You can add videos to blog by:
Uploading video from your device
Selecting video from Media library
Inserting from URL

List
You can choose to have the unordered, or ordered list in your block for better structuring your content inside the blog.

Quote
You can also add quote blocks to the blog editor.

In element settings (on the right panel), you can edit:
Layout of quote
Image
Quote
Colors for background, text and quote symbol
Authors infomation: Name and title
Divider
The same goes with the delimiter, each theme may render the delimiter a bit differently, but it would be helpful if you have a very long blog.

Table

You can edit your table by adding row or column above or below the selected row.


Product
You can insert products from your Shopify store to blog.
You can select products and set up content, button in this section.

Spacer
This helps users create spacing between elements in a blog post — without needing to use a divider.
How to configure:
Height: Adjust the vertical space
Color Picker: Customize the spacer color and adjust its opacity
Use it to fine-tune layout and visual balance between sections.

Recent posts
Show other recent blog posts below the blog.

Related posts
Show similar blog posts that have same tags or in same categories in your blog.
Select blog posts in the list and show them in carousel display. We recommend showing 3 related blog posts for the best result.

Table of content
Table of content pulls form the H2, H3 and other heading tags (h4, H5, etc.) in your blog.
By adding a table of content to your blogs, it helps readers to navigate long-form content and boost SEO performance.
You can also edit the title of table of content.

Text & image
Text & image is a section in blog with layout including both text, images and button.
You can set up layout and content in this element.

Text & text
This helps you make an layout including 2 columns of text in blog.

Text & product
This helps you make an layout including 2 columns: product and text
You can select product from your list and customize content.

Image gallery
The image gallery element lets you showcase multiple images in an attractive layout.

Button
Insert button in your blog to keep customer engaged with your content.

FAQs
This helps you add questions and answers in an expandable box.

You can manage questions by adding more or deleting in the right panel.
Testimonials
This helps add customer's reviews about products or services to you blog posts.

In each testimonial, you can customize:
Content of review
Reviewer's image, name, title and URL (profile, website, etc.)
Review star
Custom HTML
This allow users to add custom code (HTML) into blog posts.
Decoration
This helps user to create template using AI.
⚠️ Tip: The more specific and well-formatted your guidance, the better the result.
✅ Use bullet points for clarity (e.g., colors, materials, lighting style).
TikTok Embed
This help users embed TikTok videos into their blog posts.
Instagram Embed
This helps users embed Instagram posts or reels into their blog content.
Resuable Elements
Let’s see how easily you can reuse elements from other blog posts to save time and maintain consistent content.
Element default settings
Set default settings for an element so you don’t have to reconfigure it every time you create a new one.
AI feature image
AI Feature Image helps you create custom blog visuals that match your content — just describe what you want, and let AI generate it for you.
Checkout Button
Checkout Button lets customers purchase products directly from your blog post without visiting the product page — making the buying process faster and boosting conversion rates.
Coming soon
Social share
Author
Video
Icon
Last updated
Was this helpful?