Hi.
Trying to give the header a full width aspect with Bakery Page Builder.
I can’t find the way. I did some years ago with older theme versions. But now it’s imposible.
I read in the forum something about using tagdiv composer, I open the home with tagdiv but is impossible to do anythin.
Here, the website I’m working on it: escueladesurfonthesea.com
Thanks in advance
Hi,
Please note that now we recommend to use tagDiv Composer with tagDiv Cloud Library, these are theme plugins, Bakery Page Builder is a bundled plugin -> https://help.market.envato.com/hc/en-us/articles/213762463-Bundled-Plugins, also in Newspaper X this plugin can provide conflicts with tagDiv Cloud Library.
You can set the full width for header in two ways, one for classic header like the one you are using you can force it from theme panel -> https://i.imgur.com/DFObxkt.png and second using a cloud header from tagDiv Cloud Library.
Also make sure that you do not have set any background color or image, because this will box your layout.
Let me know the results!
Thank you!
Now, full width menu is on but not the image slider. I can’t find the way to do it with WPBakery. Now I’m still trying to find the way to ban/delete slider in mobile website cause looks ridiculous, too small.
Thank you.
Hi,
The slider is not full width because you have set a background color that is make the website boxed https://i.imgur.com/tiftnFy.png -> https://forum.tagdiv.com/background-introduction/
If the slider was set with tagDiv Composer then you can edit the homepage -> https://i.imgur.com/kjo9cxb.png -> set the phone viewport -> https://i.imgur.com/i2JaDaG.png click on the element you want to hide on mobile and set this option from css tab -> https://i.imgur.com/VYviV3Q.png
As I know with WPBakery this can be done only by adding an extra class to the elements and set the code for remover it in Theme panel> Custom code > Advance css > Phones.
Thank you!
Thank you for your useful comments.
Now, in my computer, the website is working full width but not in the website for mobiles. How could I design a full width mobile website?
Thanks in advance.
Mario
Hi. Sorry again.
I also try to modify the empty space between the slider and the menu. I add -48px margin in the design options, in the computer website is ok but not in the mobile version because the menu in over the slider.
Thank you in advance
Cheers
Hi,
The mobile will display the content in full width -> https://i.imgur.com/y3jibYb.png you can check it using the view port option from tagDiv Composer -> https://i.imgur.com/cHulder.png
The css that you add on desktop can be set for mobile too, just check the mobile version like this and change the css -> https://i.imgur.com/wo4hu7s.png ( the css tab will apply on each view port).
Let me know the results!
Thank you!
Hi
Thank you but I’m using Bakery composer. So with your tagdiv info is not possible.
So now I’m trying with CSS at the Newspaper Theme Pannel / custom css. I just deleted the padding of all the web but I only wanted for the top slider. My god! I’m getting carzy.
Is there any CSS I could use to make full width slider (mobile version)?
Thanks again
I wrote this:
.tdc-row
{
padding-left: 0;
padding-right: 0;
}
Hi,
Please try this custom css -> https://i.imgur.com/mK8cEjc.png
.wpb_wrapper .wpb_gallery {
margin-bottom: 0px!important;
}
Set the code in theme panel> custom code> advance css > in phone
Hope this will help you!
Sorry but maybe I didn’t explain my self properly.
I’m looking for a full width slider on phone web version.
Now fullwidth slider is only on computer version.
Hope you can send me the CSS
Thanks again
Hi,
To make the slider on mobile full width please try this custom css -> https://i.imgur.com/vq6p2nR.png
.wpb_gallery .flexslider{
margin: 0px -20px;
}
Hope this will help you!