ACF-VC Integrator is a plugin that adds an element to the ultra-popular Visual Composer allowing it to display fields created with the Advanced Custom Fields plugin.
Your first thought might be the Advanced Custom Fields plugin has its own integration with the Visual Composer plugin. So why then is ACF-VC Integrator needed? ACF provides limited functionality and doesn’t display many fields in the best manner. For example, it doesn’t show images, create links, display maps, etc. The ACF-VC Integrator utilizes these ACF fields and allows VC to display the fields in the best way possible.
Installing the plugin is as simple as it gets. Of course it requires both ACF and VC to be installed. It doesn’t give you the links for them but it will inform you if you’ve installed ACF-VC before one of the others. After installation there is no setup required because it’s already integrated with both plugins.
Using ACF-VC Integrator is simple. When you select to add an element in VC you get a window with lots of choices. Typically this is where you would choose Advanced Custom Field as your option. Next to that is another choice: ACF-VC Integrator. Select this one instead.
Most of the settings for the element looks the same as it would if you had chosen Advanced Custom Field but there is one more field – Custom Link Text. This allows you to provide a custom text for File Objects and Link Pages. This text will display in place of the default text. For example you can either provide the name you want it to display, such as the name of a page, or leave it blank and it will show the word Link by default.
You choose your settings exactly the same way you would if you were using ACF. ACF-VC Integrator will display the field according to its pre-defined design, so there’s nothing you need to do differently. ACF-VC works with both the backend and frontend VC editors.
Testing the Plugin
At first glance ACF-VC looks the same as ACF. When you place them within a VC grid the options mostly look like the same plugin. The difference is seen when you preview the page or post. It’s the way the content is output that’s different. There are a few items that display the same, but those that are different are drastically different.
To see what these differences are I created several test posts to compare the ACF plugin output with that of the ACF-VC plugin. I added both plugins within the VC grid to show the results together. ACF will display on top while ACF-VC will display on the bottom.
I created a test post using a Google map. The map from ACF doesn’t even display. The map using ACF-VC displays perfectly. All of the Google Maps features are here including zoom, scroll, directions, earth view, and more. This is one of the easiest ways to add a Google Map that I’ve seen.
I uploaded a few free images that I downloaded from unsplash.com and created an Image custom field. You can see the image provided by ACF just gives the name and URL while the image provided by ACF-VC actually shows the image itself.
I uploaded a file and posted it using both plugins. The results from ACF doesn’t allow me to download the file. Instead it gives me the URL for the file within a string of text that includes other information. In order to download the file I would need to copy the address portion of the string of text and paste it into my address bar.
On the bottom is the result from ACF-VC. This one actually gives a clickable link where I can download the file. When I clicked on it the file downloaded automatically. I went back in and provided a custom link text (the name of the file) and now my custom text displays instead of the word Link.
As you can see with the color picker, ACF only gives the hex value while ACF-VC shows the value and shows the color, making it far more useful and user friendly. It isn’t live and clickable, but that’s not its purpose. It’s used to provide you with the color that was specified in the field. Having the color show is far more useful than only seeing the hex code.
When displaying Page Link, the ACF plugin shows the actual URL as a string of text. The URL is not clickable, so if I wanted to visit that page I would have to copy and paste the URL into the address bar of my browser. The ACF-VC plugin shows the custom text that I added in the Custom Link Text field and it is a clickable link. If I don’t use custom text it will show the word Link by default.
True / False
As you can see for True / False, ACF didn’t show any results while ACF-VC displayed the word False (or the value that is set in the field).
Using ACF to display Relationship crashed my website. All content under the post title was a black space and my site had no menus. No other posts would display. I had to remove it from the VC grid to get my site working again but I left the text block to show where it should appear. ACF-VC displays links to the pages with no trouble.
Just like Relationship, using ACF for Post Object crashed my website while ACF-VC displayed a clickable link perfectly.
For the User field ACF provided too much information and it was jumbled together, making it not very useful. It included dates, times, admin labels, email address, user icon, etc. I’m sure showing the icon would be useful but not the rest of the information. ACF-VC gave the admin label and that’s all. This was much cleaner and the information is easier to use. I think it would be even more useful if the user name was clickable, but it’s still more useful than the results from ACF.
Taxonomy displays any category you choose. Using ACF you get the number assigned to that category. In my opinion that’s not very helpful. Using ACF-VC you not only get the name of the category but it’s also a link that displays every post for that category when clicked. This is by far more useful than displaying the number of a category.
Fields With No Changes
ACF-VC doesn’t modify the results of every field-type, so there are several fields that display the same in both plugins. They include:
- Text Area
- Select Field
- Radio Button
- Date Picker
There are a few things I couldn’t get to display with either plugin. These include:
These are under the Layout area for ACF and might not be intended to work the way I was using them.
There isn’t any documentation for ACF-VC Integrator. You just need to know how to use both ACF and VC in order to benefit from this plugin. I do think that some information would be helpful though. For example, I would like to see the information about ACF-VC’s capabilities and advantages displayed on the WordPress Plugin page.
A comparison chart and images would help users understand the advantages of the plugin. As it is you can’t really tell why you would use this plugin over just using the Advanced Custom Fields plugin with Visual Composer. Installation instructions are included at the WordPress plugin page.
Advanced Custom Fields is a useful plugin, but its integration with Visual Composer lacks features. ACF-VC Integrator adds a lot of useful functionality to the way Visual Composer uses the Advanced Custom Fields plugin. It’s as easy to use as using ACF and its output is cleaner and far more useful than just using ACF alone with VC. ACF-VC is a must-own plugin for everyone that uses ACF within VC.