How do I place the bar visually in theme customization? (CTB)

If you wish to place the Countdown Timer Bar somewhere other than the top or bottom of the page, you can use the Manual Placement option.

From here you have two options. You can place the code  <div id="ctb_placeholder"></div>  in your theme code. Something like this:

That definitely works, but there can sometimes be some unexpected results with some themes. Also, some themes don't have a body section that can be easily edited, and instead you'll see something like this:

With nowhere to place your placeholder code. 

So another option is to create a section for the CTB, and then place it visually in your theme. 

That's what I'll walk you through.

First, you'll need to get into the code editing space. For that click on: 
1 ) Online Store
2) Themes
3) Then click Actions drop down(on the right side of the page) and click 'Edit Code'
​​

Next you'll open the folder for Sections:

Then click on Add new section:

Enter the name ctb and click Create section:

Now, on the right side of the screen, you'll have a new section with some initial code:

Delete that code and paste in this:

<div class="ctb-section">
<div>{{ section.settings.ctb_section_body }}</div>
</div>

<section>
<div id="ctb_placeholder"></div> 
</section>
{% schema %}

{
"name": "CTB",
"limit":1,
"presets": [
{
"name": "CTB",
"category": "Custom"
}
]
}
{% endschema %}

Then click save:

Now you can click on Customize theme:

And on the left, you can click on Add section:

Among the options will be CTB:

Click on it to add it to your page. It will then be at the bottom of the sections. But you may not yet see it in your page. 

Click in the top right corner to make the bar visible.

Now you can use the dotted tab to move the bar around in the layout:

And you should be able to see the bar that has been prepared in the app configuration rendered into the preview window:

If you click on the section, you'll see that there are no customizable settings. All the settings are still set in the app. But this allows you to place the bar in your theme more easily.

Please note that if you are not using a Shopify 2.0 theme, you might not be able to add a section to certain pages.