Skip to product information
【Dawn】Shopifyのテーマ「Dawn」で告知バーをヘッダーと一緒に固定表示する設定例
  • 【Dawn】Shopifyのテーマ「Dawn」で告知バーをヘッダーと一緒に固定表示する設定例
[Dawn] Example of setting the announcement bar to be fixed together with the header in the Shopify theme "Dawn"
Published:2024.03.12

[Dawn] Example of setting the announcement bar to be fixed together with the header in the Shopify theme "Dawn"

用途

When you fix the header in the Shopify theme "Dawn", only the parts including the menu, logo, cart, etc. will be fixed. However, if possible, you may want the announcement bar to be always displayed as well. This is a simple setting method using JavaScript in the theme editor without directly editing the code.


Example of setting to display the announcement bar together with the header in the theme "Dawn"


[How to set it up] Add a custom Liquid section to the header in the theme editor and insert the code


[Additional Information] Supports multiple notification bars & any type of always-on display is OK


[Additional Note] If you change the execution timing of the javascript you write from `load` to `DOMContentLoaded`, the header will be fixed immediately after the screen is loaded, but be careful as a theme error will be displayed.


After making a purchase (all items are ¥0), you will be able to view the sample code.

[Dawn] Example of setting the announcement bar to be fixed together with the header in the Shopify theme "Dawn"

If you have already made a purchase, please login here.

Sample Codes

Test Theme :Dawn/Rise 15.2.0

Add a custom Liquid section to your header in the theme editor and insert the code

↗ Related Post

すべてのShopify TIPS

View all