JLMG Themes

Paragon documentation

Sections reference

Every section you can add in the theme editor, what it's for, and the settings it has. Names match the theme editor exactly. Add a section from Add section in the editor sidebar.

34 sections. Click a section to see its settings and blocks. Looking for the product or collection page? See Product pages and Collection pages in the main guide.

Header and announcements

Mega menu1 block type

The site header: logo, menu, search, account, wishlist and cart icons, with an optional sticky header. Any menu item with child links gets a dropdown. Add a Mega column block and set its Parent link to a top-level menu item's exact title to give that item a full-width panel with featured products from a collection and a promo image.

Settings

  • Menu

Logo

  • Logo image
  • Logo width

Colors

  • Background color
  • Text color

Icons

  • Show search icon
  • Show account icon
  • Show wishlist icon

Behavior

  • Enable sticky header

Block: Mega column

  • Parent menu title

Featured collection

  • Column heading
  • Collection
  • Products to show

Promotional image

  • Image
  • Heading
  • Text
  • Link
Announcement bar1 block type

Up to five short messages above the header, each with its own link and colors. Messages rotate on a timer, and shoppers can dismiss the bar.

Settings

  • Rotation speed
  • Show dismiss button

Block: Message (up to 5)

  • Text
  • Link
  • Text color
  • Background color
Scrolling text1 block type

A band of short messages that scrolls across the page, such as shipping promises or brand values. Choose the speed, direction, separator, text size and colors.

Settings

  • Speed (seconds per loop)
  • Direction
  • Separator
  • Font size

Colors

  • Background color
  • Text color

Block: Text

  • Text

Heroes

Hero slideshow1 block type

Up to six slides, full width or boxed, each with its own image or video, heading, subheading and button. Autoplay, arrows and dots are built in, and autoplay can pause while shoppers hover.

Settings

  • Layout
  • Minimum height
  • Autoplay slides
  • Autoplay speed
  • Pause on hover
  • Accessibility label

Block: Slide (up to 6)

  • Background image
  • Video URL (optional)
  • Heading
  • Subheading
  • Button text
  • Button link
  • Text color
  • Overlay opacity
Video hero

A full-width background video with a heading and button. Add a fallback image for when the video can't play, and choose the overlay color and strength.

Settings

  • Video URL
  • Fallback image

Content

  • Heading
  • Subheading
  • Button text
  • Button link

Overlay

  • Overlay color
  • Overlay opacity

Appearance

  • Text color
  • Minimum height

Video options

  • Autoplay (muted)
  • Loop video
  • Show video controls
Split hero

A large image beside a heading, text and button, with your own background and text colors. Choose which side the image sits on.

Settings

  • Image
  • Image position
  • Heading
  • Subheading
  • Body text
  • Button text
  • Button link
  • Background color
  • Text color
  • Minimum height

Storytelling

Text with image

A photo beside a heading, a few paragraphs and a button. Good for materials, care or the story behind a product. Choose which side the image sits on.

Settings

  • Image
  • Image position
  • Subheading
  • Heading
  • Text
  • Button text
  • Button link

Colors

  • Background color
  • Text color
Rich text

A heading, a short paragraph and a button for announcements, values or an introduction. Choose the alignment, width and colors.

Settings

  • Subheading
  • Heading
  • Text
  • Text alignment
  • Text width
  • Button text
  • Button link

Colors

  • Background color
  • Text color
Brand timeline1 block type

Tell your story year by year. Add a milestone for each chapter with a year, a heading, a few lines and an optional photo. Milestones alternate sides as shoppers scroll.

Settings

  • Heading
  • Description
  • Subheading

Colors

  • Background color
  • Text color

Block: Milestone

  • Year
  • Heading
  • Text
  • Image
Multi-column1 block type

Two to four columns, each with an optional icon from the built-in set, a heading and a short line of text. Good for brand values or service promises.

Settings

  • Subheading
  • Heading
  • Description
  • Columns on desktop

Colors

  • Background color
  • Text color

Block: Column

  • Icon
  • Heading
  • Text

Shoppable images

Image hotspots1 block type

Place up to eight pins on a photo and link each one to a product. Tapping a pin shows the product's photo, name and price, with a link to its page. Pin positions are percentages from the top-left corner.

Settings

  • Image
  • Heading
  • Description
  • Subheading

Colors

  • Background color

Block: Hotspot (up to 8)

  • Product
  • Horizontal position
  • Vertical position
Before/after slider

Two photos share one frame. Shoppers drag the handle, or use the arrow keys, to compare them, and each side gets its own label.

Settings

  • Heading
  • Description
  • Subheading
  • Before image
  • After image
  • Before label
  • After label
Spotlight product

One product presented as a feature panel, with its photo, price, description and a button. Choose which side the image sits on and which details show.

Settings

  • Product
  • Heading
  • Subheading
  • Layout
  • Show vendor
  • Show price
  • Show description
  • Button text

Colors

  • Background color
  • Text color

Collections and merchandising

Collection tabs1 block type

Add a tab for each collection. Shoppers switch tabs to see its products in place, with a link to the full collection. Choose two to five columns and up to four rows.

