Topic: svBuilderPro & Wordpress

I can't figure this out. I've read lots of posts but the responses are incomplete, and there is no "Embedding in a WordPress Site" section on this page: http://www.simpleviewer.net/simpleviewe … dding.html

I used svBuilderPro in another WordPress installation but I created a separate html page, wrote a div in an html section of my WP page, and linked to the separate html page that contained the sv javascript.

Now I have a WP installation and I want to have several albums/galleries on one WP page. So I need an album cover/image to represent each gallery on the WP page that, when clicked, opens up the associated sv lightbox.

I don't want to have separate html pages for each gallery.

How can I click on an image and have it open the sv javascript?

Does that make sense?

Thanks for your help!

Re: svBuilderPro & Wordpress

there is no "Embedding in a WordPress Site" section

Embedding a SimpleViewer gallery in a WordPress page is essentially the same as embedding a SimpleViewer gallery in any other HTML or PHP page.
I would recommend using the baseURL method of embedding, i.e. uploading complete gallery folders (not just their contents) and following the instructions here.

Now I have a WP installation and I want to have several albums/galleries on one WP page. So I need an album cover/image to represent each gallery on the WP page that, when clicked, opens up the associated sv lightbox.

I don't want to have separate html pages for each gallery.

You can certainly have multiple galleries on the same page but SimpleViewer does not provide functionality whereby a 'cover/image to represent each gallery' can be clicked for the gallery to spring to life. Also, there is no built-in Lightbox functionality.

If you just wanted to have two galleries on the same page, the following example would work.
Say you have two gallery folders named 'gallery1' and 'gallery2' and you uploaded both folders to the root of your web domain (in this example named 'www.example.com'). The embedding code you would use would look like this:

<script type="text/javascript" src="http://www.example.com/gallery1/svcore/js/simpleviewer.js"></script>

<script type="text/javascript">
var flashvars1 = {};
flashvars1.baseURL = "http://www.example.com/gallery1/";
simpleviewer.ready(function () {
simpleviewer.load("sv-container1", "100%", "100%", "222222", true, flashvars1);
});
</script>
<div id="sv-container1"></div>

<script type="text/javascript">
var flashvars2 = {};
flashvars2.baseURL = "http://www.example.com/gallery2/";
simpleviewer.ready(function () {
simpleviewer.load("sv-container2", "100%", "100%", "222222", true, flashvars2);
});
</script>
<div id="sv-container2"></div>

The things to note are:
(1) You need only load one instance of 'simpleviewer.js' per page.
(2) Each gallery must have a unique 'flashvars' variable name.
(3) Each gallery must be embedded into a <div> with a unique name.

If you wanted to use a placeholder for each gallery and open each gallery in a lightbox, a suitable lightbox script capable of displaying a SimpleViewer gallery is Shadowbox.
You would then:
(1) Upload each gallery folder in its entirety (as above).
(2) Insert an image into your page for each gallery and link each image to the corresponding gallery's 'index.html' file using standard HTML <a> tags and the Shadowbox 'rel' attribute as documented on this page.

Steven Speirs
SimpleViewer Support Team.