Wordpress Gallery Video Tutorial


How to Create Wordpress jQuery Gallery (Step-by-Step)

1) Download VisualLightBox wizard program for Windows or Mac from:
http://www.visuallightbox.com/visuallightbox-free-setup.zip

2) Create an image gallery in VisualLightBox program and click "Publish" button, select "Wordpress plugin" as a publishing method:

Wordpress Plugin

3) Install and activate the created module – wordpress.zip as WordPress plugin:

Install Wordpress LightBox Plugin

4) Visual LightBox menu will appear. Go to Visual LightBox -> All Galleries and copy the shortcode of your gallery:

LightBox shortcode

5) Add the shortcode inside the page (or post) where you want your gallery to appear:

Wordpress page

6) Preview changes:

Wordpress preview

7) Use Visual LightBox menu Visual LightBox -> Add New to add each next gallery.


FAQ

Q: I've recently ordered VisualLightBox. Now I want to add it in Wordpress header. How i can do this?

A: To insert VisualLightBox into header you should use VisualLightBox PHP code.

Go to
VisualLightBox -> All galleries

and click on "Excerpt view" button at the top right corner. Additional line "for templates" with php code will appear under line with shortcode. You should add this php code into your header (Appearance->Editor->Header) into the place where you want your gallery to appear, for example:

<?php visuallightbox(1); ?>

Q: How to add VisualLightBox in Wordpress widget?

A: You should install a special plugin that allows to add php code into text widget firstly. For example, "daikos-text-widget":
http://wordpress.org/extend/plugins/daikos-text-widget/

After that go to
VisualLightBox -> All galleries

and click on "Excerpt view" button at the top right corner. Additional line "for templates" with php code will appear under line with shortcode. You should add this php code into "daikos-text-widget", for example:

<?php visuallightbox(1); ?>

Q: How can I change the DOCTYPE declaration for universal compatibility in Wordpress?

A: You should select
Appearance -> Editor
and change "header.php" from templates in the right column.

Q: Is it possible to make changes (add/delete images, change template or thumbnail theme) directly in Wordpress?

A: No, it's impossible. You should make all changes in VisualLightBox application and generate a new module.

Q: My menu (or slideshow, or any another element) is visible through VisualLightBox pop up window. How can I fix it?

A: It seems "z-index" problem. "z-index" value of your menu should be less than "z-index" value of VisualLightBox. "z-index" value of VisualLightBox is 200. So, you can:
1) Decrease "z-index" value of your menu.
2) Or increase "z-index" value of VisualLightBox. You can do it manually in "visuallightbox.css" file. You can find it in the following folder on your server "wp-content\uploads\visual-lightbox-plugin\ID", where ID is identificator of your gallery.
Open this file in any text editor (for example "Notepad") find following lines:

#vlb1lightbox{
position:absolute;
top:20px;
left:0;
width:100%;
z-index:200;
 text-align:center;
color:#151410;
line-height:0;
}

and replace "200" to a greater value. New value should be greater than "z-index" value of your menu.
If problem will persist, please contact with customer support at Mail. Provide us a direct link to your webpage with a problem.