Product Scale Feature

This block display a graphic scale with an optional heading and description, use this section to show measurements like sheerness or fit scale.

Set up block

1. Select the product Template to edit from the dropdown menu in the top bar Products > Default product.
2. Click on Scale block to open the block settings.
   • If the Scale block doesn’t exist, in the side panel, under the Product content section click (+) Add block and select Scale block.
3. Change the order of your blocks by using the drag and drop handles ⋮⋮
4. Add Heading text to add a title to the block, as default you will see Scale Title as a title, you can also leave this field empty if you want to remove it.
5. Add Text to show a short description to add further information about the measurement, leave this field empty to remove the description.
6. Add Scale value to position the graph meter, please add a number from 0 to 100.
7. Frame provides 4 steps, as default the scale will have 2 steps, add the Scale step label text to a new step in case you want to add more or remove the Scale step label to remove the step.
8. Click Save.

Note: Leaving Scale value option field empty will remove completely the whole block.

Dynamic source

Creating Metafields is the way how you can add dynamic content to your sections and blocks. To learn more information about Metafields please visit Shopify's guide Metafields. In the next steps, we will show you how to add Metafields and connect dynamic sources on the Scale block.

Create Scale value Metafield

Create a Number Metafield to add a measurement to the Scale value.

1. Click the Dynamic source button next to the Scale value option in the Scale block settings.
2. Click the (+) Create Metafield button.
3. Click on the Products tab. In this case, we want to add dynamic content on the product page that's why we select the Products tab.
4. Click the Add definition button in the top-right.
5. Add the name of the Metafield, this name should describe the purpose of the Metafield. For example "Sheerness value", we recommend adding a name that makes it easy to identify later.
6. Click the (+) Select content type button and under the Number tab select Integer. 
7. Click Save.

Add content to product Metafields

After create your Metafield you can add your content.

1. Go to Products on your Shopify admin and select one of your products.
2. Scroll down to the Metafields section and add your content in the Metafields that you created, for example, add content in the Sheerness value Metafield that you created in the previous steps.
3. Repeat steps 1 - 2 to add the different content to the Metafields for your products. Shopify offers the feature to edit Metafields in bulk to learn more please visit Editing product Metafields in bulk.
4. Click Save.

Insert Metafields as dynamic sources

Once you create the Metafield and add your content, you can add this as a dynamic source in the Frame theme, In your theme editor (Customize):

1. Go to the Scale block settings.
2. Click the Dynamic source button next to the Scale value field.
3. Select the Metafield that you created and added content to.
4. Click Save.
5. Now you can see the dynamic content you added to the different products.

Note: The previous steps are an example that shows how to add dynamic content for the Scale value field. You can add dynamic content to the other setting fields by following the same steps above. Please note the metafield content type and name varies depending the field content, For example if the field content is text like a title you will need to create a Metafield with content type: Text > Single line text .

These are the recommended content type for every setting field in the  Scale block:

Note: Any change applied to this bock will appear on all pages that use the same template.