Return to previous page

Make the homepage background images fit the page as shown in the demo

This topic has 9 replies, 3 voices, and was last updated 9 years ago ago by Eva Kemp

tmane

Participant

October 29, 2015 at 22:31

Hi,

I have my second web designer working on my WooPress Parallax theme and for some reason the background images aren’t fitting the page as they do in the demo: https://www.8theme.com/demo/woopress/parallax/

I currently have someone working on it, but they said they’ve tried making it work like the demo, but told me there is a bug preventing them from doing it. Also, every time I look at my page, as I scroll down, there are blank spaces between images. I want a smooth scroll just like the demo, but with different images obviously.

Thanks!

#96901 Copied Theme version: Woopress Parallax WooCommerce version: Not sure

8 Answers

Robert Hall

Support staff

October 30, 2015 at 09:39

Hello,

Please provide us with wp-admin access in Private Content.

Regards,
Robert Hall.

#96950 Copied

tmane

Participant

October 30, 2015 at 18:22

Hey Robert,

Sounds good. There are some problems that occurred after setting up SSL and SiteLock for my site. Some of the icons don’t appear how they used to. Also, I am not sure why, but in compared to the demo of the theme, my site is loading terribly slow, even after I upgraded my hosting plan. Another problem we’re having is that on mobile and tablet, all the images on the homescreen are extremely zoomed in, and it’s incredibly slow on my tablet and mobile. I appreciate all the help with that!

Please, contact administrator
for this information.

#97057 Copied

Eva Kemp

Support staff

October 30, 2015 at 18:55

Hello,

In the row settings you need use Parallax style as “Simple background image”:
http://storage6.static.itmages.com/i/15/1030/h_1446227592_7688000_a0b271fb67.png

Please look at this test result:
http://www.webpagetest.org/result/151030_5X_10RN/1/details/

Slow site loading is caused by your images. You need optimize them.
Please read these articles:
http://www.sparringmind.com/speed-up-wordpress/
http://premium.wpmudev.org/blog/10-best-image-optimization-plugins-to-speed-up-your-wordpress-site/
http://www.elegantthemes.com/blog/tips-tricks/optimize-images-for-your-wordpress-website

Regards,
Eva Kemp.

#97066 Copied

tmane

Participant

October 30, 2015 at 19:48

Hi Eva,

I added an image optimization plugin from the articles you linked and I am not sure if it did anything. Also, my web designer says that when he tried to select the Parallax Style as “Simple Background Image” the images go white when he checks back to the page. He thinks it may be some kind of bug.

#97080 Copied

Eva Kemp

Support staff

October 31, 2015 at 11:38

Hello,

I’ve changed Scroll effect for the first row:
http://storage9.static.itmages.com/i/15/1031/h_1446287783_5155814_6a3b4b14e9.png

Please clear browser cache and check the page now.

This issue is related to Ultimate VC Addons plugin. We contacted them and received the reply:

We tested, at the moment – Fixed background property is creating bugs in Chrome.

See reports here –

http://stackoverflow.com/questions/22292357/fixed-background-image-bug-chrome-mac
http://www.cybertechquestions.com/css-fixed-background-attachment-blinks-in-google-chrome_118396.html
https://wordpress.org/support/topic/problem-with-fixed-backgrounds-in-chrome

if you google “Chrome bug with fixed background” you will find many people reporting the same.

The workaround for this is quick. Simply change fixed background to “Move with the content” (scroll) Further – you can apply parallax to it and make it even more beautiful.

Please try the suggestion of them.

Regards,
Eva Kemp.

#97129 Copied

tmane

Participant

October 31, 2015 at 17:48

It’s still not working the way I want it to. I want the effects of my home screen to work just like the Woopress Parallax demo and that’s still not happening on any of the following browsers: Chrome, Firefox, Safari. On top of that, I have tried optimizing my images and the site still runs terribly slow even after paying over $200 for ultimate hosting from Godaddy, and adding Sitelock. For every browser that my site doesn’t work properly on, the demo works just fine with fast load time and everything. Also my website is still not working properly on mobile. The only thing that works properly is the header and footer, which the footer. When I enlarge the screen of my website to full size, there is a white space on the right, and as I scroll down the page, it’s not smooth at all and leaves white spaces on the top and bottom. I thought it would be simple to download the theme and replace the images from the theme with mine, but after downloading the updated version of the theme, that is not the case. I have had 2 different web designers work on my site, and neither of them can figure it out either. My header works fine, my footer works fine, but in between that it’s just a mess. Clearing the cache on my browsers doesn’t do a thing, and when I talk to others that have seen the site on their computer, they report the same things I see as well.

I really liked this theme, but I didn’t think it would be such a headache simply switching out demo images for my images.

#97155 Copied Theme version: www.8theme.com/demo/woopress/parallax

tmane

Participant

October 31, 2015 at 17:51

And if resizing the images would help, what is the maximum size used in the Woopress Parallax demo?

Thanks.

Please, contact administrator
for this information.

#97156 Copied

Eva Kemp

Support staff

November 3, 2015 at 11:02

Hello,

Original sizes of images in demo Parallax site are 1,658px × 890px.

When resizing images we also recommend to use this plugin https://wordpress.org/plugins/regenerate-thumbnails/ to regenerate images.

Regards,
Eva Kemp.

#97491 Copied
Tagged: background images, best selling, demo, homepage, themes, woocommerce
Viewing 9 results - 1 through 9 (of 9 total)