KRPano Wordpress Shortcode 2010 (old)

  • 03/2011 - this plugin is now updated to a new version: PanoPress

    Jan 2011 - this code has been updated to a new version with iphone/ipad support, go here for the new code

    this shortcode allows easy adding of individual krpano panoramas (not multi-pano tours) to a wordpress site by uploading 2 files, pano-name.jpg for a preview image & pano-name.mov for pano display via krpano.swf

    the shortcode is used like this - [krpano file="pano-file-name" title="Panorama Title"]

    all pano images are displayed using a single pano.php & a single pano.xml file, as the pano file name is specified in the shortcode and passed as a php var to the pano.php file for display

    the "file" parameter is the name of the pano you wish to display, and these files should be named identically like apple.mov & apple.jpg - these files are uploaded via ftp as in the image below

    or you could change your wordpress settings to allow upload directly to the pano folder via the wordpress post media upload box, make sure to turn off "organize files by date"

    this will result in the jpg file being displayed on your wordpress page, and clicking on this jpg will open a page displaying the .mov file via krpano - the link is set to target="_blank" so the pano page will open in a new window, or you could change this to use one of the various lightbox clones, as i do on my site

    here is an example of the result on my site - http://www.samrohn.com/360-panorama/audubon-terrace-nyc/

    first, set up your directories inside wp-content like this -

    pano.xml is your custom xml file which will be common to all panos, use this for nav buttons etc, but pano images will be specified by the shortcode, do not add them to the xml

    create a new text file, name it pano.php, paste in the following and upload it to the directory you created earlier

    this file will receive the file name var from the shortcode, and insert it into the qtvr .mov file name on line 19

    then paste the following code into your wordpress installations functions.php file just after the opening <?php tag

    note the " pano.php?pano='.$file.' " bit on line 11, this feeds the pano filename as a php var to the pano.php file

    also note the target="blank" & empty class="" element on the same line, these can be altered to suit your site

    boom, thats it :)

    adding other vars like pan tilt & zoom or custom xml per pano to all this is pretty simple

    this works with the latest wordpress 3.0.1 & krpano 1.0.8.11 + swfkrpano.js

    i still need to figure out iphone/ipad integration, thats up next -

    enjoy :)

    sam

  • Great Sam,

    a lot of people gonna love this.

    Thanx for the input!!!

    Cheers,

    Tuur *thumbsup*

    PS: not finished yet.. http://www.virtualtuur.com/tzigane/NY_TL/

  • thanks, i was previously using 3 separate wordpress plugins to accomplish this, and the existing wp-krpano plugin did not exactly suit my needs -

    i still need to figure out how to specify the iphone/ipad images in the swf.addVariable section of the pano.php file, any idea how to specify child nodes in javascript ?

    sam

  • i was asked a question about this code via PM, much better to ask in this thread so that others may benefit from the answers etc, please post any questions about this code here rather than PM or email - thanks :)

    some proficiency with using & coding krpano & customizing wordpress etc is probably required for making this work, prob a good idea to go through some basic tutorials on setting up the krpano xml file and customizing wordpress functions.php to start

    the pano.xml file is for defining startup parameters, nav buttons, etc, see the krpano documentation for info on how to create the xml file

    krpano.swf is part of the standard krpano install that you downloaded form this site

    editing a wordpress functions.php file requires putting the code in the proper place in the file, that is inside the php tags, and not inside another function, else these other functions might cause conflicts, i havent tested this out on any site but my own, but you might also want to start by disabling any plugins that might cause a conflict, test with a simple theme, etc

    look through some other themes function.php for examples on correct code placement, search google for tutorials, i'm self taught with all this stuff, so i don't really know what the "rules" are, but if you post your functions.php code to this thread ill have a look

    the shortcode is just text inserted into a post, nothing fancy there

    btw, ive updated this code to work with iphone js, it is working on my site now, but i want to check it with the new krpano 1.0.8.12 iphone code before posting the update here...

    there is also the wordpress krpano plugin which is much simpler to use, and may better suit your needs, but it is not as easily customized as the shortcode ...

    sam

  • Hi Sam,

    This is really helpful, thanks :) I too am self taught - so kudos respect for this great code.

    I adjusted it a bit more to fit my needs, which was to have the panorama fit in the post, rather than a page that is linked too. I just changed functions code


    and adjusted the pano.php too, as dropdown menus were appearing under the pano, and fullscreen would not work - I just added this bit

    Code
    swf.addParam("allowFullScreen","true");
        swf.addParam("wmode","transparent");

    Please let us know when you have an iphone solution - i am not sure how it would work cos this system relies on uploading MOV files.

    Anyway thanks again for great code implementation for WP.

    best,

    tom

  • hey tom, thanks for verifying that this in working for others :)

    yep, i had to break out the cube faces for iphone, i suppose they could be auto extracted from movs somehow, i like the movs opening at a specific view without coding the pan/tilt/zoom per pano, but for now, this works :)

    and sorry for the delay, i've been a little busy lately so i haven't had time to prepare a proper new post with complete instructions, and i'm still working out a few different ideas, playing w dynamic xml, fb embedding, etc, plus need to make sure code is compatible w latest krpano 1.0.8.12 update features...

    anyway, add this code into the pano.php file, you will also of course need to add the krpano iphone js & license files to your site, etc, note that the path structure is now slightly different than the original code

    have fun, let me know if this is working ok for you

    sam

  • hi boris -

    this is just a standard qtvr .mov file, this can be exported from ptgui, pano2vr, etc

    search the krpano docs for more info on qtvr support

    the code could easily be altered to support cube face files or other formats as well, similar to the iphone code i posted above

    sam

  • Hi sam,

    Thank you for your answer.
    In fact I have already a virtual tour made with Vtour droplet and I would like to embed this tour in wordpress and also it works on Ipad.
    I am not used to code, so if you could give me some ideas it would be great...
    Regards.
    Boris.

  • this code is made for embedding individual panos, not tours, although it could be modified to do so by someone so inclined -

    the easiest solution for embedding your tour in a wp page is probably just using an iframe or lightbox overlay to call a static page with the tour, search the forum for more info on these terms

    sam

  • Hello Sam,

    I success to embed a virtual tour made with Vtour drople (so not a .mov but a .swf), but now I would like to embed several tours ( in differents posts). But for every tour I want to embed it is always the same xml loaded, so it is always the same tour I can see for all the posts. How can I load different XML with your Wordpress Shortcode?
    Thank you for your help.
    Regards.
    Boris.

  • hi boris

    to add a new value to the shortcode, you would need to alter the shortcode something like below

    note - this is untested code, and is basically just an example of how to add a new value to the shortcode

    the new XML shortcode in your post would look like this -

    Quote

    [krpano file="pano-file-name" title="Panorama Title" xml="path/my-custom-xml.xml"]

    and something like this in your functions.php -

    in pano.php, change line 18 to

    Quote

    swf.addVariable("xml", "<?php echo $_GET['xml']; ?>");

    note the changed bits in red about XML, if no value for xml='' is specified in the posted shortcode, the default will be used - you will probably need to further alter the pano.php template and/or otherwise alter the returned html within the shortcode to display your tour as you wish, and probably tweak this code a bit to make it work with your set up, a lot of that depends on your sites file structure...

    sorry, i don't really work with tours & this is untested code, but it should get you going in the right direction, good luck :)

    sam

  • Hi Mathew,

    Yes, take it out. Shortcode is meant for post admin description box only. You can use in other template files but not the functions.php that will result in a blank screen for sure.

    If you want to hard code into your single.php come back and I will try help for that.

    best,

    tom

  • hi matt -

    i kind of hobbled this together without a real understanding of proper coding, but the function may be conflicting with another function in your file, or you may have accidentally copied some invisible character mucking up the code, etc

    have you tried inserting the entire block at a different point in your functions.php ?

    have you tried it with a different theme ?

    also make sure to disable the wp krpano plugin if you are using it, it may cause a conflict

    let me know if you cant get it working, we'll get it sorted -

    sam

  • As a C++ and Coldfusion programmer I've not got my head around the PHP/WP set-up yet.

    If I remove the add_shortcode line then the page simply outputs the the shortcode as text. I understand what the function is doing but I don't see where it goes and why it actually works where Sam has it ?

    Having it outside of the fucntion on the functions.php makes no sense neither does removing it. It has to go somewhere for the shortcode to actually work.

    Matthew Rogers
    360Precision
    http://www.360precision.com

Participate now!

Don’t have an account yet? Register yourself now and be a part of our community!