I want to use Slide element from TD Composer on my homepage. But when I put Slide element into layout, when I switch to Mobile viewport, it disappeared! As well as when I save page, on mobile is Slide element really missing. And there is no option how to hide/show element depending on viewport… What is the problem? I thought different viewports are only for us to imagine how it looks on mobile or tablet but why it is erasing elements?
https://www.dhmedia.cz/slide1.jpg
https://www.dhmedia.cz/slide2.jpg
The same in real browser. Slide element in mobile view disappeares…
(Layout based on Lifestyle Pro demo)
Not me, you are adding element to header, not to content 🙂 As I mentioned it is based on your Lifestyle Pro demo, where is slide element in header area. I guess it’s because there is no way how to create on content area element with full-size (margin to margin of screen).
So my question is, how to create slide element with fullsize as it is here on top:
https://demo.tagdiv.com/newspaper_lifestyle_pro/
1) When I try to put element in content area, I cannot set fullsize
2) When I try to put element in header area, as you did in Lifestyle pro demo, it is fullsize, but it disappears on mobile view. But there must be obviously way, how to do it, when it is working in your demo…
Hi pavel_t, yes the Lifestyle Pro demo has a slider in the header, so if you want to do the same you need to know that the mobile has a different header, that is way is not display the one from desktop.
Now you can do two things:
1. you can import this cloud header from tagDiv Cloud library and edit it with tagDiv Composer.
2. set the slider in mobile header too.
Make sure that the row is stretched on desktop -> https://i.imgur.com/fl05ABL.jpg then add the slider element and use the filter tab to choose the post you want to display -> https://i.imgur.com/OhCw6eT.jpg then in mobile add the slider in header and in css tab set margin left and right with “-20” -> https://i.imgur.com/2aOCJjC.png
Hope this will help you!
Thank you!
Thank you. I tried suggested solution. Unfortunately I realized problem – when I put Slide element into Header zone, there is a huge lag in mobile view (both on real mobiles as well as mobile view on desktop browsers), so bad it basically not working at all…
When I drag Slide element into Content area, it is OK, showing Slide in desktop as well as mobile view. BUT I can’t force it to 100% stretch width there, respectively its is stretched only between Content area margins.
Is there a way how to have full-sized slider, from screen margin to screen margin, in content zone?
Hi pavel_t,
If you do not use a background color or image, then you can use tagDiv Composer to stretch a row from content too -> https://i.imgur.com/H0Hi2q3.jpg also for mobile version it can be adjusted too.
Hope it will help you!
Thank you!
Well I think I finally figured out what is the problem. Problem is option Background (Theme background) in Newspaper Theme panel.
Since I use this option and upload image as Background image, whole content area shrinks and none of its element can be from margin of screen to another one, including stretched rows.
Once I delete Background image, Slide element in stretched row is full size.
See:
http://test.dhmedia.cz/with-background.jpg
http://test.dhmedia.cz/without-background.jpg
So: how to combine full size row (with Slide element inside) with Theme background? Of course background image will be visible only under not full-size rows in such case.
Hi,
Unfortunately for the moment when you are using a background image or color the layout will be box -> https://forum.tagdiv.com/background-introduction/
Now what it can be done, is to uncheck this option -> https://i.imgur.com/Nd93DBu.png fore boxed background from theme panel or apply it directly on row with tagDiv Composer -> https://i.imgur.com/vBzSOkE.jpg for this the row need to be stretch -> https://i.imgur.com/nT7yBlA.jpg then set a background color for columns -> https://i.imgur.com/E4P9KeC.jpg -> https://i.imgur.com/ors9URc.jpg
Hope this will help you!
Thank you!