Settings

  • Subheading
  • Heading
  • Description
  • Desktop columns
  • Rows
  • Show vendor
  • Show secondary image on hover
  • Show "View all" button

Block: Tab

  • Collection
  • Tab title
Multiple collections1 block type

Feature two to four collections side by side, each with its image, title and number of products.

Settings

  • Heading
  • Description
  • Subheading
  • Columns

Block: Collection

  • Collection
Promo grid1 block type

Tiles with an image, heading, short text and link, each in a small, medium or large size. Mix the sizes to build an editorial layout.

Settings

  • Heading
  • Description
  • Subheading

Block: Promotion

  • Image
  • Heading
  • Text
  • Link
  • Size
Product comparison1 block type

Pick up to four products and the table lines up their price, availability, type and options such as color and size. Vendor and SKU rows can be turned on too.

Settings

  • Heading
  • Description
  • Subheading
  • Show vendor
  • Show product type
  • Show SKU

Block: Product (up to 4)

  • Product
Collection header

An image banner for collection pages with the collection's title, description and product count. The image moves at a slower speed than the page as shoppers scroll (parallax). Uses the collection's own image from Shopify admin.

Settings

  • Show collection image
  • Show collection description
  • Minimum height
  • Overlay opacity
  • Text color

Product page

Product recommendations

Products Shopify recommends for the one being viewed. Add it to product templates. Recommendations improve as your store gets more orders.

Settings

  • Heading
  • Products to show
  • Columns
  • Show vendor
Recently viewed

Products the shopper looked at earlier, saved in their browser. Turn it on in Theme settings > Product features, then add the section to a template.

Settings

  • Heading
  • Products to show
  • Columns
Bought together1 block type

Pick up to three products to suggest alongside the one being viewed. Shoppers see a running total and add everything to the cart with one button.

Settings

  • Heading

Block: Product (up to 3)

  • Product
Product tabs

Description, shipping, size guide and reviews in tabs. Write the shipping and size guide text in the section and choose which tabs show. Turn on the reviews tab only if your reviews app fills it.

Settings

  • Heading

Description tab

  • Show description tab

Shipping tab

  • Show shipping tab
  • Shipping content

Size guide tab

  • Show size guide tab
  • Size guide content

Reviews tab

  • Show reviews tab
Sticky add to cart

A slim bar with the product photo, price, options and add to cart button that appears once shoppers scroll past the main buttons. Add it to product templates; it has no settings of its own.

Promotion and trust

Countdown timer

Set an end date and time and the timer counts down live. When it reaches zero, your own message takes its place. Add a button and choose the colors. See the FAQ for how time zones work.

Settings

  • Heading
  • Description
  • Subheading
  • End date (ISO format)
  • Expired message
  • Button text
  • Button link

Colors

  • Background color
  • Text color
Testimonials1 block type

Each review has a star rating, the reviewer's name and title, and an optional photo. Show them in a carousel or in a grid of two to four columns.

Settings

  • Heading
  • Description
  • Subheading
  • Layout
  • Columns (grid only)

Colors

  • Background color
  • Text color

Block: Testimonial

  • Author name
  • Testimonial text
  • Star rating
  • Author photo
  • Author title
Trust badges1 block type

Pick an icon for each badge and add a short heading and a line of text. Show the badges in a row or in a grid.

Settings

  • Subheading
  • Heading
  • Description
  • Layout

Colors

  • Background color
  • Text color

Block: Badge

  • Icon
  • Heading
  • Text
Logo list1 block type

Show partner, press or stockist logos in three to six columns, each with an optional link. Logos can stay gray until hovered.

Settings

  • Heading
  • Description
  • Subheading
  • Columns
  • Grayscale with color on hover

Colors

  • Background color

Block: Logo

  • Logo image
  • Link
  • Alt text
FAQ1 block type

Questions open and close with a tap. The section also adds FAQ markup that search engines can show in their results.

Settings

  • Heading
  • Description
  • Subheading

Colors

  • Background color
  • Text color

Block: Question

  • Question
  • Answer
Newsletter

An email signup form that adds shoppers to your customer list with email marketing consent. Turn on the exit popup to ask once more when a visitor is about to leave.

Settings

  • Heading
  • Text

Colors

  • Background color
  • Text color

Exit-intent popup

  • Show exit-intent popup
  • Popup heading
  • Popup text
  • Popup delay
Blog posts

Show two to eight posts from any blog, with optional images, dates, authors and excerpts, plus a link to the full blog.

Settings

  • Subheading
  • Heading
  • Description
  • Blog
  • Posts to show
  • Columns
  • Show featured image
  • Show date
  • Show author
  • Show excerpt
  • View all link

Colors

  • Background color
Contact form

A contact form for any page. Messages go to your store's contact email, set in Settings > Store details.

Settings

  • Heading
  • Text

Colors

  • Background color
  • Text color

Advanced

Custom Liquid

Add your own Liquid or HTML, for example an embed code. Code here isn't covered by theme support.

Settings

  • Custom Liquid