IRP Shopper
Common Tasks (1)
Open
Interventions (1)
Open
Languages (1)
Open
Questions & Answers (1)
Open
Reviews (1)
Open
Site Scripts (1)
Open
Web Services (1)
Open
Training Videos
Peer Support

Size Charts

You can find this section under Products > Size Charts in the IRP Admin left navigation menu.

You use this section to add and edit size charts and preview how they look on the front end of your desktop and mobile sites. Size charts can span multiple categories and are fully translatable. You can also add specific SEO values to size charts and, if you have JavaScript skills, you can write custom JavaScript for individual charts (for example you might want colours to change, columns to expand, elements to animate and so forth).

Size charts display manufacturers’ sizing for certain products, most notably clothing. You can create size charts using HTML in the IRP Admin, as in the following example:

Chest size - inches Galvin Green Size European Size UK Size
36 XS 46 XS
38 S 48 S
40 M 50 M
42 L 52 L
44 XL 54 XL
46 XXL 56 XXL
48 3XL 58 3XL
50 4XL 60 4XL

You create size charts at a brand and category level. Charts will be displayed on the website below the model description on the Model page:

IRP Admin image

Note: Size charts will be displayed on the Models page on the front end of your website only if you have enabled the Show Size Chart On Models Page Application Setting.

SizeCharts.aspx page

The SizeCharts.aspx page appears as follows:

IRP Admin image

You can use the Brand and Category drop-down filters at the top of the page to locate a Size Chart configured for a specific Brand and Category combination. You can also filter the results according to the Active or Inactive status of the Size Charts. Click the Search button to carry out the search and the results will be displayed in the grid below.

You can see the following details in the grid:

  • ID: The unique ID of the Size Chart. This is added automatically by the IRP.
  • Active: Only active Size Charts will be visible on the front end.
  • Brand: The Brand associated with the Size Chart.
  • Category Group: The Category Group that this size chart is for.
  • Categories: The Category or Categories that have been associated with the Category Group.
  • Notes: Any Admin notes entered by Admin Users will be shown here.
  • Edit: Click this button to make changes to existing Size Charts. For more details see the How To Add or Edit a Size Chart article later in this section.

You can also use the desktop and mobile icon buttons to see what a Size Chart will look like on the front end.

How To Guides (1)

Close
Close
How To Add or Edit a Size Chart

To add or edit a size chart, follow these steps:

  1. Go to Products > Size Charts in the IRP Admin left navigation menu.
  2. To add a new size chart, click the Add New Size Chart button.
  3. To edit an existing size chart, click the Edit button beside the size chart that you want to edit.
  4. Fill in the required details for the chart on each of the tabs:

    Edit Details tab:
    SettingDescription
    Size Chart Details
    Size Chart ID This is the unique IRP identifier for the size chart. This is added automatically.
    Active Active size charts will be visible on the website front end while inactive size charts will not.
    Brand Specify whether this size chart corresponds to a specific brand.
    Category Group Select the Category Group that this size chart is for. This is where you can configure a size chart to be applicable to several categories. Use the Add or Edit buttons to add or update the Category Group details. Clicking either of these buttons opens the SizeChartCategoryGroupEdit.aspx window:
    IRP Admin image
    Enter an Admin Name and a Group Name (use the Translate function if appropriate) and click the Add or Remove buttons to move Categories between the 'Available' and 'Selected' boxes. Hold the Ctrl or Shift keys to select multiple categories. Click the Insert Group or Update Group buttons when you are finished.
    Notes Add any Admin notes for the size chart. Click the Translate button to change the language you are editing.

    Edit Page Content tab:
    SettingDescription
    Page Content
    Content This is where you design how the size chart will appear on the front end to your customers. Use the HTML Editor or write directly in HTML to create the content of this size chart. You can also click the Upload Files button to include content that you have saved on your computer.
    JavaScript IMPORTANT: You should use this functionality only if you are confident creating and testing JavaScript. If in any doubt, ask your Account Manager for advice. You use this section to add scripts that will change aspects of the size chart, for example you might want colours to change, columns to expand, elements to animate and so forth. Include the script tags as they will not be added automatically. You can also use the language drop-down list to change the language you are editing.

    Edit Page Settings tab:
    SettingDescription
    General Settings
    URL Text Enter the text to be used in the URL for this size chart.
    Desktop SEO
    SEO Title Enter the SEO Title for the desktop listing page. Click the 'Translate' button to change the language.
    SEO Description Enter the SEO Description for the desktop listing page. Click the 'Translate' button to change the language.
    SEO Keywords Enter the SEO Keywords for the desktop listing page. Click the 'Translate' button to change the language.
    Mobile SEO
    SEO Title Enter the SEO Title for the mobile listing page. Click the 'Translate' button to change the language.
    SEO Description Enter the SEO Description for the mobile listing page. Click the 'Translate' button to change the language.
    SEO Keywords Enter the SEO Keywords for the mobile listing page. Click the 'Translate' button to change the language.
  5. When you have entered or edited all of the required details, click the Insert Size Chart button or the Update Size Chart button. The configuration will appear in the grid on the SizeCharts.aspx page.
  6. If you want, you can check how the size chart will look on the front end by locating the size chart in the grid on the SizeCharts.aspx page and clicking the desktop or mobile icons. If you are ready for the size chart to be displayed, make sure that you have enabled the Show Size Chart On Models Page Application Setting (in the 'Models Page' grouping).
  7. If you want to remove a size chart, click the Edit button for the relevant size chart and then click the Delete Size Chart button.

FAQs (2)

Close
Is there a way to draw tables within the size chart options?
Not using the rich text editor unfortunately, however you could use basic text, employ HTML knowledge to create a table, include an image from a manufacturer or get a designer to design a table.
When I switch to the Size Chart tab from the Description tab then back again, why does the Description tab not show the description?
It could be that you have copied and pasted the description for the product from the source code of another product. If so, the system-rendered HTML might reference CSS classes that are causing the issue, for example a class might be controlling show/hide settings. When you have corrected the HTML, the Description tab should function as expected.

Copyright © 2020 IRP Commerce. Use of this website constitutes acceptance of the IRP World Terms of Use, IRP Privacy Policy and IRP Cookie Policy

IRP Commerce Limited, Concourse 3, Catalyst, BT3 9DT, UK. Company Number: NI 041856. VAT Number: GB 888249658
A Deloitte Fast 50 Company seven times: 2010, 2011, 2012, 2013, 2014, 2018 & 2019