Display your Event

To display your event on your storefront, you can choose between using a Shopify product page or a Modal. If you prefer to keep your existing product page as it is, you can opt for a modal that opens up when a customer clicks a button.

Shopify product page

Product page example.

1. Go to the Online Store tab and select Themes. From there, click the Customize button.
2. In the top-center menu, select the Products option.
3. Click the Create template button and give your new template a name such as "CoAttend Product Page". Finally, click the Create template modal button to complete the process.

Create a new template.

4. Go to your Shopify admin product page and locate the Theme template setting.
5. Select the "coattend-product-page" template from the available options.
6. Click the Save button to apply the new template to your product page.

Change your product template.

7. Go to the Online Store > Themes and click the Customize button.
8. Go to your product page and hide the current template sections.
9. Select the Add section button and choose CoAttend event from the Apps section.
10. Modify the section's styles as desired and click Save to apply the changes.

CoAttend event page.

11. To further personalize the event's settings, access CoAttend, then Events, and select the event page.

Congratulations! Your event is now ready to be launched.

Your store might be using a Shopify Vintage Theme. In this case please follow the instructions below:

1. Before proceeding, ensure that the templates/product.coattend.liquid file is present in your theme. If you cannot locate the file in your theme, please refer to the instructions provided on this page.
2. In your Shopify admin, navigate to Apps > CoAttend > Settings > Storefront and confirm that CoAttend is Enabled.
3. Navigate to Events and select your event.
4. Change the Status to Active and select Show as a product page.
5. Click Save.

Congratulations, your event is ready!

Modal

If you prefer to maintain the existing layout of your Storefront's product page, you can choose to display your event in a modal that pops up when a customer clicks a button.

Modal example.

1. Go to the Online Store tab and select Themes. From there, click the Customize button.
2. In the top-center menu, select the Products option.
3. Click the Create template button and give your new template a name such as "CoAttend Modal Page". Finally, click the Create template button to complete the process.

Create a new template for modal.

4. Go to your Shopify admin product page and locate the Theme template setting.
5. Select the "coattend-modal-page" template from the available options.
6. Click the Save button to apply the new template to your product page.

Change your product template.

7. Go to the Online Store > Themes and click the Customize button.
8. Go to your product page and hide the Quantity selector and Buy buttons blocks.
9. Select the Add block button and choose CoAttend event button from the Apps section.
10. Move the button to the desired location, edit the button's label and options and click Save to apply the changes.

CoAttend event modal button

11. To further personalize the event's settings, access CoAttend, then Events, and select the event page.

Congratulations! Your event is now ready to be launched.

Your store might be using a Shopify Vintage Theme. In this case please follow the steps below:

1. Follow the Modal installation instructions.
2. In your Shopify admin, navigate to Apps > CoAttend > Settings > Storefront and confirm that CoAttend is Enabled.
3. Navigate to Events and select your event.
4. Change the Status to Active and select Show as a modal.
5. Click Save and View on Store.
6. Click the Add to cart button. The Modal should pop-up now.

Congratulations, your event is ready!