Disabling sidebar on tablet

Posted in: Newspaper
Post count: 47

Is that possible? I´ve tried to search for an answer and I found some code that unfortunately didnt help.
Are there any way to make this happen using custom CSS?

Thanks / Karl

Post count: 20688

Hi,

That would not be possible, unless maybe with custom CSS. But it would depend where this sidebar is, in a page, post etc.
Hiding it would be possible, but also it will require some adapting for the remaining content with no sidebar. I could give it try, provide a link to where you want to do this. Mention if it should work only for that page.

A general setting to remove a sidebar by the device used to view the website does not exist.
In a page for example elements, rows, columns, can be hidden per viewport
https://www.screencast.com/t/Cgew8aYUpP
https://www.screencast.com/t/yDtjHwIK2
This works in pages or cloud templates built with the composer.

Thanks

Post count: 47

For example this page..

https://vpnbasen.se/purevpn/

I´ve tried using visibility:none and display:none, but that just creates empty space.
I really like the sidebar on desktop but in longer pages on tablet it just creates empty space.

On an unrelated note, do you know how to get rid of the empty border on the top of the page (tagdiv composer). It leaves a blank spot when using slider revolution.
https://www.screencast.com/t/j7m5t47UV2KY

I´ve tried reducing margin (margin:-50px), are there any easier way to get rid of that gap?

Post count: 20688

The empty space is the result of hiding the sidebar. The remaining content will not automatically adapt to fill the newly created space.

Tablet is considered between these widths – https://www.screencast.com/t/NTYFSAe3
I could give you a code to remove the sidebar in those cases. Something like this maybe
http://prntscr.com/kqv72g
Enter it here – https://www.screencast.com/t/wgi9pJqnoFn

@media (min-width: 768px) and (max-width: 1140px) {
.postid-1988 .post .td-pb-span4.td-main-sidebar {
display: none;
}
.postid-1988 .post .td-pb-span8.td-main-content {
width: 100%;
}
}

It will work only on that post, if you decide it works as you want and want it or all posts, remove the class with the ID from the code
https://www.screencast.com/t/Ffg4t0g8

Seems you managed to remove that space – http://prntscr.com/kqv9j3
That is the padding top of the page, it creates some room between the header and content of the page. In your case you could use the menu overlay page template. This will position the header over the slider.
These are some demos which use the menu overlay page template
https://demo.tagdiv.com/newspaper_law_firm/
https://demo.tagdiv.com/newspaper_nature/

Post count: 47

Blank bar on top of page: I Adjusted the margin and that worked well enough..

Sidebar: Works great, I will use the new settings site-wide..

Thanks for helping out, you guys are awesome!

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