Header Graphic Behind Menu

Solved

Header Graphic Behind Menu

kiburi-lifestyl
Excursionist
25 1 9

How do I add a graphic image to the header section of website and BEHIND the logo and menu? Any ideas guys. Im using Liquid and theres no base.css file. Any help would be great.

Accepted Solution (1)
Liqiud_xPert_SJ
Shopify Partner
1045 126 156

This is an accepted solution.

please mark as solve if the issue has been resolve.

- If you need any technical assistance, feel free to send me a DM. You no longer have to search for answers without getting a response.
- Please don't forget to Like and Mark Solution to the post that helped you. Thanks!
- Your Shopify Solution Specialist For further discussion contact: Email ID- Liqud_3xPert_SJ OR Whatsapp
- Buy a Coffee for me to get more frequently help 🙂
- Hire Me to unlock the full potential of your e-commerce store Now 🙂- If you need any technical assistance, feel free to send me a DM. You no longer have to search for answers without getting a response.
- Please don't forget to Like and Mark Solution to the post that helped you. Thanks!
- Your Shopify Solution Specialist For further discussion contact: Email ID- Liqud_3xPert_SJ OR Whatsapp
- Buy a Coffee for me to get more frequently help 🙂
- Hire Me to unlock the full potential of your e-commerce store Now 🙂

View solution in original post

Replies 14 (14)

Liqiud_xPert_SJ
Shopify Partner
1045 126 156

@kiburi-lifestylcan you please share the store url so that i can look into the code and share an exact solution with you 🙂

- If you need any technical assistance, feel free to send me a DM. You no longer have to search for answers without getting a response.
- Please don't forget to Like and Mark Solution to the post that helped you. Thanks!
- Your Shopify Solution Specialist For further discussion contact: Email ID- Liqud_3xPert_SJ OR Whatsapp
- Buy a Coffee for me to get more frequently help 🙂
- Hire Me to unlock the full potential of your e-commerce store Now 🙂- If you need any technical assistance, feel free to send me a DM. You no longer have to search for answers without getting a response.
- Please don't forget to Like and Mark Solution to the post that helped you. Thanks!
- Your Shopify Solution Specialist For further discussion contact: Email ID- Liqud_3xPert_SJ OR Whatsapp
- Buy a Coffee for me to get more frequently help 🙂
- Hire Me to unlock the full potential of your e-commerce store Now 🙂
kiburi-lifestyl
Excursionist
25 1 9

Here you go mate 🙂 https://kiburi-lifestyle.myshopify.com/

and it duplicates on mobile device aswell and looks odd. as per screen shot

 

Liqiud_xPert_SJ
Shopify Partner
1045 126 156

@kiburi-lifestyl  please refer to the below css code and add that into your base.css file which islocated in the theme filse

 

Online Theme > Edit Code > Theme Files > Assets > base.css

