How do I use a image with text overlay using debut theme?

Solved
khhaven
Tourist
9 0 0

Hello I would like to use an image overlay on every one of my pages is there a way to modify the debut theme to allow me to do that?

I was reading that I need to edit the liquid html but I've never messed with that stuff..

 

appreciate any help!

https://codysbotanica.com/ <- what I would like on every page is the big logo

0 Likes
IttantaTech
Shopify Partner
490 52 88

This is an accepted solution.

Hello , @khhaven 

Please put image with text section/snippet file below {% section 'header' %} in theme.liquid file.

 

Thanks,
Ittanta Technologies Pvt. Ltd. | Shopify Expert
If reply is helpful, please Like and Accept Solution.
To hire us, contact us at info@ittanta.com
khhaven
Tourist
9 0 0

That kind of worked .. It's displaying twice on my landing page and it's not completely resizing correctly on the other pages.

The image being used is a little too big for the other pages but I'm not sure how to make it use the correct size..


this is the code I inserted:

 

<!---added logo code doesn't work correctly ---->

<div data-section-id="hero-1" data-section-type="hero-section"><div class="hero hero--adapt hero-hero-1 box ratio-container js lazyloaded" id="Hero-hero-1" data-layout="full_width" data-bg="//cdn.shopify.com/s/files/1/0207/2245/0496/files/CodysBotanica_Blank_ReadyForShopify_HC_300x300.jpg?v=1604353764" data-bgset="//cdn.shopify.com/s/files/1/0207/2245/0496/files/CodysBotanica_Blank_ReadyForShopify_HC_180x.jpg?v=1604353764 180w 55h,
//cdn.shopify.com/s/files/1/0207/2245/0496/files/CodysBotanica_Blank_ReadyForShopify_HC_360x.jpg?v=1604353764 360w 109h,
//cdn.shopify.com/s/files/1/0207/2245/0496/files/CodysBotanica_Blank_ReadyForShopify_HC_540x.jpg?v=1604353764 540w 164h,
//cdn.shopify.com/s/files/1/0207/2245/0496/files/CodysBotanica_Blank_ReadyForShopify_HC_720x.jpg?v=1604353764 720w 218h,
//cdn.shopify.com/s/files/1/0207/2245/0496/files/CodysBotanica_Blank_ReadyForShopify_HC_900x.jpg?v=1604353764 900w 273h,
//cdn.shopify.com/s/files/1/0207/2245/0496/files/CodysBotanica_Blank_ReadyForShopify_HC_1080x.jpg?v=1604353764 1080w 327h,
//cdn.shopify.com/s/files/1/0207/2245/0496/files/CodysBotanica_Blank_ReadyForShopify_HC_1296x.jpg?v=1604353764 1296w 393h,
//cdn.shopify.com/s/files/1/0207/2245/0496/files/CodysBotanica_Blank_ReadyForShopify_HC_1512x.jpg?v=1604353764 1512w 458h,










//cdn.shopify.com/s/files/1/0207/2245/0496/files/CodysBotanica_Blank_ReadyForShopify_HC.jpg?v=1604353764 1567w 475h" data-parent-fit="cover" style="background-position: center center; background-image: url(&quot;https://cdn.shopify.com/s/files/1/0207/2245/0496/files/CodysBotanica_Blank_ReadyForShopify_HC_1296x....;);" alt="" src="//cdn.shopify.com/s/files/1/0207/2245/0496/files/CodysBotanica_Blank_ReadyForShopify_HC_300x300.jpg?v=1604353764"><div class="hero__inner">
<div class="page-width text-center"></div>
</div>
<picture style="display: none;"><source data-srcset="//cdn.shopify.com/s/files/1/0207/2245/0496/files/CodysBotanica_Blank_ReadyForShopify_HC_180x.jpg?v=1604353764 180w 55h,

//cdn.shopify.com/s/files/1/0207/2245/0496/files/CodysBotanica_Blank_ReadyForShopify_HC_360x.jpg?v=1604353764 360w 109h,
//cdn.shopify.com/s/files/1/0207/2245/0496/files/CodysBotanica_Blank_ReadyForShopify_HC_540x.jpg?v=1604353764 540w 164h,
//cdn.shopify.com/s/files/1/0207/2245/0496/files/CodysBotanica_Blank_ReadyForShopify_HC_720x.jpg?v=1604353764 720w 218h,
//cdn.shopify.com/s/files/1/0207/2245/0496/files/CodysBotanica_Blank_ReadyForShopify_HC_900x.jpg?v=1604353764 900w 273h,
//cdn.shopify.com/s/files/1/0207/2245/0496/files/CodysBotanica_Blank_ReadyForShopify_HC_1080x.jpg?v=1604353764 1080w 327h,
//cdn.shopify.com/s/files/1/0207/2245/0496/files/CodysBotanica_Blank_ReadyForShopify_HC_1296x.jpg?v=1604353764 1296w 393h,
//cdn.shopify.com/s/files/1/0207/2245/0496/files/CodysBotanica_Blank_ReadyForShopify_HC_1512x.jpg?v=1604353764 1512w 458h,
//cdn.shopify.com/s/files/1/0207/2245/0496/files/CodysBotanica_Blank_ReadyForShopify_HC.jpg?v=1604353764 1567w 475h" sizes="1269px"
srcset="//cdn.shopify.com/s/files/1/0207/2245/0496/files/CodysBotanica_Blank_ReadyForShopify_HC_180x.jpg?v=1604353764 180w 55h,
//cdn.shopify.com/s/files/1/0207/2245/0496/files/CodysBotanica_Blank_ReadyForShopify_HC_360x.jpg?v=1604353764 360w 109h,
//cdn.shopify.com/s/files/1/0207/2245/0496/files/CodysBotanica_Blank_ReadyForShopify_HC_540x.jpg?v=1604353764 540w 164h,
//cdn.shopify.com/s/files/1/0207/2245/0496/files/CodysBotanica_Blank_ReadyForShopify_HC_720x.jpg?v=1604353764 720w 218h,
//cdn.shopify.com/s/files/1/0207/2245/0496/files/CodysBotanica_Blank_ReadyForShopify_HC_900x.jpg?v=1604353764 900w 273h,
//cdn.shopify.com/s/files/1/0207/2245/0496/files/CodysBotanica_Blank_ReadyForShopify_HC_1080x.jpg?v=1604353764 1080w 327h,
//cdn.shopify.com/s/files/1/0207/2245/0496/files/CodysBotanica_Blank_ReadyForShopify_HC_1296x.jpg?v=1604353764 1296w 393h,
//cdn.shopify.com/s/files/1/0207/2245/0496/files/CodysBotanica_Blank_ReadyForShopify_HC_1512x.jpg?v=1604353764 1512w 458h,
//cdn.shopify.com/s/files/1/0207/2245/0496/files/CodysBotanica_Blank_ReadyForShopify_HC.jpg?v=1604353764 1567w 475h">
<img alt="" class="lazyautosizes lazyloaded" data-sizes="auto" data-parent-fit="cover" sizes="1269px"></picture></div>
<noscript>
<div class="hero hero--adapt" style="background-image: url('//cdn.shopify.com/s/files/1/0207/2245/0496/files/CodysBotanica_Blank_ReadyForShopify_HC_2048x.jpg?v=1604353764'); background-position: center center;"></div>
</noscript></div>


<!-end added logo image overlay---->

0 Likes
khhaven
Tourist
9 0 0

Ok I played around with it and I got it working thank you

 

 

now I need to figure out how to remove the text header and move the menu below the image.

0 Likes