Header Filter Setup Guide: CM and Inches

To add unit switches in Table Master, set each measurement column to Header filter. Enter CM|IN in Filter options and put two matching values in each source cell, such as 92 cm|36.22 in. Shoppers can then switch that column between centimetres and inches. You must supply both values; the app does not calculate the conversion.

Setup tutorial · Table Master · Updated 2026-09-07 · By Activory

Try the storefront example

Select IN under Chest circumference. XS changes from 92 cm to 36.22 in. The other columns keep their own selections. Open page 2 or search XXL to check that the selected unit remains applied. On phones, scroll sideways to reach each column.

This example uses Table Master storefront code with sample data and the settings below. Your theme’s fonts and available width can change the result. Example links show their destination; purchase controls use a sample cart. Use the checks below to confirm the finished setup in your store.

Build it in Table Master

1. In Table Master, create a database from Google Sheets or a spreadsheet file. Put the headings below in the first row and one record on each following row. Import only public storefront data.
2. Create a table view from the database. Keep the size labels as String. Configure the measurement columns as Header filter with the options below.
3. Open Column type. Keep Size as String. Set Chest circumference, Body length, and Sleeve length to Header filter.
4. For each Header filter column, enter CM|IN in Filter options. Save the column settings. Put a matching CM value and IN value in each source cell, separated by |.
5. In Design, turn off Enable column sorting. This keeps XS-to-XXL order when a shopper clicks a unit button instead of sorting the text pairs.
6. In Design, disable Responsive table for this example. The app block provides horizontal scroll so that the unit buttons remain in their column headers on phones.
7. Use three rows per page in the example to test the selection after pagination. A short store size chart can show all six rows on one page.
8. Save and publish the table view. Open the target page template in the theme editor. Add the Table Master app block and choose the table view. Save the theme and test the public page.

Example settings

• The starting design is Ocean blue with 8 px padding, left-aligned text, and Medium (6 px) rounded corners. In Design, choose Ocean blue under Table colors → Design template. Set all four Cell padding values to 8. Under Table style, choose Left for Text alignment and Medium (6px) for Rounded corners. Try the other presets and corner sizes above; Reset example restores this starting design.
• The example uses a standard table with Responsive table disabled, three rows per page, and CM|IN header options on each measurement column. Scroll sideways on phones. The app applies each selection to that column and retains it after search or pagination.

Sample data and content

Use these values for a test. Replace them with checked product data, published destinations, and offers that your store can supply.

Does a header filter convert units or change which rows appear?

Each header button selects a position in the cell. CM selects the first value and IN selects the second. Keep that order in every row. Each column has its own selection, so a shopper can show chest in inches while length remains in centimetres. Include the unit in each value to keep mixed selections clear. Header buttons change the displayed values while the same size rows remain in the table.

1. Measure a garment from the relevant product range. Chest circumference is the full distance around the garment. Do not enter a flat half-chest measurement under this heading.
2. Prepare both unit values in your spreadsheet before import. Divide centimetres by 2.54 for inches. These sample inch values are rounded to two decimal places; keep your chosen precision consistent.
3. Join each pair in one cell with a pipe character: centimetres first, then inches. For the M chest cell, enter 104 cm|40.94 in. A missing second value leaves no useful content for the IN button.
4. Use short Filter options labels. The current app limit is 25 characters for the complete option string. CM|IN uses five characters. The first label is the initial display choice.
5. Keep size rows in the intended XS-to-XXL order. Header filter values are text pairs; changing the displayed unit does not create a numeric sort or convert the stored data.

Read the Table Master setup guide for the full app controls and placement options.

Check the finished setup

• Select IN under Chest circumference. XS must show 36.22 in, while Body length still shows 64 cm. Switch the other columns separately.
• With chest set to IN, open the second page. L must show 43.31 in. Search XXL and confirm 48.03 in remains selected after the table redraws.
• Clear Search, return to the first page, and select CM. The XS chest must return to 92 cm. Reset example restores the initial selections.
• At phone width, scroll the table sideways and test every header button. Keep the buttons and selected values visible together.
• Before publishing, check every pair against measured garment data. Confirm that the number and order of pipe-separated values match the header options.

Common mistakes

• Do not enter 104 cm alone and expect Table Master to calculate inches. Both values must be present in the source cell.
• Do not reverse the labels to IN|CM without reversing every value pair. The app matches positions, not unit names.
• Do not describe Header filter as a way to remove non-matching rows. Use Smart filters when shoppers need to narrow a product list.

Supported use

These examples contain reference data. They do not create Shopify products, stock, prices, shipping rules, or cart controls. Use the Shopify product import workflow when you need product and variant cart controls. Spreadsheet data changes when you import or sync it. Check the source before you use it as an inventory reference.

Table Master features, current app plans, and Table Master data sources explain the supported setup.

Related tutorials

• Garment Size Chart Setup Guide
• Product Comparison Setup Guide
• Parts Fitment Table Setup Guide

Browse all Table Master tutorials. Read how the examples are made or report a correction.