Copyright 2017 by Themelego   

  

  

 Version 1.0.8 

  

Documentation 

             

http://vckit.themelego.com/ 

Table of content Table of content

I - DOWNLOAD

II - INSTALLATION 1. Install visual composer 2. Install & active Visual Composer Kit plugin

III - CONFIGURATION YOUR WEBSITE List of VCKit’s Elements

IV. PLUGIN OPTIONS:

I - DOWNLOAD 1. Log in to your Codecanyon account, choose "Download" from a menu 

  2. Click "Download" button on item you want to download 

 3. Extract the zip file to your computer  4. Done    

II - INSTALLATION

1. Install visual composer Visual composer is a page builder for wordpress. To use this plugin please install Visual composer first: Codecanyon Visual Composer 

  

2. Install & active Visual Composer Kit plugin Option 1: Use wordpress plugin installer (recommended) Login to your Wordpress admin dashboard >> Plugin >> Add new then: 1. Click "Upload" plugin 

 

 2. Click "Choose file" Then inside the package Visual Composer Kit you downloaded from Codecanyon, choose file visual-composer-kit.zip. 

  3. Click "Install now"  4. Active plugin 

 5. Done     

III - CONFIGURATION YOUR WEBSITE 1. Create a new page with Visual Composer plugin Edit with Backend Editor (or Frontend editor) 

  2. Add Element 

  3. Go to “KIT Addons” tab  

  Details about each addon are below:  

List of VCKit’s Elements  

No. 

Logo  Element  Description  Demo Link  Note 

Interactive 

1 

 

Button Inspiration 

Button with styles & mouse hover effect 

http://vckit.themelego.com/shortcodes/b

uttons/ 

 

2 

 

Interactive Hover 

Creative and subtle mouse hover effect  

http://vckit.themelego.com/shortcodes/in

teractive-hover/ http://vckit.themelego.com/shortcodes/interactive-hover-set-2/ 

 

3 

 

Interactive Navigator 

Navigator bar with hover effect 

http://vckit.themelego.com/interactive-na

vigation/ 

 

4 

 

One Page Navigator 

Navigator bar in one page  

http://vckit.themelego.com/shortcodes/one-page-navigator/ 

 

5 

 

Interactive Notification 

Pop-up notification  http://vckit.themelego.com/shortcodes/interactive-notification

/ 

 

6 

 

Tilt Hover  Mouse hover effect with slight tilt effect 

http://vckit.themelego.com/shortcodes/til

t-hover/ 

 

7 

 

Image Tilt Effect 

Display of images with slight tilt hover effect 

http://vckit.themelego.com/shortcodes/image-tilt-effect/ 

 

8 

 

Image Swap  Display of images with swapping hover effect 

http://vckit.themelego.com/shortcodes/i

mage-swap/ 

 

Basic  

9 

 

Message Boxes 

Display of message in a box 

http://vckit.themelego.com/shortcodes/m

essage-boxes/ 

 

10 

 

Drop Caps  Display of first letter with different styles   

http://vckit.themelego.com/shortcodes/dr

op-caps/ 

 

11 

 

Card Flip  Display of content box in flipping effect  

http://vckit.themelego.com/shortcodes/c

ard-flip/ http://vckit.themelego.com/shortcodes/c

ard-flip-3d/ 

 

12 

 

Separator  Separator with different styles, icons and effects 

http://vckit.themelego.com/shortcodes/s

eparator/ http://vckit.themelego.com/shortcodes/ic

on-separator/ 

 

13 

 

List  Display of content in list styles, with icons 

http://vckit.themelego.com/shortcodes/li

st/  

 

14 

 

Google Map  Display of google map with styles 

http://vckit.themelego.com/shortcodes/g

oogle-maps/ 

 

15 

 

Mailchimp Newsletter 

Display of sign-up form for newsletter with 

styles  

http://vckit.themelego.com/shortcodes/mailchimp-newsletter/ 

*Install MailChimp for Wordpress 

MailChimp for Wordpress first  to use this addon 

*Video: https://www.youtube.com/watch?v=sC763C2xEgg&list=PLqO8BVTBpMDlrzQP4r6pOE7bu0vGhMZ9F&inde

x=13 

16 

 

Image Banner 

Display of image banner with styles  

http://vckit.themelego.com/shortcodes/i

mage-banner/  

 

Advanced  

17 

 

Contact Form 7 

The shortcode which includes the most 

popular contact form plugin. You have to 

import our contact form data.  

Don’t forget import our form. 

http://vckit.themelego.com/shortcodes/c

ontact-form-7/ 

Install Contact Form 7 first  to use this 

addon. The import file can be 

found in your package downloaded from codecanyon 

Extract the downloaded package 

and extract file import.zip ,then find 

a file named: visualcomposerkit.wordpress.xml inside 

it. 

18 

 

Pricing Box  The modern, responsive pricing table for 

wordpress  

http://vckit.themelego.com/shortcodes/pr

icing-box/ 

https://www.youtube.com/watch?v=yDuO1SiCSOQ&index=14&list=PLqO8BVTBpMDlrzQP4r6pOE7bu0vGh

MZ9F 

19 

 

Before After Image 

The before and after image showcase 

http://vckit.themelego.com/shortcodes/before-after-image/ 

 

20 

 

Animation Block 

Just-add-whatever CSS animations (bounce, 

flash, pulse, fade,...) for your elements 

http://vckit.themelego.com/shortcodes/a

nimation-block/ 

 

21 

 

Animated Typing 

