Element Hook
Inside plugin’s index.php
file use vcv:api
hook for any API call. To add an element you need to pass a path to manifest.json
file and URL to the base directory of your element (see WordPress plugin example.)
index.php
file with hook example with a single element:
index.php
file with hook example with a single element:
<?phpadd_action( 'vcv:api', function ($api) { $api->elements->add( '/var/www/absolute/path/to/element/myelement/manifest.json', 'http://mywordpress/url/to/element/basedirectory' ); });
index.php
file with hook with 3 elements:
<?phpadd_action(/** * @param $api \VisualComposer\Modules\Api\Factory */ 'vcv:api', function ($api) { $elementsToRegister = [ 'logoSuperTest', 'textTest', 'imageGalleryWithTestZoom', ]; $pluginBaseUrl = rtrim(plugins_url(basename(__DIR__)), '\\/'); /** @var \VisualComposer\Modules\Elements\ApiController $elementsApi */ $elementsApi = $api->elements; foreach ($elementsToRegister as $tag) { $manifestPath = __DIR__ . '/elements/' . $tag . '/manifest.json'; $elementBaseUrl = $pluginBaseUrl . '/elements/' . $tag; $elementsApi->add($manifestPath, $elementBaseUrl); } });
manifest.json
file example:
{ "elements": { "imageGalleryWithTestZoom": { "settings": { "name": "Image Gallery With Test Zoom", "metaThumbnailUrl": "[publicPath]/image-gallery-with-zoom-thumbnail.png", "metaPreviewUrl": "[publicPath]/image-gallery-with-zoom-preview.png", "metaDescription": "A grid type image gallery with a test zoom effect upon hover to catch visitors' attention." } } }, "categories": { "Image gallery": { "elements": [ "imageGalleryWithTestZoom" ] } }}