Home Background Image is cut off on live website?

[Michelle Wavrick]

When I upload my background image in WordPress, the preview looks perfect. However, when I publish the changes and go to the live site, the background image is blown up slightly larger than in the preview, and therefore cut off on the bottom so I can’t see the whole image? Do I need to make it a specific size?

[Spiracle Themes]

Hi Michelle

The reason for this is the change in width of the screen and the image adjusts itself according to the screen width size. In customizer preview
the width of the site is small as compared to the live website.

What is the solution?

1) If you have any other image of yours you can try.
2) Try the image below. We cropped the image from the bottom
View Image
3) Make your header transparent which gives you an extra view of your image. Go to Appearance -> Customize -> Header Styles and
change the header style.

Let us know if this works out for you

Best Regards

[Michelle Wavrick]

This did seem to work, I just need to adjust the text so it’s not cut off. Thank you!

Additionally, how can I adjust the size of the font in the subheading text on the main homepage? The paragraph below “Let yourself happen?” I want it to be larger but I can’t seem to find the right place to adjust. None of the heading font settings change it.

Thank you.

[Spiracle Themes]

Hi Michelle

This simple CSS will do this

.slide-bg-section p {
   font-size: 17px;
   font-weight: 500;
}

Copy & Paste it in Appearance -> Customize -> Additional CSS

Note: You can also increase/decrease the number 17 to adjust it.

Best Regards

[Michelle Wavrick]

PERFECT! This worked exactly how I had hoped. Many thanks.

[Author]

Posts