One side of the coin – Visual Composer
As an end product, the idea of Visual Composer is positive. It’s a drag/drop tool that can be used to easily create posts/pages in WordPress – an extension of the existing tools. In fact, it is packaged in my upcoming theme – BluePrint-Q.
A week or two ago, I found that the image widget that VC provides does not display the originally-sized image when the thumbnail is clicked upon. As a result, I put in a ticket to VC and explained the problem. In short, if you are trying to show the original image on your page, why would you ever want to click on it to show a shrunk-down version of the same image?! A “Tier 1” customer service person responded, agreed with me, and said that he would pass it on to the dev team.
Fast forward to a few days ago – I upgrade from 4.2.3 to 4.3.3. First thing I notice – all of the VC rows are broken. Specifically, they all have small heights and just look like they float behind the contents they are meant to visually contain. I did some tests going back-and-forth between the two versions and took some screenshots. Also, I made a sample page with no header, no footer, and one row just to bring this down to a super-simple test. I even went through all of my LESS to find any occurrences of VC classes. At this point, I put in a ticket to VC, explained what I was seeing, and shared the screens/test too. I noticed that a few of the classnames had changed with this upgrade and pointed that out. The response I received was this:
in version 4.3.0 we adopted new naming of Bootstrap and changed the classnames in order to keep everything up to date. This is why you need to align your changes to the new classnames and everything will work just fine.Understand your pain totally, but these improvements makes VC a lot better and more resistant against possible conflicts caused by other plugins.Thanks,Michael
So, I was a bit disappointed that there was no effort on VC’s part to help correct the problem. More specifically, there was no apparent interest in improving the stability of their own product. And “Michael” is the CEO of the company too?!
I was determined to figure out what in the world happened. It was a nightmare to debug CSS, but positively determined that the problem resided in VC’s CSS – not mine. To be clear, VC’s main CSS file is around 3000 lines long – this was not a quick read. Researching even deeper and playing around with Chrome, it eventually clicked with me that I was looking at a ‘clearfix’ issue.
If you look in the 4.2.3 CSS, you will see these blocks:
.vc_row-fluid:before,
.vc_row-fluid:after {
display: table;
content: "";
}
.vc_row-fluid:after {
clear: both;
}
And if you look in the 4.3.3 CSS, you will notice that the selector has been replaced with:
.vc_row:before,
.vc_row:after {
display: table;
content: "";
}
.vc_row:after {
clear: both;
}
However, the ‘vc_row’ element does not generate a ‘vc_row’ class – it generates a ‘vc_row-fluid’ class in both 4.2.3 and 4.3.3!
Specifically, here is what I added to my own LESS to correct VC (another version of the clearfix):
.wpb_row:after {
clear: both;
content: ".";
display: block;
height: 0;
line-height: 0;
visibility: hidden;
}
I could have used ‘.vc_row-fluid’, but the markup that VC generates always seems to pair it up with ‘.wpb_row’, so why not?
The other side of the coin – Revolution Slider
On the flipside, Revolution Slider is another plugin that displays sliders (the kind with big visuals – not the jQuery numeric kind). Again, this is a plugin that I am including with my theme – BluePrint-Q. I’ve used a few sliders previously and what sets this apart from the others is a wonderful visual interface for constructing slides right in the WordPress administrative area.
Maybe a month ago or so, I noticed that the animations for my images were not playing any longer. Specifically, I had some images flying in from various directions one day and the next day, those same images were simply fading in. I put a ticket in to Revolution Slider and explained the problem. Within 24 hours, I received a response that said they fixed the problem and made a patch release immediately. All I did was download, update, and voila – it worked!
Takeaways
There are a number of lessons to be noted by these experiences:
- ‘Premium’ and top-selling plugins translates to awesome end products. The support and quality of code is not directly related.
- Be aware that you have next-to-zero control over a plugin created by someone else. For BluePrint-Q clients, this is not an issue since I deal with these sorts of things before making releases.
- Which plugins need to align with which other plugins? And why does alignment imply destruction on the API?
- I have always adopted what I think Revolution Slider does – be responsive and helpful. Doing so means a better product and happier customers.
Yea, there’s another story about the PHP in VC too. It’s really more generalized to the WordPress hook system and the use of PHP classes. If you are interested to learn more, ping me.