List detailed product specifications in a tabular layout with alternating rows for easy scanning. Ideal for tech products, appliances, and items where precise measurements and technical details matter.
🧰 How to install the section in your theme
- Open Theme Updater & Backups in your Apps admin
- Open Theme sections
- Click Install below the section. You can also click Preview to see the section in a demo storefront
Â
- On the right side of the page, use the Choose theme dropdown to select the theme you want to enhance with the new section
- Click Install
Add the section to a template
Click Edit theme to open the theme editor for the selected theme.
Open the template (e.g. home page, default product) and click (+) Add section in the sidebar.
Customize section settings
Click the 🧰 Specification table section to open its setting and customize it with options for its heading, content, table appearance, mobile layout, and colors.
Â
Enter and format a Section heading, then adjust Heading size and Mobile heading size to set its size across desktop and mobile devices. Add optional supporting content with the Intro text field.
The Content width setting determines the overall width of the section on desktop.
Table style
Choose a Label column width of Narrow, Even, or Wide to control how much horizontal space is given to specification labels on desktop.
Adjust Group heading size to change the size of headings used to organize related specifications.
Enable Striped rows to alternate row background colors, making individual specifications easier to distinguish. Row dividers add lines between rows for additional visual separation.
Mobile layout
Choose how specification labels and their corresponding information appear on smaller screens.Â
Stacked places the content vertically, while Side by side displays the label and information next to each other.
Color
Customize the table's appearance with Label color, Text color, and Background color.
When striped rows are enabled, Stripe color determines the alternating row color. Divider color sets the color of the lines displayed when row dividers are enabled.
Adjust spacing
Use the Top padding and Bottom padding sliders to increase or decrease the padding of the section.
Use the Top margin and Bottom margin sliders to increase or decrease the margins of the section.
Customize blocks
Add blocks under the section by clicking (+) Add block
Blocks can be added, removed, and reordered to organize the information as needed.
Group heading
Add a Group heading to separate related specifications into clearly defined groups, such as Dimensions, Materials, or Product details.
Place the relevant Specification blocks below each group heading to keep related information together.
Specification
Specification block is used for each piece of information displayed in the table. Each specification pairs a label with its corresponding value or detail.
Add multiple Specification blocks to include as many product details as needed.
Changelog
February 24, 2025
- Specification table added to Theme Sections. Â
- Ability to change section heading, desktop and mobile heading size, content width, table style, alternating row color, border color, text color, background color, top and bottom padding, top and bottom margins. Blocks included: Group heading, Specification"
Â