If your Instant Inventory widget or jewelry widget appears too small, gets cut off, or doesn’t load correctly on your website, the issue is often related to how your website’s code is handling the widget. This guide walks you through how to fix these issues on Wix, Shopify, and WordPress.

Widget Is Too Small on Wix or Shopify

When the widget is placed inside a small container on your site, it may appear too short or get cut off. To fix this, you need to manually set a height in the script code.

How to Fix on Wix

Copy the script from RapNet: Instant Inventory > Actions > Publish to My Website > Copy Script
In your Wix Editor: Site Action > Edit Site > Click your site name
Edit the HTML element where the script is added.
Add style="height:1200px" after width="100%" in the script.
Save and preview your site.

How to Fix on Shopify

Fix Height on Shopify

If you use the standard Shopify widget, you might get a small widget. That's because the web page is putting the widget in a small ‘container’.

Read on to learn how to fix the height and adjust the width

Copy your widget script from Instant Inventory.
In your Shopify admin: Pages > Edit Page > Show HTML (<> icon)
Add style="height:1200px" after width="100%" in the script.
Save the page and check your site.

Adjust Width on Shopify

Go to the website
Open the Inspect element > make sure you see styles
Hover over the code in the Elements Tab > you may need to expand the code
Expand the HTML code until you see what you are looking for
Select HTML code
1. When you hover over the code and check your site at the same time, the highlight shows the full container that holds the widget.
2. Go to the Styles tab and play with the CSS code in the styles block
3. In our case > container == narrow
Navigate to the themes.css file in Shopify
Find that particular CSS Value
Modify Value and click save
Check your Website
.

Widget Cut Off on WordPress (or Old Widget Versions)

If the diamond or jewelry inquiry form is not fully visible:

You may need a CSS override to extend the pop-up window height.
Add a custom style rule or increase the iframe height within your site’s code editor.

Jewelry Widget Not Integrating Into WordPress

If your jewelry widget isn't displaying on your WordPress site, it's likely because the widget code needs additional support to render correctly. Follow these steps to fix the issue by adding a custom script that dynamically loads the widget using your API key.

Steps to Fix the Jewelry Widget Display

Copy the Jewelry Widget Script
- Go to your RapNet Instant Inventory dashboard.
- Click Actions > Publish to My Website > Jewelry Widget.
- Copy the generated widget script.
Add the Script to Your WordPress Page
<script>
var func = function() {
var d = document.getElementById('jewelryinstantinventory');
var i = document.createElement('iframe');
var apiKey = d.getAttribute('data-apikey'); i.id = 'jewelryRapnetIframe';
i.name = 'jewelryRapnetIframe';
i.width = '100%';
i.height = '100%';
i.style = 'border:none;';
i.setAttribute('data-apikey', apiKey);
i.src = 'https://ii.api.prod.rapnet.com/api/Feeds/%APPKEY%/Widget#/'.replace('%APPKEY%', apiKey);
d.appendChild(i); i.onload = function() {
i.contentWindow.postMessage({ apiKey: apiKey }, '*');
};
};
func();
</script> (edited)

Example of the full new Jewelry Widget Script

This ensures compatibility and proper rendering, especially when the widget isn't loading due to how WordPress processes scripts.