Basic elements
10 essential content blocks available for free on all plans
Basic elements are the foundation of every blog post. They are free for all users on every plan (Free, Basic, Pro, and Advanced) - no upgrade required. These 10 elements cover the most common content needs: text, headings, images, videos, lists, tables, and layout spacing. Whether you are writing your first post or your hundredth, these are the building blocks you will use in every article.

Heading
Add headings to structure your blog post into clear sections. Supports heading levels H2 through H6.

How to use:
Add a Heading element or type
/headingType your heading texee
Select the heading level (H2-H6) from the toolbar
Formatting options: Bold, Italic, Underline
Use H2 for main sections
Skip levels (H2 -> H4)
Use H3 for subsections under H2
Use H1 (reserved for page title)
Include keywords naturally
Stuff keywords into every heading
Keep headings concise (5-10 words)
Write full sentences as headings
SEO Tip: Your most important keywords should appear in H2 headings. Google gives more weight to higher-level headings. The Table of Contents element automatically generates navigation from your headings.
Paragraph
The standard text block for writing content. Every blog post is built primarily from paragraph elements.

How to use:
Add a Paragraph element or simply start typing in the editor
Write your content
Format text using the toolbar: Bold, Italic, Underline, Hyperlinks

Best practices:
Keep paragraphs 3-5 sentences - walls of text scare readers away
Use short sentences for mobile readability (60% of blog traffic is mobile)
Include internal links to product pages naturally within your content
Front-load important information - readers scan, they don't read every word
List
Create ordered (numbered) or unordered (bulleted) lists to organize information in an easy-to-scan format.

How to use:
Add a List element or type
/listChoose Bulleted (unordered) or Numbered (ordered)
Type each item, press Enter for the next
Bulleted
Features, benefits, tips, ingredients
Numbered
Steps, rankings, instructions, tutorials
Best practices:
Use lists for 3+ items
Keep items parallel in structure (all start with verbs, or all are nouns)
Google frequently pulls list content into featured snippets (position zero)
Table
Insert data tables with customizable rows and columns. Add or remove rows/columns above, below, left, or right of any selected cell.



How to use:
Add a Table element or type
/tableSet the number of rows and columns
Click any cell to type content
Use the toolbar to add/remove rows and columns
Use case examples:
Size chart
XS/S/M/L/XL with measurements
Product comparison
Feature vs feature across 3 products
Pricing table
Plan features side by side
Shipping rates
Region x delivery speed x cost
Best practices:
Keep tables under 6 columns for mobile readability
Use the first row as headers
Google can extract table data for featured snippets, especially for comparison queries
Divider
A horizontal line that visually separates sections of your blog post. The divider's appearance adapts to your Shopify theme styling.

How to use:
Add a Divider element or type
/dividerThe divider appears automatically - no configuration needed
Best practices:
Use dividers sparingly - too many makes the post look fragmented
Pair with headings for major sections; use dividers alone for minor breaks
Works well before product recommendation sections or CTA banners
Quote
Add a styled blockquote to highlight important text, cite a source, or feature a customer testimonial.

How to use:
Add a Quote element or type
/quoteType the quote text
(Optional) Add author name and title
Customize styling via the settings panel
Customization options:
Layout & alignment (left, center, right)
Background color, text color, quote symbol color
Author name and title/role fields
Use case examples:
Customer testimonial
"This serum changed my skin in 2 weeks" - Sarah M., verified buyer
Expert opinion
"Organic cotton is the future of sustainable fashion" - Dr. Jane Lee
Data highlight
"73% of consumers prefer brands with sustainable packaging"
Best practices:
Always attribute quotes to a real person or source
Limit to 1-2 quotes per post to maintain impact
Image
Add images to your blog post. Upload from your computer, select from the media library, or paste an image URL. Images are stored in your Shopify Files section.

How to use:
Add an Image element or type
/imageChoose your source: Upload, Media Library, or URL
Configure image settings
Configuration options:
Alt text - Describe the image for SEO and accessibility
Aspect ratio - Control image proportions
Alignment - Left, center, right
Caption - Add descriptive text below the image
Image link - Make the image clickable (link to product, collection, etc.)

Best practices:
Always add alt text - Google uses it for image search ranking, and it's essential for accessibility
Write alt text that describes the content: "Woman wearing red summer dress on beach" not "image1.jpg"
Use high-quality images but keep file size under 500KB for page speed
Add image links to product photos - turn every image into a sales opportunity
SEO Tip: Include your target keyword naturally in alt text when relevant. "Organic cotton baby blanket in mint green" is better than "baby blanket".
Video
Embed videos in your blog post. Upload from your device, select from the media library, or paste a YouTube/Vimeo URL.

How to use:
Add a Video element or type
/videoChoose your source: Upload, Media Library, or URL (YouTube/Vimeo)
The video embeds with a player in your post
Supported platforms: YouTube, Vimeo
Best practices:
YouTube is preferred for SEO - Google owns YouTube and gives its videos search priority
Keep product demo videos under 2 minutes
Add a text summary below the video for readers who prefer reading (and for SEO - Google can't index video content directly)
Video increases average time on page by 88%
Text & Text
A two-column layout with text on both sides. Each column is independently editable with full paragraph formatting.

How to use:
Add a Text & Text element or type
/text & textClick on the left column to type content
Click on the right column to type content
Format each column independently
Use case examples:
Product benefits
Product specifications
Customer problem
Your solution
Free plan features
Pro plan features
Best practices:
Use for genuinely parallel content - don't force unrelated text into columns
Keep column content similar in length for visual balance
On mobile devices, columns stack vertically - make sure each column makes sense on its own
Spacer
Add adjustable vertical spacing between elements. Control the height and background color with opacity.

How to use:
Add a Spacer element or type
/spacerAdjust the height using the settings
(Optional) Set a background color with opacity
Configuration:
Height - Pixel value for vertical space
Background color - Optional colored space
Opacity - Control transparency of the background
Best practices:
Use 20-40px for minor gaps, 60-100px for major section breaks
Transparent spacers are most common - colored spacers work for visual emphasis
Don't overuse - too much white space makes the post feel empty
Consider Spacer v2 (New Elements) for more height options
Last updated
Was this helpful?