I am trying to:
I have updated several sites where i have toolset views on. It messed up the layout of the views. So i restored it to a previous version.
Link to a page where the issue can be seen:
I have found the issue what is causing it and fixed it on a few websites. It are live websites so i can not leave the problem there.
I expected to see:
That everything would be the same after updating.
Instead, I got:
Views that had changed ID's and styling.
On one website i have still version 3.0.2 installed. If i update it it messes up the styling i did on the views. So on 3.0.2 everything if fine.
After updating the views to the current version it chnages the ID's of the views. For example: The ID is #wpv-view-layout-107-TCPID2. I target that ID to apply styling. After updating that ID is changed. On the sites that i fixed i just changed the ID but i have more sites and it is a lot of work. Especially on one site where i have a lot of views!
Can you update the views plugin so it doesn't change the ID of the views that are already created?
Here is the feedback from our 2nd tier supporters:
That HTML div ID is for Views AJAX features(pagination, search), you can do is not rely on internal IDs, it might be changed in future version of Toolst plugins.
You might consider other workaround, for example, wrap the view cell into a div tag, specific the div tag's ID and CSS class.
That's not good news. Would have loved to know that before i did all those website's. And maybe make sure other users know not to to use the ID of the view for styling!
I am not using Layouts. I am using Oxygen Builder and use views a lot to show custom post type's. Oxygen uses Flexbox and is amazing. So what i do is create a view, display all results and choose unformatted in the loop wizard. Then i use the view shortcode in Oxygen.
For styling i use the selector detector in Oxygen. So i select the ID of the view (example:#wpv-view-layout-107-TCPID2) and use display:flex to use flexbox, show in a row and start styling. Never imagned that toolset will change those ID's. Not very happy about that...
This will involve a lot of work if i want to update views to the new version on all the site's that i did.
Sometimes i use the class .js-wpv-view-layout to make all views display:flex. But sometimes i need different layout option for different views then i will target the ID of the view. Will this class (.js-wpv-view-layout) also be changed in future updates? I hope not..
Yes, i can wrap the view in a div and then traget like this from now on: #div .js-wpv-view-layout That should work but i need to change it on all sites i did... ;(
No, the CSS class ID "js-wpv-view-layout" won't be changed in the future, this is built-in feature for styling Views, so you can use it to style view's result.
I raised this with the developers who acknowledge that the code that adds the suffix to the ID was refined in Views 3.1.0, while also confirming that as a dynamically generated value it is liable to change from time to time and so should not be relied upon for targeting with CSS or JS.
All I can do is apologise where this involves you making updates on existing sites to change how you target these Views, and I'm sorry for the extra work that implies.
I still think it's strange that it changes already existing ID's of views. Especially because lots of us developers will target the ID or Class to style the views.
But it is just the way it is and from now on will only target the class of a view instead of the ID. Just wish i had known that before. 😉
It is going to take me a couple of days to change all the sites i did.. Unless i just stop updating views but that's not really an option.
Anyway thanks for your reply and will be more carefull in the future.
