--- title: Sizing widget customization description: customization of sizing widget --- [Skip to content](https://help.ifreturns.com/en/knowledge-center/sizing-widget-customization#main-content) English Show submenu for translations [Customer portal](https://help.ifreturns.com/tickets-view?hsLang=en) ![Logo Negativo-4.png\]](https://help.ifreturns.com/hs-fs/hubfs/Logo%20Negativo-4.png?height=40&name=Logo%20Negativo-4.png) Open main navigation Close main navigation - English Show submenu for translations - [Customer portal](https://help.ifreturns.com/tickets-view) - Go to ifreturns.com Go to ifreturns.com How can we help? - There are no suggestions because the search field is empty. 1. [Knowledge Center](https://help.ifreturns.com/en/knowledge-center?hsLang=en) 2. [Getting Started](https://help.ifreturns.com/en/knowledge-center/getting-started?hsLang=en) 3. [Customizations](https://help.ifreturns.com/en/knowledge-center/getting-started?hsLang=en#customizations) # Sizing widget customization ## This article explains how the sizing widget can be customized in 3 simple ways: ### **1) Remove the sizing bar** - If you only want to display the **text recommendation**, you can remove the bar. #### ✅ Recommended method (edit the code) - Find this section inside the `renderSizingBar` function: ``` container.innerHTML = `
...
...
`; ``` #### Replace it with: ``` container.innerHTML = `
i ${disclaimer}
`; ``` ✔ Result: only the message is shown ❌ The bar is completely removed --- #### Alternative (no code change) - Hide the bar using CSS: ``` .sizing-bar-wrapper { display: none;} ``` - If there is no `"display"` attribute just add it into the brackets and put the value "none" ✔ Easier ⚠️ The bar is still loaded (just hidden) --- ### **2) Change the styling of the text message** - The message is controlled by this class: ``` .sizing-disclaimer ``` #### Main styles you can change ``` .sizing-disclaimer { background: #f7f7f7; /* background color */ border-radius: 10px; /* rounded corners */ padding: 14px 18px; /* spacing */ font-size: 16px; /* text size */ color: #222; /* text color */} ``` --- #### Change only the text style ``` .sizing-disclaimer-text { font-size: 15px; font-weight: 500; color: #333; line-height: 1.5;} ``` --- #### Example: more compact message ``` .sizing-disclaimer { background: #efefef; border-radius: 6px; padding: 10px 14px; font-size: 14px;} ``` --- #### Optional: remove the icon ### Option A – remove from code Delete: ``` i ``` ### Option B – hide with CSS ``` .sizing-disclaimer-icon { display: none;} ``` --- ### **3) Change text & add translations** - All text is stored in: ``` window.sizingLabels = { ... } ``` --- #### Change existing text - Example: update English text ``` en: { small: 'Runs Small', normal: 'True to size', large: 'Runs Large', disclaimerSmall: 'Size Recommendation: This item is a small fit...', disclaimerNormal: 'Size Recommendation: This item is true to size...', disclaimerLarge: 'Size Recommendation: This item runs large...',} ``` #### You can edit any of these values: - `small`, `normal`, `large` → labels (used in the bar) - `disclaimerSmall`, `disclaimerNormal`, `disclaimerLarge` → main message --- #### Add a new language - Add a new block inside `window.sizingLabels`. #### Example: ``` ro: { small: 'Mic', normal: 'Mărime normală', large: 'Mare', disclaimerSmall: 'Recomandare: Produsul este mic. Alege o mărime mai mare.', disclaimerNormal: 'Recomandare: Produsul are mărime normală.', disclaimerLarge: 'Recomandare: Produsul este mare. Alege o mărime mai mică.',} ``` --- #### Language format - Use standard locale codes: - `en`, `es`, `fr`, `de`, `it` - `pt-BR`, `pt-PT` - `zh-CN`, `zh-TW` --- #### How language is selected - The widget automatically uses: ``` window.sizingLocale = "" ``` - And falls back like this: 1. Exact match (e.g. `pt-BR`) 2. Base language (e.g. `pt`) 3. English (`en`) --- ### Summary | What you want to do | Where to change | | --- | --- | | Remove the bar | `renderSizingBar()` HTML | | Change message styling | `.sizing-disclaimer` CSS | | Change/add translations | `window.sizingLabels` |   - [Inquiries or Incidents](https://help.ifreturns.com/en/knowledge-center/inquiries-or-incidents?hsLang=en) - [Getting Started](https://help.ifreturns.com/en/knowledge-center/getting-started?hsLang=en#main-content) - [Portal Overview](https://help.ifreturns.com/en/knowledge-center/getting-started?hsLang=en#portal-overview) - [Analytics](https://help.ifreturns.com/en/knowledge-center/getting-started?hsLang=en#analytics) - [In app configurations](https://help.ifreturns.com/en/knowledge-center/getting-started?hsLang=en#in-app-configurations) - [Return Portal Configurations](https://help.ifreturns.com/en/knowledge-center/getting-started?hsLang=en#return-portal-configurations) - [UX/UI Return Portal configurations](https://help.ifreturns.com/en/knowledge-center/getting-started?hsLang=en#ux-ui-return-portal-configurations) - [Build your refund policy](https://help.ifreturns.com/en/knowledge-center/getting-started?hsLang=en#build-your-refund-policy) - [Customizations](https://help.ifreturns.com/en/knowledge-center/getting-started?hsLang=en#customizations) - [Promotions Management](https://help.ifreturns.com/en/knowledge-center/getting-started?hsLang=en#promotions-management) - [Refund Processes](https://help.ifreturns.com/en/knowledge-center/refund-processes?hsLang=en#main-content) - [Overview](https://help.ifreturns.com/en/knowledge-center/refund-processes?hsLang=en#overview) - [Refunds Methods](https://help.ifreturns.com/en/knowledge-center/refund-processes?hsLang=en#refunds-methods) - [Other configurations](https://help.ifreturns.com/en/knowledge-center/refund-processes?hsLang=en#other-configurations) - [Returns Management](https://help.ifreturns.com/en/knowledge-center/returns-management?hsLang=en#main-content) - [Day to Day Operations](https://help.ifreturns.com/en/knowledge-center/returns-management?hsLang=en#day-to-day-operations) - [Return Methods](https://help.ifreturns.com/en/knowledge-center/returns-management?hsLang=en#return-methods) - [Return Reasons](https://help.ifreturns.com/en/knowledge-center/returns-management?hsLang=en#return-reasons) - [Return Policies](https://help.ifreturns.com/en/knowledge-center/returns-management?hsLang=en#return-policies) - [Rules Settings](https://help.ifreturns.com/en/knowledge-center/rules-settings?hsLang=en#main-content) - [General Information](https://help.ifreturns.com/en/knowledge-center/rules-settings?hsLang=en#general-information) - [Actions](https://help.ifreturns.com/en/knowledge-center/rules-settings?hsLang=en#actions) - [Conditions](https://help.ifreturns.com/en/knowledge-center/rules-settings?hsLang=en#conditions) - [Operators](https://help.ifreturns.com/en/knowledge-center/rules-settings?hsLang=en#operators) - [Most Common Rules](https://help.ifreturns.com/en/knowledge-center/rules-settings?hsLang=en#most-common-rules) - [Shipping Integrations](https://help.ifreturns.com/en/knowledge-center/shipping-integrations?hsLang=en#main-content) - [ShippyPro](https://help.ifreturns.com/en/knowledge-center/shipping-integrations?hsLang=en#shippypro) - [Invoices / Documents](https://help.ifreturns.com/en/knowledge-center/invoices-documents?hsLang=en) - [Releases Notes](https://help.ifreturns.com/en/knowledge-center/releases-notes?hsLang=en#main-content) - [Release Notes 1.1](https://help.ifreturns.com/en/knowledge-center/releases-notes?hsLang=en#release-notes-1-1) - [Release Notes 1.2](https://help.ifreturns.com/en/knowledge-center/releases-notes?hsLang=en#release-notes-1-2) - [Release Notes 1.3](https://help.ifreturns.com/en/knowledge-center/releases-notes?hsLang=en#release-notes-1-3) - [Release Notes 1.4](https://help.ifreturns.com/en/knowledge-center/releases-notes?hsLang=en#release-notes-1-4) - [Release Notes 2.0](https://help.ifreturns.com/en/knowledge-center/releases-notes?hsLang=en#release-notes-2-0) - [Release Notes 2.1](https://help.ifreturns.com/en/knowledge-center/releases-notes?hsLang=en#release-notes-2-1) - [Release Notes 2.2](https://help.ifreturns.com/en/knowledge-center/releases-notes?hsLang=en#release-notes-2-2) - [Release Notes 2.3](https://help.ifreturns.com/en/knowledge-center/releases-notes?hsLang=en#release-notes-2-3) - [Release Notes 3.0](https://help.ifreturns.com/en/knowledge-center/releases-notes?hsLang=en#release-notes-3-0) - [Release Notes 3.1](https://help.ifreturns.com/en/knowledge-center/releases-notes?hsLang=en#release-notes-3-1) - [Release Notes 3.2](https://help.ifreturns.com/en/knowledge-center/releases-notes?hsLang=en#release-notes-3-2) - [Release Notes 4.2](https://help.ifreturns.com/en/knowledge-center/releases-notes?hsLang=en#release-notes-4-2) - [Release Notes 5.0](https://help.ifreturns.com/en/knowledge-center/releases-notes?hsLang=en#release-notes-5-0) - [Frequently Asked Questions](https://help.ifreturns.com/en/knowledge-center/frequently-asked-questions?hsLang=en) [![Chill listening crop-3](https://help.ifreturns.com/hs-fs/hubfs/iF%20brand/brand-logo.png?width=33&height=24&name=brand-logo.png "Chill listening crop-3")](https://www.ifreturns.com/) Knowledge center iF returns Copyright © 2026, iF Returns