Change text in Image with Text Overlay debut theme

Store Design
1

Hi All,

I am using the debut theme & what is frustrating me is that everytime I want to change my hero banner image, I need to change the font position, colour, size etc so the text doesn’t get “lost” within the photo. These changes can also be different for mobile & desktop. Is their code I can keep on hand for me to change each time ? I have tried coding I have used before but it doesn’t work all the time. My store is treasureknot.com.

1 Like
2

@Mareka

sorry for any issue can you please show me issue

3

xmas.JPG
xmas.JPG1920×1020 181 KB

xmas 2.JPG
xmas 2.JPG1920×1020 284 KB

On the mobile version I would like to move the text up to avoid the xmas baubles. Usually my text colour is purple but I managed to find the code to change the font colour to white for this particular image. I would like to be able to change the text colours, position etc on different banners I may use in the future.

1 Like
4

@Mareka

try this code

  1. Go to Online Store->Theme->Edit code
  2. Asset->/theme.scss.liquid->paste below code at the bottom of the file.
@media only screen and (max-width: 749px) {
.hero__inner {padding: 10px 0;}
}
5

Thanks Ketan, that worked. Going forward, is their simple coding for changing font colours, positions, size etc for different banner images ?

1 Like
6

@Mareka

nope this global css code word as well all