Remove the gap between header and slider on mobile

Hi,

I built two sizes of sliders on home page, one for desktop/pad and one for mobile by response control. I set the top margin=-40 ,the bottom marging=60 and others are zero (refer to the demo) to remove the gap between header and slider. It works on desktop but doesn’t work on mobile (see attached files). Any additional settings for mobile to remove the gap? Thank you!

Attachments:

You must be logged in to view attached files.

Hello,

Add this negative margin to the first row of the Elementor. https://prnt.sc/uhivji or enter the page and set margin-top:-40px in the upper row settings: http://prntscr.com/lexqqs for WP Bakery page builder.

Best Regards

Hi,
I have set margin-top:-40px both of first (the slider for desktop/pad) and second row (the slider for mobile, it will be the first row on mobile screen). Or how can I remove the gaps of all pages between header and body by CSS code? So that I don’t need to set the margin-top one by one. Thanks.

Hello,

This gap is necessary for some of the functional pages that are not editable, that is why the only way to remove this gap is to make the negative marting in the first row or settings.

Best Regards

Hi,

I tried setting margin-top:-40px several times but it didn’t work on mobile screen. Is it possible to remove the gap on home page only?
Or can I build another homepage for mobile only, set a code to detect mobile device and redirect to the mobile homepage? Thanks.

Hello,

Please clear the cache, there is no gap on the home page now: https://gyazo.com/5fe35bc52d6c298dea0e9bed362a4953

If you have any questions please feel free to contact us.

Best Regards

Hi,

I think you don’t get my point at all. The gap is shown on mobile mode homepage only but the screenshot you paste is cut from desktop mode homepage. You can just easily reply me if there is any method to remove the gap on home page only instead of global settings for all pages. So that the functional pages you mentioned won’t be affected. You can see the gap still there from the attachment which is cut from mobile screen. Thanks.

Attachments:

You must be logged in to view attached files.

Hello,

Please disable the bottom row https://xtemos.com/docs/woodmart/header-builder/header-rows-columns-configuration/ on the mobile view of the header: https://xtemos.com/docs/woodmart/header-builder/header-responsive-settings/

Best Regards

Hi,
It doesn’t work.

Hello,

Please, provide your site admin access to the private area.

Best Regards

Hello,

Please provide login ID and password into the private area.

Best Regards

Hi,
I’m not sure if I posted the ID and password successfully so I submit again.

Hello,

Please provide the admin rights for the user, I cannot enter the Dashboard.

https://gyazo.com/7207b4da85cf71a5c38ac8bf9d1c2353

Best Regards

Hi,

Admin rights is provided. Please try again. Thanks.

Hi,

I have another problem when using elementor builder. I inserted icons and modified the size, color, alignment and set different responsive layout for mobile view but it seems all the settings are not workable. I attached the screenshots of desktop view and mobile view. Could you please check it as well?
Thanks.

Attachments:

You must be logged in to view attached files.

Hi,

I created a new page by copying the import base template (Privacy policy) but all the settings don’t work on website. The difference is as attached picture.

I found only the imported template pages will follow elementor settings. The pages created by myself with elementor builder will only show the default settings on website no matter what settings I make.

I have waisted so much time and finally realized the problems come from your theme. Elementor builder is not workable with Woodmart. I use several themes with elementor but no one shows this kind of error. It is a systematic error please fix it as soon as possible or my business will be impacted dramatically!

Thanks!

Attachments:

You must be logged in to view attached files.

Hello,

It seems you have solved the issues:

Mobile view does not have any gaps: https://gyazo.com/71890b6c33159bb0fe3692947ce49361

Icons are correct: https://gyazo.com/8eea978319aebfa961c78ee9177744bc

The policy page looks the same in the editing mode and in the front end: https://gyazo.com/fc32be9f74df5c6fab11d16ec0273a95

If the policy page is wrong, please clarify what should be changed and how.

Best Regards

Hi,

The error still happens but I found a way to correct it. It’s kind of weird that if I copy the elements, which I have made my settings on them, and paste to a new page, it will show my settings beautifully. However it is still inconvenient to me when I want to build a new page, I need to build it in a pre-page making all the settings and then copy and paste the elements to the new page one by one.

In order to clarify if the error is caused by any plugin or custom setting, I tried creating a subdomain installed Woodmart again. Unfortunately, the error is still there.

I hope your development team can solve the problem or this will be a big weak point of Woodmart although it is a powerful theme in other aspects.

Thanks.

Hello,

You can save a section or the whole page as a template and then insert in the new page and replace the content and all the settings would be copied with a couple of clicks correctly not causing any errors: https://elementor.com/help/template-library/

Deactivate all the plugins not related to the theme and check how it works, leave these plugins only:

Slider Revolution
Elementor
Woodmart Core
Contact Form 7
MailChimp for WordPress
WooCommerce
Safe SVG

Best Regards

[Author]

Posts