Add custom icon to header

[DGQs]

Hi there,

Next to my logo, I would like to add a custom icon to my header.

I am using the Crave Theme. How can I do this please?

[BSSCommerce-B2B]

@DGQs , Can you kindly share your store url and icon you want to add ?

[Sweans]

Hi @DGQs ,

Please follow the steps to display the icon in the header.

-Prepare the icon in svg or png format.

-Upload the icon to the Shopify store: Admin > Settings > Files.

-Then modify the header file header.liquid in Sections : Online Store > Themes > Actions > Edit code.

-Add the HTML next to the logo code. For example:

 {{ 'logo' | image_tag }} 
 

-Replace ‘your-icon.png’ with the actual filename of your uploaded icon.

-Add the code below to theme.css or theme.scss.liquid

.custom-header-icon { 
width: 30px; 
margin-left: 10px;
}

-Save the changes.

If you need further assistance, feel free to reach out!
If this solution works for you, please like the post and mark it as a solution!

Regards,
Sweans

[DGQs]

Hi Sweans, thank you so much already for this. It’s not going smoothly just yet. I get the following notification. I was confused about where to place the first code within the right file. what do you mean with ‘next to the logo code’?

This is the code that I posted at the bottom of the header.liquid in sections:

{{ 'logo' | image_tag }}

The error is on the picture

[DGQs]

Damn Good Questions | A Conversation Game Changer

password is damngood

[DGQs]

I also want to make sure that the icon is instead of my current cart logo.

I Deleted all the code because it was difficult to keep editing with the remarks. I have a ‘dot’ on my cart now that i cannot seem to remove. Any ideas what went wrong please?