Setup guide
Add the cube to a Shopify storefront
3dnavigate is installed as a Shopify theme app block. Merchants control placement and product groups in the Shopify theme editor.
Step 1
Choose the Home page template
Open Shopify theme editor and use the page selector at the top to choose Home page. Start there because it is the simplest place to verify the cube before adding it to other pages.
- In Shopify admin, go to Online Store.
- Choose the active theme and click Customize.
- Use the top page selector to choose Home page.
- Do not add the cube inside Header or Footer unless you want it to appear globally.
Step 2
Add the app block
Add the cube under the page Template area so it belongs to that page layout. Place it above the featured collection if you want the cube to be the first shopping experience visitors see.
- In the left sidebar, find the Template area.
- Click Add section under Template.
- Choose Apps, then select 3dnavigate Cube.
- Drag the cube above or below existing homepage sections.
- Avoid Header > Apps and Footer > Apps for the first setup.
Step 3
Choose collections for cube faces
Use selected Shopify collections for the cube faces. Each selected collection appears on one cube face, in order: front, right, back, left, top, bottom.
- Set Cube products to Use selected collections.
- Choose up to six featured collections.
- Use collection label overrides only when the shopper-facing label should differ from the Shopify collection name.
- If a collection has fewer products than the selected layout needs, empty tiles use the collection label tile style.
- For stores with many products, use automated Shopify collections based on tags, product type, vendor, or other rules.
Step 4
Choose the face layout
Pick how many tiles appear on each cube face. Larger tiles are better for visual products; denser layouts show more products at once.
- Use 2 x 2 for larger product imagery.
- Use 3 x 3 for a balanced collection showcase.
- Use 4 x 4 to show more products per face.
- Adjust frame color, label tile color, opacity, font, and image fit to match the theme.
Step 5
Save and test
Preview the storefront and confirm the cube supports product discovery while sending shoppers to the full Shopify product page for purchase decisions.
- Click Save in the theme editor.
- Hard refresh the storefront preview.
- Rotate the cube and use More or Back on the label tile when a collection has multiple pages.
- Search for a product and use Show results on cube.
- Click a product tile and confirm the inline details open below the cube.
- Click View product and confirm the Shopify product page opens with the selected variant when available.
- Open the cart page to confirm the cube is not accidentally placed above cart content.
After the home page
Once the homepage cube is working, merchants can add separate cube sections to collection pages, campaign pages, product pages, or custom landing pages. Each cube has its own collections, face layout, colors, and labels.
Need help? Email support@vrrrt.app.