.header {
	background-image: url(https://kiburi-lifestyle.myshopify.com/cdn/shop/files/Lanyards_2b_1400x.jpg);
	background-size: cover;
	background-repeat: no-repeat;
}

 

2024-06-14 10_57_07-Kiburi Lifestyle _ Paracord Accessories — Mozilla Firefox.png

- If you need any technical assistance, feel free to send me a DM. You no longer have to search for answers without getting a response.
- Please don't forget to Like and Mark Solution to the post that helped you. Thanks!
- Your Shopify Solution Specialist For further discussion contact: Email ID- Liqud_3xPert_SJ OR Whatsapp
- Buy a Coffee for me to get more frequently help 🙂
- Hire Me to unlock the full potential of your e-commerce store Now 🙂- If you need any technical assistance, feel free to send me a DM. You no longer have to search for answers without getting a response.
- Please don't forget to Like and Mark Solution to the post that helped you. Thanks!
- Your Shopify Solution Specialist For further discussion contact: Email ID- Liqud_3xPert_SJ OR Whatsapp
- Buy a Coffee for me to get more frequently help 🙂
- Hire Me to unlock the full potential of your e-commerce store Now 🙂
kiburi-lifestyl
Excursionist
25 1 9

Thanks mate but in Liquid under Assets I dont have base.css theres only -

 

custom.css

theme.css

theme.js

theme.min.js

Also I want the image so it cuts off above the menu itself and doesnt go below. 🙂 

Liqiud_xPert_SJ
Shopify Partner
1045 126 156

@kiburi-lifestyl  you can use custom.css file

- If you need any technical assistance, feel free to send me a DM. You no longer have to search for answers without getting a response.
- Please don't forget to Like and Mark Solution to the post that helped you. Thanks!
- Your Shopify Solution Specialist For further discussion contact: Email ID- Liqud_3xPert_SJ OR Whatsapp
- Buy a Coffee for me to get more frequently help 🙂
- Hire Me to unlock the full potential of your e-commerce store Now 🙂- If you need any technical assistance, feel free to send me a DM. You no longer have to search for answers without getting a response.
- Please don't forget to Like and Mark Solution to the post that helped you. Thanks!
- Your Shopify Solution Specialist For further discussion contact: Email ID- Liqud_3xPert_SJ OR Whatsapp
- Buy a Coffee for me to get more frequently help 🙂
- Hire Me to unlock the full potential of your e-commerce store Now 🙂
kiburi-lifestyl
Excursionist
25 1 9

Sorry noticed its custom.js and not custom.css anywhere else I can add

 

Liqiud_xPert_SJ
Shopify Partner
1045 126 156

theme.css

 

- If you need any technical assistance, feel free to send me a DM. You no longer have to search for answers without getting a response.
- Please don't forget to Like and Mark Solution to the post that helped you. Thanks!
- Your Shopify Solution Specialist For further discussion contact: Email ID- Liqud_3xPert_SJ OR Whatsapp
- Buy a Coffee for me to get more frequently help 🙂
- Hire Me to unlock the full potential of your e-commerce store Now 🙂- If you need any technical assistance, feel free to send me a DM. You no longer have to search for answers without getting a response.
- Please don't forget to Like and Mark Solution to the post that helped you. Thanks!
- Your Shopify Solution Specialist For further discussion contact: Email ID- Liqud_3xPert_SJ OR Whatsapp
- Buy a Coffee for me to get more frequently help 🙂
- Hire Me to unlock the full potential of your e-commerce store Now 🙂
kiburi-lifestyl
Excursionist
25 1 9

Mate you rock! Thanks so much for your help mate 🙂 GREATLY Appreciate it 🙂 your a legend 🙂

 

Liqiud_xPert_SJ
Shopify Partner
1045 126 156

This is an accepted solution.

please mark as solve if the issue has been resolve.

- If you need any technical assistance, feel free to send me a DM. You no longer have to search for answers without getting a response.
- Please don't forget to Like and Mark Solution to the post that helped you. Thanks!
- Your Shopify Solution Specialist For further discussion contact: Email ID- Liqud_3xPert_SJ OR Whatsapp
- Buy a Coffee for me to get more frequently help 🙂
- Hire Me to unlock the full potential of your e-commerce store Now 🙂- If you need any technical assistance, feel free to send me a DM. You no longer have to search for answers without getting a response.
- Please don't forget to Like and Mark Solution to the post that helped you. Thanks!
- Your Shopify Solution Specialist For further discussion contact: Email ID- Liqud_3xPert_SJ OR Whatsapp
- Buy a Coffee for me to get more frequently help 🙂
- Hire Me to unlock the full potential of your e-commerce store Now 🙂
kiburi-lifestyl
Excursionist
25 1 9

I added new section custom.css and pasted your snippet and changed url location and didnt work buddy.

Liqiud_xPert_SJ
Shopify Partner
1045 126 156

bro did you defined  that custom.css file in theme.liquid file?

- If you need any technical assistance, feel free to send me a DM. You no longer have to search for answers without getting a response.
- Please don't forget to Like and Mark Solution to the post that helped you. Thanks!
- Your Shopify Solution Specialist For further discussion contact: Email ID- Liqud_3xPert_SJ OR Whatsapp
- Buy a Coffee for me to get more frequently help 🙂
- Hire Me to unlock the full potential of your e-commerce store Now 🙂- If you need any technical assistance, feel free to send me a DM. You no longer have to search for answers without getting a response.
- Please don't forget to Like and Mark Solution to the post that helped you. Thanks!
- Your Shopify Solution Specialist For further discussion contact: Email ID- Liqud_3xPert_SJ OR Whatsapp
- Buy a Coffee for me to get more frequently help 🙂
- Hire Me to unlock the full potential of your e-commerce store Now 🙂
Liqiud_xPert_SJ
Shopify Partner
1045 126 156

the below image is showing the slider image you can update the image url in the code according to your need. i just added as placeholder

- If you need any technical assistance, feel free to send me a DM. You no longer have to search for answers without getting a response.
- Please don't forget to Like and Mark Solution to the post that helped you. Thanks!
- Your Shopify Solution Specialist For further discussion contact: Email ID- Liqud_3xPert_SJ OR Whatsapp
- Buy a Coffee for me to get more frequently help 🙂
- Hire Me to unlock the full potential of your e-commerce store Now 🙂- If you need any technical assistance, feel free to send me a DM. You no longer have to search for answers without getting a response.
- Please don't forget to Like and Mark Solution to the post that helped you. Thanks!
- Your Shopify Solution Specialist For further discussion contact: Email ID- Liqud_3xPert_SJ OR Whatsapp
- Buy a Coffee for me to get more frequently help 🙂
- Hire Me to unlock the full potential of your e-commerce store Now 🙂
kiburi-lifestyl
Excursionist
25 1 9

Oops i sent another issue below too. Sorry. But yeah ive uploaded to footer but noticed image distorts on mobile device. But with the Header, want a image behind the Menu and logo, so the image literally sits in the Header and behind 🙂

Liqiud_xPert_SJ
Shopify Partner
1045 126 156

@kiburi-lifestyl  this needs to be fixed with custom code i have to look into that.

- If you need any technical assistance, feel free to send me a DM. You no longer have to search for answers without getting a response.
- Please don't forget to Like and Mark Solution to the post that helped you. Thanks!
- Your Shopify Solution Specialist For further discussion contact: Email ID- Liqud_3xPert_SJ OR Whatsapp
- Buy a Coffee for me to get more frequently help 🙂
- Hire Me to unlock the full potential of your e-commerce store Now 🙂- If you need any technical assistance, feel free to send me a DM. You no longer have to search for answers without getting a response.
- Please don't forget to Like and Mark Solution to the post that helped you. Thanks!
- Your Shopify Solution Specialist For further discussion contact: Email ID- Liqud_3xPert_SJ OR Whatsapp
- Buy a Coffee for me to get more frequently help 🙂
- Hire Me to unlock the full potential of your e-commerce store Now 🙂