Hi, I finally fixed the pagination view it is now on our homepage eathb.com, the problem now is that the view for mobile view is too cramped cause the desktop view is with 3 columns, and I created a single column view for Mobile view, but both view are appearing on desktop view, on mobile view the correct Mobile view shows and not both views.. I am using DIVI so I disabled the mobile view for the section on desktop view but it still appears.. any suggestion how I can get the views to not show at the same time on desktop view?
I'm guessing that the "mobile" version is set to display on mobile-upwards and not just mobile, hence it appears on mobile size and larger sizes (including desktop), whereas the "desktop" version appears only on desktop-upwards, and hence not on mobile.
But when I look at the advanced settings for a Divi module it says which devices to disable on (screenshot), so you could disable the mobile version on desktop, for example.
Can you clarify where you are setting the visibility?
I don't know for sure how Divi disables modules according to screen size, but I expect that it is simply through media queries which visually hide the content. The content is still downloaded by the browser, however, which is not ideal. A better solution would be to have a single View where the output is responsive. We use the Bootstrap grid for this, but Divi is incompatible with Bootstrap, and so it is not an option. You could either roll-your-own CSS grid for this case, or use your browser tools to inspect the markup and classes that Divi uses for a responsive grid (it surely has one) and then recreate that for the format of the output of your View.
There is a glitch in your system using DIVI, no matter how I disable the mobile view on home page, I even add it as css to not show on desktop view, it works the first time I refresh then after refreshing the 2nd time there it is again. See the bootstrap as you say is not available on DIVI. Are there other ways to show two different version of the views on the same page??
Right now I deleted the mobile version, and the view left is the desktop view that is ugly on mobile view
The two views I have created are:
View with pagination mobile view
View with pagination
I'm not sure what you are doing to hide the Views on different screen sizes.
I edited your homepage.
I found the code module at the end where the View is inserted. I edited it and in the advanced settings chose to hide this module on phones.
I then added another code module with the same content, but I inserted the text "search" before the View so that I could see the difference. In the advanced settings I chose to hide this module on tablets and desktop.
I then visited the front end, resized the browser, reloaded the page a few times, and it worked as expected. I see the second module on phone-sized screens, and the first module on larger screens.
I am trying to show a different view on mobile which is set to show 1 column on search filters and 1 column on the listed businesses. I just checked and it is still showing both views on desktop view..
It seems that the latest Divi has compatibility issues with toolset.. do you have suggestion on what DIVI version is compatible with toolset, Does toolset work well with beaver builder theme? any suggested theme for the bootstrap to work?
We have a compatibility layer for the Beaver Builder plugin, nothing specifically for the theme but I believe it works well with Toolset (I know plenty of clients use it).
On the recommended themes page the simpler themes such as OceanWP, Astra, and GeneratePress all work well with Toolset with Bootstrap active, and were you to use one of those themes you could use the Bootstrap grid output format and need only a single View.
