Custom site width?

Posted in: Newspaper
Post count: 110

I see that the Newspaper theme supports a few options for site width. However, a requirement for our site is that the desktop version of the site be 1260 wide in the body (non-background) area. Is it possible to configure the theme to support 1260 width, and if so, will this break blocks or other features?

Post count: 35449

Hi,

Yes, you can use tagDiv Composer to adjust the theme width, unfortunately there is no general option for this, but it can be easily achieve, for example on homepage edit it with tagDiv Composer -> https://i.imgur.com/CaDwOxI.png click on row and stretch the layout -> https://i.imgur.com/VkAvQuC.png in you case you need to select it on 1400px after that click in css tab set margin right and left auto and the width you want (1260px) -> https://i.imgur.com/KU163G0.jpg
Also there is one more solution, you can stretch the the row on 1200px and set only margin left and right using “-” for example -30 -> https://i.imgur.com/w0QQ4dq.png -> https://i.imgur.com/s09N1uV.png

Hope this will help you!
Thank you!

Post count: 110

Thanks for the detailed response, Calin. Can I expect the theme’s blocks to continue to work correctly even if the width isn’t one of the default values?

Post count: 35449

Hi,

If you are using flex blocks and flex grids then should be no problems, these will adapt to any size.

Thank you!

Post count: 110

Thanks Calin. I followed your instructions and I’m able to get the Row to 1260 width, however, it isn’t centered. In this screenshot the Row background is red and the Zone background is blue (for clarity). You can see that the red area is shifted to the right from center.

https://imgur.com/a/zs4nGUW

The settings I used to get it this way are:

  • Width: 1260
  • Row Stretch: Default
  • Right/Left Margin: Auto
  • When I experimented with the other Row Stretch options, the Row area would always fill the entire width of the page instead of being 1260 wide.

    I also tried your alternate approach by using Row Stretch: 1200 and then setting the Right/Left Margin to -30, but the Row width was not 1260 for some reason. I tried adjusting the margins but the Row Width wouldn’t change.

    Post count: 35449

    Hi muterobert,

    In order to achieve that row width, will be indicate to stretch the row and the best option will be this -> https://i.imgur.com/Thb3zMS.png -> https://i.imgur.com/Oj9AwFR.png you must stretch the row and the content, you can not stretch only the content to achieve what you need.

    Thank you!

    Post count: 110

    Thanks for your response Calin. If I use the settings you suggested (Stretch Row & Content) I cannot get the content area (Column) to be 1260px wide. For some reason it stays at 1212px even if I set Column > CSS > Width to 1260 or try to use margin/padding to change its width.

    https://imgur.com/a/gKggqI3

    Post count: 35449

    Hi,

    I think that is because the column has set some padding , please set the padding on column on 0 -> https://i.imgur.com/V8x9shD.png -> https://i.imgur.com/6CDPkLH.png -> https://i.imgur.com/k79R9IY.png

    Hope this will help you!

    Post count: 110

    Setting that padding to 0 appears to have worked, and the column is centered correctly too, thanks Calin!

    Post count: 35449

    I’m glad that i was able to help you, if you have other questions, just let us know!
    Have a nice day!

    Viewing 10 posts - 1 through 10 (of 10 total)
    The forum ‘Newspaper’ is closed to new topics and replies.