HomeForumsGeneral DiscussionPanoramas on Facebook page

This topic contains 5 replies, has 2 voices, and was last updated by  Martin 2 years, 8 months ago.

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #3178

    Martin
    Participant

    I currently have a collection of panoramas and tours hosted on a commercial website and constructed using Panotour 2.2 to generate flash/html and WordPress 4.1 / PanoPress 1.2 to display

    From time to time I would like to display a thumbnail of the panorama on Facebook and have it fully display (on clicking) in Facebook itself by linking across to my WordPress/Panopress website – including full screen display and autorotation of 360 panos

    Am I being too ambitious or is this possible with a few (hopefully simple) steps

    If it is, does anyone have a procedure guide or documentation for this. I am reasonably tech savvy but some orientation would be much appreciated !

    best
    Martin

    #3180

    Sam Rohn
    Keymaster

    see this tutorial for info on embedding a panorama in a facebook timeline post –

    https://www.facebook.com/notes/panoramic-photographers-on-facebook/facebook-panorama-embed-tutorial/172042586173194

    sam

    Sam Rohn :: New York City
    360° Panoramic Photography :: www.samrohn.com
    Location Scout :: www.nylocations.com

    #3183

    Martin
    Participant

    see this tutorial for info on embedding a panorama in a facebook timeline post –

    https://www.facebook.com/notes/panoramic-photographers-on-facebook/facebook-panorama-embed-tutorial/172042586173194

    sam

    Thanks Sam – I tried all that (plus some stuff I found on the Kolor Panotour Forum) and after a bit of experimentation I got it working on Facebook

    I used the debug tool you pointed out and the WordPress Plugin “Header and Footer Scripts” by Anand Kumar which is certified up to WordPress 4.1 in place of the one you mentioned

    However, I now have one big question which may mean I have to redo it and start again:

    I have a lot of panoramas on the same page on my hosted Website but when I copied the code in, it just works for the one flash/html tour I specified in the parameters specified based on your example code. How do you tailor it so that there is just one set of html in my web site but I can put in any panorama/virtual tour I want in Facebook without keep on having to alter the base html

    Thanks for all your help to get this far

    Any ideas on this last part ?

    best
    Martin

    #3184

    Sam Rohn
    Keymaster

    you can only have one set of open graph embed tags per page, so if you want to embed separate panoramas in separate facebook timeline posts you should put each pano in its own wordpress post or page

    theoretically you might be able to rig something up with custom templates and dynamic per page headers called via custom url etc, but this would be a somewhat complex undertaking

    sam

    Sam Rohn :: New York City
    360° Panoramic Photography :: www.samrohn.com
    Location Scout :: www.nylocations.com

    #3185

    Martin
    Participant

    you can only have one set of open graph embed tags per page, so if you want to embed separate panoramas in separate facebook timeline posts you should put each pano in its own wordpress post or page

    theoretically you might be able to rig something up with custom templates and dynamic per page headers called via custom url etc, but this would be a somewhat complex undertaking

    sam

    Thanks Sam – that’s pretty much the conclusion I had come too as well but it saves me a lot of time trying to achieve the impossible !
    As I said I used your suggestions plus the Kolor script and the WordPress plugin to add head information as I mentioned above

    The script I ended up with was pretty much the one on the Kolor user guide :

    <meta charset=”utf-8″ />
    <meta name=”medium” content=”mult”></meta>
    <meta name=”viewport” content=”target-densitydpi=device-dpi, width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no, minimal-ui”></meta>
    <meta name=”apple-mobile-web-app-capable” content=”yes”></meta>
    <meta name=”apple-mobile-web-app-status-bar-style” content=”default”></meta>

    <title>xxxxxxxx title xxxxxxxxxx</title>
    <meta content=”xxxxxxxxxx title xxxxxxxxxxx” property=”og:title”></meta>
    <meta name=”description” content=”xx content xx”></meta>
    <meta content=”xx content xx” property=”og:description” /></meta>
    <meta name=”keywords” content=”xx keywords xx”></meta>
    <meta name=”generator” content=”xx generator xx”></meta>
    <meta content=”xx Author xx” name=”Author”></meta>
    <meta content=”Copyright” name=”xx copyright info **”></meta>

    <meta content=”http://www.domain.xxx/<path>/file.html” name=”url”></meta>
    <meta content=”http://www.domain.xxx/” property=”og:site_name”></meta>
    <meta content=”http://www.domain.xxx/<path>/file.html” property=”og:url”></meta>
    <meta content=”article” property=”og:type”></meta>

    <link href=”http://www.domain.xxx/<path>thumbnail.jpg” rel=”image_src”></link>
    <meta content=”http://www.domain.xxx/<path>/thumbnail.jpg” property=”og:image”></meta>
    <meta content=”https://www.domain.xxxt/<path>/thumbnail.jpg” property=”og:image:secure_url”></meta>

    <meta content=”http://www.domain.xxx/wp-content/<path>/file.swf?xml=http://www.domain.xxx/<path>/file.xml” property=”og:video”></meta>
    <meta content=”https://www.domain.xxx/<path>/file.swf?xml=https://URL/www.domain.xxx/<path>/file.xml” property=”og:video:secure_url”></meta>
    <meta content=”application/x-shockwave-flash” property=”og:video:type”></meta>
    <meta content=”480″ name=”video_height”></meta>
    <meta content=”640″ name=”video_width”></meta>
    <meta content=”480″ property=”og:video:height”></meta>
    <meta content=”640″ property=”og:video:width”></meta>

    and I put this just in the head section of the home page, editing the “file.html” entries it contains each time I wanted to post a different pano link

    The next stage is to go into to the Facebook Debugger and do a “Fetch” prior to posting in Facebook in order to activate the new html for Facebook (and followed by a “show” if you wish to eaxmine the errors, warnings and html to be used)

    Then I posted the FULL url down to the level of file.html in Facebook and checked the right image was displayed before pressing the post button. You can type over the top of the full url just typed after the image has appeared in order to put in a description and hide the actual link

    I don’t know whether I’m doing this completely right but it does seem to work OK

    I noticed that even though you have to update the html in WordPress each time the pano changes, Facebook seems to cache the old entry so you can have several Facebook postings all at the same time showing different panoramas even though the html only contains the most recent version

    The only problam I have left is with Panotour. The descriptive info on Facebook just says “New Project ! Virtual Tour using Panotour” even if I put in my own description – so Kolor have “hard coded thayt somewhere. I tried editing the html of the pano file but it won’t go away even if I delete al lthe references to it – they must have coded it somewhere else as well but thaat is all I can edit in Panotour (non Pro version). I will pursue that as an issue for them !

    Thanks for all your help
    Martin

    #3186

    Martin
    Participant

    The only problam I have left is with Panotour. The descriptive info on Facebook just says “New Project ! Virtual Tour using Panotour” even if I put in my own description – so Kolor have “hard coded that somewhere. I tried editing the html of the pano file but it won’t go away even if I delete all the references to it – they must have coded it somewhere else as well but that is all I can edit in Panotour (non Pro version). I will pursue that as an issue for them !

    I raised this with Kolor on the forum and it was a simple fix. I was editing the html in the pano file after I did the “Fetch” to activate the code with Facebook

    After I did another “Fetch” using the debugger then my descriptions which were edited into the pano html using Notepad++ took effect OK

    Martin

Viewing 6 posts - 1 through 6 (of 6 total)

You must be logged in to reply to this topic.