Nearly every theme is different with the way it is built and styled. This may lead to a mismatch with the defaults of the Instant Brand page which causes the Brand page to look out of place on the desktop or mobile. Usually by being wider than the site format or aligned too far to the left.

To format the page inline with your Theme style is straight forward and requires little coding expertise.

  1. Login to your admin dashboard on your store via the <storename> link. Then under the Online Store option click on Themes
  2. Then click on the 'Actions' dropdown and select 'Edit Code'
  3. This will take you to the Theme editor 
  4. To replicate the look of your theme we need to copy the default page template. To see what this looks like - goto the Templates folder and click on 'Add a new Template'

  5. Choose 'page' and 'alternate' and then click on 'Create template'

  6. This will load a new template into your editor window called page.alternate.liquid. Select all the content and then copy (ctrl + c)

  7. In the left hand pane - still under the 'Templates' folder - click on the page.instant brand-page-v2.liquid template to open it.

  8. It will also load into the editor window and looks like the below

  9. Below the </div> on line 8. Paste the content you copied from the page.alternate.liquid

  10. Copy the code on line 6. '{% include 'instant-brand-page-content' %}' as shown above. Then replace the {{ page.content }} text with it.

  11. You can then delete all the old template content. Leaving you with a new brand page template that uses your existing theme format. Click 'Save' to complete the work.

  12. The final step will be to delete the 'page.alternate.liquid' file as you no longer need it.

As always, if the above is too complex please reach out to us by logging a ticket and we will do the work for you.