Transparent images on coloured backgrounds

Shopify Discussion
1

Hi All,

I have made a section have a coloured background but the image within the section still has a block white box.

I have made the background of the image transparent and saved it as a PNG and it still doesn’t show as transparent.

Please can someoone help!

2

Hello @NickyGouna ,

Welcome to the Shopify community!
and Thanks for your Good question.

Please share your site URL,
So I will check and provide a solution here.

1 Like
3

Thanks so much for your quick response.

https://curatdby.com/

I removed the coloured background from the section for the moment. Let me know if i should add it back in so you can see what i mean.

thanks!

4

@NickyGouna , can you highlight the section of the landing page using a screenshot?

5

see images below! thank you

NickyGouna_0-1600340550098.png
NickyGouna_0-1600340550098.png1564×435 39.5 KB

NickyGouna_1-1600340569368.png
NickyGouna_1-1600340569368.png1085×414 32.9 KB

6

@NickyGouna ,

  1. Go to Online Store->Theme->Edit code
  2. Asset->theme.scss->paste below code at bottom of file

.image-wrap.text-spacing {
background: #636363 !important;
}

change color code according to your requirement
Want to modify or custom changes on store hire me.
If helpful then please Like and Accept Solution.
Email: wahabahmadghori@gmail.com

1 Like
7

Oh my gosh. It worked. you’re incredible haha.

thank you so much!!

8

Hey,

I wonder if you could help me figure out something else please.

I am trying to make the ‘How it works’ text bold and underlined

curatdby.com

is this possible at all please?

thanks so much

9

@NickyGouna , which text do you want to bold and underline? can you explain with a screenshot?

10

the circles red text please @Wahab_Ahmad

NickyGouna_0-1600353491816.png
NickyGouna_0-1600353491816.png1207×864 83.5 KB

as well as this, i wondered if it was possible to put a box around each of the below, see image

NickyGouna_1-1600353562579.png
NickyGouna_1-1600353562579.png1207×864 93 KB

apologies for all the questions! thanks

11

@NickyGouna ,

  1. Go to Online Store->Theme->Edit code
  2. Asset->theme.scss->paste below code at bottom of file
.index-section .grid__item>h2 {
text-decoration: underline;
font-weight: 700;
}
div#shopify-section-1596811063121 .grid__item.medium-up--one-third.text-center.aos-init.aos-animate {
border: 2px solid red;
min-height: 450px;
}

Want to modify or custom changes on store hire me.
If helpful then please Like and Accept Solution.
Email: wahabahmadghori@gmail.com

1 Like