Enabling a ‘burger’ menu icon or ‘inline’ horizontal links
Alchemy includes the option for a burger navigation icon, or horizontal ‘inline’ links. You can enable your burger menu or inline links here:
Admin > Online store > Customise theme > Header > Set your desktop ‘Navigation’ dropdown to either ‘Show inline menu’.
Note – if the screen is not wide enough to show the full list of inline links then the theme will swap to the burger menu layout.
The Alchemy inline menu can be a standard 3 tier drop down navigation and a full-width mega menu. The theme switches the menu into a full-width mega menu when every link inside a dropdown also has a drop down.
Create a full width inline menu/mega menu
To make ‘mega’ drop downs, like the one in this demo store, you need to create ‘nested’ navigation as follows. Under the menu item you’d like the mega menu to drop down from, add as many title links as you like. Each of these title links must then have its own items nested inside for the dropdown menu to turn into a mega drop down menu:
Add other menus in your store following the usual Shopify method explained here.
Watch our video guide to find out more:
Showing contact information and social links in the menu
Alchemy includes the option to show contact information such as email or telephone details in a mega menu or in the side menu. Social media icons can also be shown in the mega menu and side menu.
Admin > Online store > Customise theme > Theme Settings > Social Media
Layout and Logos
Choose the setting Layout > Show on top of full width sections if you wish your navigation to show on top of your hero banner images. The theme has the option for a main logo and a contrast logo. The ‘contrast logo’ will be shown on top of header slideshow and header images. If a lot of your images are very light, then the contrast logo should be dark to stand out, and vice versa.
The header can also be set to stick to the top of the screen on scroll and you can choose whether to shrink your logo image on scroll to preserve screen space.
Menu image promotion
To show promotional images in your main menu, click ‘header’ and scroll to the bottom, then select ‘Add menu promotion’. Now this next step is very important and it’s where many make a mistake. Make sure you enter the dropdown menu name that you wish the image to appear under. This is case sensitive, so for example, using ‘Shop’ rather than ‘SHOP’ would make a difference – it must match navigation link title exactly. Then simply add your image, link and text.
Add an announcement bar at the top of your site. Here are some ideas you can use them this section:
- Announce a seasonal sale for a limited time only!
- Mention the brand new discount code you have activated today!
- Encourage people to read your latest blog post by linking directly to it.
- State that all items have free shipping.
Footer section menu
The Footer consists of a series of up to four blocks which can be a single level menu or text. If you have more than one menu block then the menus will be displayed vertically as a column.
Payment icons are pulled directly from the Shopify, based on the payment settings you have set up. If you need to display more, the theme’s code would need to be customised by a specialist developer.
Remove the “Powered by Shopify” text
Footer text such as “Powered by Shopify” and “Theme by Clean Canvas” can be edited or removed using the Language Editor.