Enter in any string, and watch it type at the speed you've set, 

backspace what it's typed, and begin a new sentence for however many strings you've set 

http://vckit.themelego.com/shortcodes/a

nimated-typing/ 

 

22 

 

Instagram Feed 

Show the latest instagram feed. There 

are 4 styles can be used. We've prepared several 

good examples. However, remember that everything depends on 

your imagination.  

http://vckit.themelego.com/shortcodes/in

stagram-feed/ 

 

23 

 

Social Share 

Custom social share buttons with impressive 

hover styles 

http://vckit.themelego.com/shortcodes/s

ocial-share/ 

 

24 

 

Carousel Slider 

Display information in slider format   

http://vckit.themelego.com/shortcodes/c

arousel-slider/ 

https://www.youtube.com/watch?v=iCPGFbD9OM8&list=PLqO8BVTBpMDlrzQP4r6pOE7bu0vGhMZ9F&inde

x=10  

25 

 

Lightbox  Custom the popup/modals with many different styles 

http://vckit.themelego.com/shortcodes/li

ghtbox/  

https://www.youtube.com/watch?v=zYG6YZmgIuI&list=PLqO8BVTBpMDlrzQP4r6pOE7bu0vGhMZ9F&inde

x=12  

Infographics / Misc. 

26 

 

Team Member 

Display of team member information with styles  

http://vckit.themelego.com/shortcodes/te

am-member/ 

 

27 

 

Icon Box  Icon with styles, effects  http://vckit.themelego.com/shortcodes/ic

on-box/ 

https://www.youtube.com/watch?v=5v4BO6rx3Ws&list=PLqO8BVTBpMDlrzQP4r6pOE7bu0vGhMZ9F&inde

x=4 

28 

 

Testimonial  Testimonials is a clean and easy-to-use 

testimonials show on your site. 

http://vckit.themelego.com/shortcodes/te

stimonial/ 

* Install Testimonials by WooThemes Testimonials by 

WooThemes first to use this addon. 

*Video: https://www.youtube.com/watch?v=1Lza5VdX6C8&index=11&list=PLqO8BVTBpMDlrzQP4r6pOE7bu0vGh

MZ9F 

29 

 

Count Up  Display your statistical data in count-up format, 

with icons 

http://vckit.themelego.com/shortcodes/c

ount-up/ 

 

30 

 

Countdown  The countdown element to count down specific 

day. 

http://vckit.themelego.com/shortcodes/c

ountdown/ 

 

31 

 

Counter Circle 

The easy pie chart element 

http://vckit.themelego.com/shortcodes/ci

rcle-counter/ 

 

32 

 

Video Modal 

The lightbox video to show your youtube, 

vimeo video. 

http://vckit.themelego.com/shortcodes/vi

deo-modal/ 

 

33 

 

Progress Bar 

Display your progress as horizontal bars with 

different colors & styles 

http://vckit.themelego.com/progress-bar/ 

 

34 

 

Heading Effects 

Custom your title and heading text with some 

impressive effects 

http://vckit.themelego.com/shortcodes/h

eading-effect/ 

 

35 

 

Heading Gradient 

Transform your title and heading text color with 

gradient effect  

http://vckit.themelego.com/shortcodes/heading-gradient/ 

 

Grid 

36 

 

Samsung Grid 

Display your grid with special 3 appearance 

effects 

http://vckit.themelego.com/grids/samsun

g-grid/ 

https://www.youtube.com/watch?v=PwWxT607gSs&index=5&list=PLqO8BVTBpMDlrzQP4r6pOE7bu0vGh

MZ9F 

37 

 

Elegant Grid  Display your content in custom grid layouts with 8 appearance effects 

http://vckit.themelego.com/grids/elegant-

grid/ 

https://www.youtube.com/watch?v=aJ3xWg3nHFg&index=9&list=PLqO8BVTBpMDlrzQP4r6pOE7bu0vGh

MZ9F 

38 

 

Interactive Grid 

Display your content in custom grid layouts with 30 subtle mouse hover 

effects 

http://vckit.themelego.com/grids/interacti

ve-grid/ 

https://www.youtube.com/watch?v=I3aIkDNLCTw&list=PLqO8BVTBpMDlrzQP4r6pOE7bu0vGhMZ9F&index

=7 

39 

 

Magazine Grid 

Displays your various in pop-up post and various 

options 

http://vckit.themelego.com/grids/magazi

ne-grid/ 

https://www.youtube.com/watch?v=AP8DCu-dNZ0&index=6&list=PLqO8BVTBpMDlrzQP4r6pOE7bu0vGhM

Z9F 

40 

 

Google Grid   Display your content grid in Google Search 

style 

http://vckit.themelego.com/grids/google-

grid/ 

https://www.youtube.com/watch?v=-MM3WETJT6I&list=PLqO8BVTBpMDlrzQP4r6pOE7bu0vGhMZ9F&inde

x=8 

 4. Save changes and Publish! All done! 

IV. PLUGIN OPTIONS: 1. Hover to Visual Composer panel

2. Click Addons KIT

V. STAY UPDATE & RATING Thank you for purchasing our passionate work. We’re working hard to bring more features and better UX into each new version of VCKit. So make sure that you have checked the box “Get notified by email if this item is updated” of VCKit on your Downloads page on Codecanyon.

Download page example

Additionally, if you like VCKit, please rate it on the same Downloads page. We really wish to hear your feedback about our product.

It means a lot to us and gives us enormous motivation to do other great work for you. Thank you and enjoy now!