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 ?

[DGQs]

dgqs.myshopify.com

password is damngood

[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:

<div class="site-header__logo">
 {{ 'logo' | image_tag }} <!-- This is your logo -->
<img src="{{ 'your-icon.png' | asset_url }}" alt="Custom Icon" class="custom-header-icon" /> 
</div>

-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: 

<div class="site-header__logo">
{{ 'logo' | image_tag }}
<img src="{{ 'https://cdn.shopify.com/s/files/1/0728/1183/9825/files/DGQ_byFSS_kaarten_Tekengebied_1.png?v=1726219...' | asset_url }}" alt="Custom Icon" class="custom-header-icon" />
</div>

The error is on the picture 

[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?