Responsive settings not working

Shapely
1

Hello,
Im using the shapely theme and its really great! Just one problem. It seems that my responsive settings doesnt work. It looks unlike then i expected it after your demo. Also the logo is stretched and centered on top of the site.
I attached two screens. The one which looks akward is smart device iphone with safari. The big one with the stretched logo is desktop site on an ipad.
Please help! =)
Best regards

2

Hi @petep,

I hope you are well today and thank you for your question.

From the screenshot that you have shared it seems this is happening due to plugin conflict on your site so please try temporary deactivating all plugins specially jetpack and see whether everything works fine and then enable the plugins one by one to see which plugin is conflicting if any.

Your second screenshot didn’t get uploaded successfully due to “File exceeds allowed file size” so could you please try re-uploading it?

Best Regards,
Movin

3

Hi!
Thanks for the advice. Since I moved the whole installation to another hoster, the problem is solved.
I have another Problem, but I will open therefore another thread.

Thanks for your help!

4

You are most welcome here :slight_smile:

5

Hey, thought it worked, but i didnt.

Attached some Screens.
First ones are made with latest iOs iPad Pro.
The Smaller ones are made with an iPhone 4.

Thanks for your help!

PS:
You can switch the site view from dektop to mobile.
The text rows and images are working. But Logo, Header Image not.
And then there is this strange blue view…

6
The text rows and images are working. But Logo, Header Image not.

As i don’t have ipad device so i have tested it on http://www.responsinator.com/ and it’s displaying fine for me as shown in the attached screenshot.

And then there is this strange blue view..

As said previously this can be due to plugin conflict on your site so please try temporary deactivating all plugins specially Jetpack plugin and see whether everything works fine and then enable the plugins one by one to see which plugin is conflicting if any.

7

HI, thanks for your response…

I tried Responsinator - Blackforestjerky.com too. And its not working… Header Image is no 100%. It is original size which is way too big for mobile. You can see it there.

8

Also…
See attached screen. Logo is still stretched.

9

I am not sure why it’s displaying for you like that. Please see the attached screenshot it’s displaying fine for me.

Which browser are you using to test it?

Could you please try using different browser?

10

I tested Chrome and Mozilla, latest versions.

I also tested on different Devices, all same.

11

I still couldn’t confirm the issue on your site but to resolve it could you please try adding the following CSS code in the Custom CSS option of your theme on the below path.

Admin Area -> Appearance -> Customize -> Shapely Options -> Other

#site-navigation .module.left {
    height: 55px !important;
}
12

Thanks for your reply. Seems to work on a first try.
But the Header Image (the big one, screen size) is still too big on mobile. You have to scroll way to far

13

To redolve the header image issue try using the below CSS code.

@media (max-width: 767px){
div#shapely_home_parallax-1 {
    height: 250px !important;
    overflow: hidden;
}
div#shapely_home_parallax-1 section.cover.fullscreen.image-bg {
    height: 250px !important;
    overflow: hidden;
}
}