Topic: Wordpress theme integration

Hi there, I've just purchased SimpleViewer Pro in order to power a gallery that appears within a 'page template' in Wordpress. I included the 'simpleviewer.js' just fine using the below in my header file

<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/images/room-gallery/gallery/svcore/js/simpleviewer.js"></script>

However, because the URL of the page is:

www.sitename.com/gallery

simpleviewer is trying to load the xml from

www.sitename.com/gallery/xml?

instead of the correct location.

Do I really need to include simpleviewer using an iframe or is there another way around? I installed the official simpleviewer plugin and updated it to Pro but that only allows me to use the wordprss gallery or flickr as an image source, not my custom folder?

Your help would be much appreciated, thank you in advance.

Re: Wordpress theme integration

You can point SimpleViewer towards a 'gallery.xml' file by using the galleryURL option which can be an absolute or relative (to the HTML document embedding SimpleViewer) URL.
http://simpleviewer.net/simpleviewer/pr … .html#html

This value is passed to SimpleViewer via a flashvar Embed Code Parameter.
http://simpleviewer.net/simpleviewer/su … tml#params

Your embedding code would look something like this:

<!--START SIMPLEVIEWER EMBED.-->
<script type="text/javascript" src="svcore/js/simpleviewer.js"></script>
<script type="text/javascript">
var flashvars={};
flashvars.galleryURL="<?php bloginfo('template_url'); ?>/images/room-gallery/gallery/gallery.xml";
simpleviewer.ready(function () {
simpleviewer.load("sv-container", "100%", "100%", "222222", true, flashvars);
});
</script>
<div id="sv-container"></div>
<!-- END SIMPLEVIEWER EMBED -->
Steven Speirs
SimpleViewer Support Team.

Re: Wordpress theme integration

because the URL of the page is: www.sitename.com/gallery simpleviewer is trying to load the xml from www.sitename.com/gallery/xml?

That should not be the case. Are you sure?

Also you could try using the WP-SimpleViewer wordpress plugin to handle your galleries: http://www.simpleviewer.net/simpleviewe … pleviewer/

Felix Turner
SimpleViewer Support Team.

Re: Wordpress theme integration

Thanks for the prompt response guys.

i'm nearly there with the gallery, the galley now loads up thanks to the code provided by Steven Speirs, I just changed the location of the .js

<!--START SIMPLEVIEWER EMBED.-->
<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/images/room-gallery/gallery/svcore/js/simpleviewer.js"></script>
<script type="text/javascript">
var flashvars={};
flashvars.galleryURL="<?php bloginfo('template_url'); ?>/images/room-gallery/gallery/gallery.xml";
simpleviewer.ready(function () {
simpleviewer.load("sv-container", "100%", "100%", "222222", true, flashvars);
});
</script>
<div id="sv-container"></div>
<!-- END SIMPLEVIEWER EMBED -->

The flash is now loading but the images are still being loaded from the currently viewed  url rather than the path specific to th e flash vars or .js url.

Luckly I've persuaded the client to go towards the FlickR route, and just to confirm the code above DOES work perfectly fine when loading flickR gallerys.

Thanks

Re: Wordpress theme integration

I've fixed it, I was missing:

flashvars.baseURL = "<?php bloginfo('template_url'); ?>/images/room-gallery/gallery/";

Final working code:

<!--START SIMPLEVIEWER EMBED.-->
<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/images/room-gallery/gallery/svcore/js/simpleviewer.js"></script>
<script type="text/javascript">
var flashvars={};
flashvars.galleryURL="<?php bloginfo('template_url'); ?>/images/room-gallery/gallery/gallery.xml";
simpleviewer.ready(function () {
simpleviewer.load("sv-container", "100%", "100%", "transparent", true, flashvars);
});
</script>
<div id="sv-container"></div>
<!-- END SIMPLEVIEWER EMBED -->

Re: Wordpress theme integration

I can't find a gallery.xml file in the files... I assume it should be my 1.xml file but I get a Gallery XML Not Found message when I use this.  Do you see what I'm doing wrong?

<!--START SIMPLEVIEWER EMBED.-->
<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/wp-content/plugins/wp-simpleviewer/svcore/js/simpleviewer.js"></script>
<script type="text/javascript">
var flashvars = {};
flashvars.baseURL = "<?php bloginfo('template_url'); ?>/wp-content/uploads/1.xml";
simpleviewer.ready(function () {
simpleviewer.load("sv-container", '685px', '465px', "ffffff", true, flashvars);
});
</script>
<div id="sv-container"></div>
<!-- END SIMPLEVIEWER EMBED -->

I should have said that I'm trying to embed this gallery into my custom template so I can't use the shortcode.  With the shortcode it will work in the page just not where I want it to go

Last edited by dandelionweb (2011-06-15 00:46:44)

Re: Wordpress theme integration

@dandelionweb

The PHP code was unique to the original poster's web site and is not part of the standard WP-SimpleViewer embedding code.
You can use normal absolute or relative (to the page containing the embedding code) URLs to point to the 'simpleviewer.js' file and your gallery's XML file.
If using WP-SimpleViewer to create your gallery, ensure that the '/wp-content/uploads/' folder exists and has full access permissions (777).
An alternative to WP-SimpleViewer (as it sounds like you may not be using it exactly as it was intended) would be for to create your gallery with svBuilder-Pro, upload your gallery folder to your web server and embed your gallery using one of these 2 methods.

Steven Speirs
SimpleViewer Support Team.

Re: Wordpress theme integration

I am using the WordPress plugin I don't want to use svBuilder ... I just want to know the code to put in the custom template php page instead of using a shortcode within the WordPress page.  I tried the code I posted above but I get a gallery XML file not found message when I try this.

I guess that the plugin is only designed for use with the shortcode.  I'll rethink my theme template.  Thanks for your help.

Last edited by dandelionweb (2011-06-15 19:23:00)

Re: Wordpress theme integration

WP-SimpleViewer creates a standard SimpleViewer gallery.
You can use the recommended embedding code (found here) to embed the gallery.
All you need to do is point to the 'simpleviewer.js' file which can be found here: 'wp-content/plugins/wp-simpleviewer/svcore/js/simpleviewer.js'
... and the gallery's XML file via a galleryURL, which can be found in the 'wp-content/uploads/' folder.
You'll need to know the gallery_id in order to find the correct XML file whose name will be in the form 'gallery_id.xml'.
Your embedding code might look something like this:

<!--START SIMPLEVIEWER EMBED.-->
<script type="text/javascript" src="http://www.example.com/wordpress_folder/wp-content/plugins/wp-simpleviewer/svcore/js/simpleviewer.js"></script>
<script type="text/javascript">
var flashvars={};
flashvars.galleryURL="http://www.example.com/wordpress_folder/wp-content/uploads/1.xml";
simpleviewer.ready(function () {
simpleviewer.load("sv-container", "100%", "100%", "222222", true, flashvars);
});
</script>
<div id="sv-container"></div>
<!-- END SIMPLEVIEWER EMBED -->
Steven Speirs
SimpleViewer Support Team.