How-to: Setup Custom Placement for Countdown Timer and Announcement Bar in Non-Online Store 2.0 Themes
If you're using a Shopify theme that isn't compatible with Online Store 2.0 and wish to set up custom placement for the Countdown Timer and Announcement Bar, this guide is for you:
1. Understanding Your Theme's Limitations:
- Non-Online Store 2.0 compatible themes do not support adding the Countdown Timer and Announcement Bar as freely movable app blocks within the Shopify Theme editor.
2. Default Automatic Placement:
- By default, in such themes, the Countdown Timer will appear automatically below the 'Add to Cart' button, and the Announcement Bar will be placed either at the top or bottom of the page.
3. Opting for Custom Placement:
- For custom placement, you will need to manually insert HTML snippets on your product page where you want these features to appear.
4. HTML Snippets for Custom Placement:
- Countdown Timer: Insert <div id="ct_pe_disco_holder"></div>
at your desired location on the product page.
- Announcement Bar: Place <div id="pe-announcement-bar-holder"></div>
where you want the announcement bar to show.
5. Step-by-Step Guide for Custom Placement:
- Step 1: Go to the product page template in your Shopify admin.
- Step 2: Decide where you want the Countdown Timer and Announcement Bar to appear.
- Step 3: Insert the respective HTML snippets in those locations.
- Step 4: Save your changes and preview the product page to ensure everything is displayed as expected.
Remember, while custom placement offers more control over where these elements appear, it requires a bit of familiarity with HTML and the Shopify platform. If you need any assistance, feel free to reach out for help!