Adding Hypervisual to a collection page

As well as product and landing pages, you can add Hypervisual designs to a collection. First you'll need to have the Hypervisual embed code installed in your collection template.

You can ask us to do this for you, or if you're handy with HTML, follow the instructions at the bottom of the page.

To create designs for a collection, first open the collection in your Shopify admin (Products > Collections). Then click the Apps button at the top, and Edit Hypervisual Page.

Installing the embed code in your collections template

You're welcome to ask us to handle this, but if you prefer to do it yourself, follow these instructions:

  1. Open Online Store > Themes in your Shopify admin. Choose your main theme, then  •••  >  Edit HTML/CSS.
  2. Open templates/collection.liquid. If that file is nearly empty, with just a line like {% section 'collection-template' %} , you will need to open the referenced file, in this case sections/collection-template.liquid.
  3. You probably want to add the Hypervisual embed code between your collection description and the product listing. Make sure you don't put the embed code inside a liquid {% if %} block, or it may not show up on your live page.

    The embed code to paste in is:

    {% render 'hypervisual' %} 
Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.

Still need help? Contact Us Contact Us