This document discusses building custom elements for the Visual Composer page builder plugin. It explains that while Visual Composer comes with many elements out of the box, you can also build your own custom elements using PHP and the vc_map function. It provides examples of how to build custom elements for team member profiles that are filterable grids with images and text. The document encourages building reusable custom elements that are fast, efficient and scalable.
Hi
My name is Burak
Today I am gonna talk about Building Custom Visual Composer Elements.
I am a mechanical engineer, I built a tunnel which connects Europe and Asia.
Also I have been doing software development for more than 10 years.
I decided to quit mechanical engineering at top of my career to pursue another challenge
and moved to beautiful San Diego 3 years ago.
Please bare with my accent, I am Turkish.
I am a javascript guy, but also I am in love with WordPress.
I am helping big agencies on their development jobs also I have my own clients.
Also it supports these plugins and there are over 200 addons you can buy from their marketplace.
Anyway, these addons may not fit your design well, or what is in your mind.
In this kind of situations, you can use built in Advanced Grid Builder or Shortcode Mapper.
Or you can build your own custom elements.
To build a custom element or customize one, Visual Composer API provides the vc_map function.
Also it has a parameter where you define what is in the element editor.
Number 1: Categories
Number 2: Name of the element
Number 3: Description of the element
Number 4: Icon
And this is the element settings window. Each of these sections is another array of parameters of the params parameter.
vc_map function allows us to add an element to the elements list.
As you see on line 4, there is an action to the vc_before_init Visual Composer hook, so our function will be called before Visual Composer init.
Also we need the shortcode to display our element.
We use the base parameter as the shortcode tag to connect our shortcode with our element.
There are different approaches you can follow to add a custom element. You can add it to your theme’s function.php file.
Or you can create a plugin.
We want to build things
FAST
EFFICIENT
SCALABLE
And RE-USABLE
SO…
We can hang out at the beach at weekends, or watch a movie with our friends at night
instead of spending time in front of the screen.
