Editing Image with text correctly

[NinoB97]

Am trying to edit my image with text on my home page www.auraliving.nl

at the bottom is my over ons (about us) section where am using Image & Text Section. The image gets really big and blurry above the text, the quallity gets bad when it's good everywhere else i use it, can somebody tell me how to fix this problem. i want it to be just normal withouth the clunky look and the visible borders check it out on the website above and i post a picture so u can see what i mean.

[BSSCommerce-HDL · Accepted solution]

Hi @NinoB97,

Step 1: Go to Shopify Admin -> Online Store ->Theme -> Edit code

Step 2: Search file theme.liquid

Step 3: Insert this code above </head> tag: 

<style>
@media screen and (max-width: 767px) {
  .image-with-text__media.image-with-text__media--adapt.global-media-settings {
    scale: 0.8;
    border: none !important;
  }
} 
</style>

Hope this can help you,

If our suggestions are useful, please let us know by giving it a like or marking it as a solution. Thank you 😍

[BSSCommerce-HDL · Accepted solution]

Hi @NinoB97,

Step 1: Go to Shopify Admin -> Online Store ->Theme -> Edit code

Step 2: Search file theme.liquid

Step 3: Insert this code above </head> tag: 

<style>
@media screen and (max-width: 767px) {
  .image-with-text__media.image-with-text__media--adapt.global-media-settings {
    scale: 0.8;
    border: none !important;
  }
} 
</style>

Hope this can help you,

If our suggestions are useful, please let us know by giving it a like or marking it as a solution. Thank you 😍

[NinoB97]

Amazing work bro nobody knew how to properly fix this, u come trough again like always

[BSSCommerce-HDL]

@NinoB97 No problem. Have a good day 😍 

[NinoB97]

one last thing, i asked u earlier how to reduce the spacing inbetween the header and text on the image & text on the bottom of my page of auraliving.nl can u check it out again, i changed the heading style and now there is to much space inbetween the head and text how can i reduce this

[BSSCommerce-HDL · Accepted solution]

Hi @NinoB97, 

Step 1: Go to Shopify Admin -> Online Store ->Theme -> Edit code

Step 2: Search file theme.liquid

Step 3: Insert this code above </head> tag: 

<style>
.image-with-text__text.rte.body h4 {
    margin: 0 !important;
}
</style>

Here is result: 

Hope this can help you,

If our suggestions are useful, please let us know by giving it a like or marking it as a solution. Thank you 😍

[NinoB97]

works as expected, thanks again @BSSCommerce-HDL !!!😁

[BSSCommerce-HDL]

@NinoB97, I am glad that I was able to help you solve your problem. I hope I can help you more in the future 😍

[vinh0225]

@NinoB97 

The default section of "Image with text" will have low resolution because it's using an image with optimized size.

Two options are available.

- To create a new section using an original image for this.

- To import a custom font and place a text of "AURA LIVING" with the font.

If you are not familiar with coding, I can help you.

Regards,

Vinh