How do I make clickable catalogs at the top of my homepage?

Store Design
1

Screen Shot 2023-02-17 at 10.54.57 PM.png
Screen Shot 2023-02-17 at 10.54.57 PM.png1462×300 43.8 KB

I want to make my menu catalogs clickable like in Kylie Jenners kyliecosmetics.com. What is the code to make that possible

2

To make clickable catalogs at the top of your homepage, you can add links to the individual collections in your Shopify store to your main navigation menu. Here’s how to do it:

  1. Go to your Shopify admin dashboard and click on “Online Store” and then “Navigation”.

  2. Click on the menu that you want to edit, or create a new menu.

  3. Click on “Add menu item” and enter the name of the collection you want to link to.

  4. In the “Link” field, enter the URL for the collection. This should be in the format: /collections/[collection-handle].

  5. Click “Add” to save the menu item.

  6. Repeat these steps for each collection you want to add to your menu.

Once you’ve added the collection links to your menu, your customers will be able to click on the catalogs at the top of your homepage and be taken to the corresponding collection pages.

If you want the catalogs to look like they do on kyliecosmetics.com, you can add some CSS code to your Shopify theme’s stylesheet to style the menu items. Here’s an example of the CSS code you can use:

.site-nav__link {
font-size: 14px;
text-transform: uppercase;
font-weight: 500;
color: #222;
padding: 5px 10px;
border-radius: 10px;
background-color: #f5f5f5;
transition: all 0.3s ease;
}

.site-nav__link:hover {
background-color: #222;
color: #fff;
}

In this example, the code targets the “site-nav__link” class and styles the menu items using various CSS properties. This will give your menu items a similar look and feel to those on kyliecosmetics.com.

3

Thanks. Where do I add the code? Im using dawn theme, my website is www.ohemaadesigns.com

4

Pm me with details

5

Where do I add in the coding?