By following the instructions below, you can integrate the WeSupply Order Lookup, Order Details, and Returns experience into your Shopify store. Customers are kept on the same page without having to switch windows.
Step 1. Go to your Shopify dashboard > under Online Store > select Pages:
Step 2. Click Add page to create a new page:
Step 3. Add a Title for the new page (e.g. ''Find your order"):
Step 4. Click on Show HTML:
Step 5. Paste the relevant code snippet for embedding the WeSupply Order Page in an iframe on your Shopify store.
Copy the code snippet below and paste it into the HTML code editor. Please make sure you change the youraccountname with your WeSupply account name. If you log in to your WeSupply account, you'll be able to see your account name in the browser.
<iframe style="width: 100%; height: 777px; overflow: auto; min-height: 777px;
Step 6. Click Save.
Step 7. Click View Page to see what the page looks like.
Step 8. Verify if the page looks as expected after embedding it under your store.
You can place a few test orders on your Shopify store to get through the experience by searching orders, checking the delivery status, and even initiating returns.
You can always apply further adjustments to your WeSupply pages from your WeSupply dashboard outlined here: https://support.wesupplylabs.com/hc/en-us/articles/360037959612-How-To-Customize-Your-Tracking-Page-
Note: If the iframe doesn't display as expected, you could try to investigate the CSS styling that conflicts with the iframe by heading to your Shopify dashboard > Online Store > Themes > Actions > Edit code > Assets > base.css. To ensure that any additional changes are implemented properly, we suggest looking into it with a developer.