.png){kind=icon}
How to place 2 bars at the top (QAB)
Our bar apps are designed for easy placement without technical knowledge. One drawback to that, however, is that only one bar can be placed at the top at a time. The recommendation is to place one at the top and one at the bottom.
That said, the app does have the option of manual placement.
The Manual Placement feature, and the associated insertion code, are provided to make it possible for merchants and their developers to implement their own customizations. It is recommended to hire a developer for any theme customizations, and to implement any edits on a duplicated copy of your theme. Please note, we do not offer any customization services.
Every theme is a little different, so your mileage may vary, but you can try placing the manual placement code into a theme file.
First, select the Manual Placement option and copy the code snippet.
First, you'll need to get into the code editing space. For that click on:
1 ) Online Store
2) Themes
3) Then click the ellipses drop down(on the right side of the page)
4) Click 'Edit Code'
Next, inside the Layout folder, click on theme.liquid
Then place the code snippets that you copied above the header section in the theme.liquid file. Make sure it's after the <body> tag.
In my test theme, my result was:
Alternatively, the code can sometimes be placed in the header.liquid file. The header.liquid file can be found in the Sections folder. In this theme, I placed the placeholder code after the {% - endstyle -%} tags but before any <div> tags. The final results were similar to the previous option.
As previously mentioned, this may not work perfectly in all themes. But we wanted to share this tool in the event that it helps.