• Registered: 2014-09-13
  • Posts: 2

Topic: Problems embedding on moonfruit

Hi

I purchased Juicebox-pro to utilise the share buttons, Custom Purchase URLs and SEO features in order to enhance my current gallery.

I have created the gallery to my exact criteria but the problem is I can't get it to embed on my moonfruit website.

I have tried using the embed code from the Juicebox Builder in the HTML snippet widget. No luck.
I have tried following the steps from the "Embedding in a Web Template Site" guide, tried it with both google drive and dropbox but again no luck.

Whenever I use the google drive technique, on chrome, nothing appears, IE shows "this content cannot be shown in a frame" and Firefox displays a google drive log in screen.


What is going wrong?

  • Registered: 2014-04-19
  • Posts: 48

Re: Problems embedding on moonfruit

to help you, I'm going to describe the way I embed the JB code into my website :

1) to produce a page which includes a JB gallery, I'm using an html5 Template page : 

<!DOCTYPE html>
<html lang="fr">
<head>
<title>titre du site</title>
<link href="style.css" rel="stylesheet"/>
<meta charset="UTF-8"/>
<!--[if lt IE9]>
<script src="//html5shim.googlecode.com/svn/trunk/html5.js></script>
<![endif]-->
</head>
<body>

<section>
<article>
texte 1
</article>
</section>

</body>
</html>

(as I'm french, the text is french !)

2) I generate the code with JB ; it makes an " index.html" file ;

3) I edit it with Notepad++ ; I copy the part between the commentars "<!--START JUICEBOX EMBED-->"and "<!--END JUICEBOX EMBED-->" ;

4) I past it in my html5 code where I replace the line "texte 1" ;

5) I put a significant title instead of "titre du site" ;

6) I save it ;

7) that's all...

  • Registered: 2012-04-24
  • Posts: 5,904

Re: Problems embedding on moonfruit

Whenever I use the google drive technique, on chrome, nothing appears, IE shows "this content cannot be shown in a frame" and Firefox displays a google drive log in screen.

It looks like Google have changed their Drive interface and the 'Preview' button to generate a URL for the gallery's 'index.html' page is no longer displayed on the toolbar.

Please see this Google forum thread relating to this issue.

Try one of the following to get the required URL to use in your iframe:

Method #1:
(1) In a web browser, log into your Google Account.
(2) Open Drive.
(3) Make sure that you are using the old Drive by clicking on the 'cog' icon and selecting 'Leave the new Drive' (if necessary).
(4) Open your gallery folder.
(5) Select the checkbox next to the gallery's HTML index page.
(6) Make sure the 'Details/Activity' side pane is open (by clicking on the 'info' icon if necessary).
(7) Click 'Details' (rather than 'Activity).
(8) Scroll down to the 'Hosting' section.
(9) Copy the URL displayed.

This screenshot should hopefully make things a little clearer (highlighting the relevant areas on the screen).

Method #2:
Alternatively, you could build the required URL manually as follows:
(1) Start with a base of https://googledrive.com/host/
(2) Add the Folder ID. Open the gallery folder in Drive in a browser and copy the ID from the URL in the browser's address bar. It will look something like this: 0BxXHNif2h4NRcmxHOW9lUDBWWTQ
(3) Add a slash ('/') to the URL.
(4) Add the name of the gallery's index page.
You will end up with a URL which looks like: https://googledrive.com/host/0BxXHNif2h … index.html

If Google do not reinstate the 'Preview' button soon, I will ensure that the instructions on our web site are updated accordingly.

  • Registered: 2014-09-13
  • Posts: 2

Re: Problems embedding on moonfruit

Hi Steven

Many thanks for your help, that worked a treat.

I see that when using an iframe, the fotomoto shopping cart is disabled. Is this the case also when using custom purchase URL's?

One last thing, I added a caption to every photo so that they could be used as my SEO tags and in the Juicebox builder, I set the captions to "use none" so they would not display under my image however they do appear. Is this because I have entered a caption or could you have the SEO option ticked, captions entered and the caption set to use none?

Many thanks for helping me out

  • Registered: 2012-04-24
  • Posts: 5,904

Re: Problems embedding on moonfruit

I see that when using an iframe, the fotomoto shopping cart is disabled.

Yes. This is noted in the 'Using an iframe' support section here.

Is this the case also when using custom purchase URL's?

Yes. Unfortunately, all shopping cart functionality is disabled when a gallery is loaded into an iframe.

Rather than use a web template site (which would require that you host the gallery elsewhere and load it into an iframe), you could perhaps sign up for some web space with a regular web host so that you could upload web pages with Juicebox galleries embedded directly into them.
There are many web hosts which offer free web space which would be suitable. Try a web search with terms such as 'free web hosting'. Please be aware, though, that with a paid account, you will likely better support, greater stability (less downtime) and more features.

If you did have your own web space, then you might like to consider another one of our products - Showkase.
Showkase is a PHP web application which would allow you to create a complete portfolio web site online using a web browser interface.
Showkase has full support for Juicebox-Pro (including Social Media Sharing, Search Engine Optimization, Fotomoto support and the ability to enter individual purchaseURLs for each image via the interface) and the galleries can be created within the application itself (or created with JuiceboxBuilder-Pro and then imported into Showkase).
Showkase also has the ability to create non-gallery pages such as 'About', 'Contact' and 'Basic' pages where you can enter information about yourself and contact details.
Demo sites created with Showkase can be found here.
All of this is done automatically within the Showkase interface without the need for any manual coding at all.
If you would like to take a look around the Showkase interface, you can log into the Live Demo Admin here.
Showkase can be purchased as Showkase-Standard (which comes with Juicebox-Lite and SimpleViewer-Standard, the free versions) or Showkase-Pro (which comes with Juicebox-Pro and SimpleViewer-Pro). The only difference between Showkase-Standard and Showkase-Pro is the bundled viewers.
As you already have Juicebox-Pro, you could purchase Showkase-Standard and upgrade it to use your Juicebox-Pro files by following the instructions here.

could you have the SEO option ticked, captions entered and the caption set to use none?

Yes. You can enter captions for your images, select the 'Add SEO Content' checkbox (so that the captions are used in the SEO content) and set captionPosition="NONE" (so that the captions are not displayed in the gallery).

I set the captions to "use none" so they would not display under my image however they do appear.

Please make sure that your gallery uses Juicebox-Pro and not Juicebox-Lite. captionPosition is a Pro only configuration and is not available in Juicebox-Lite (the free version).
Also, try clearing your browser's cache before reloading your gallery's web page to ensure that your browser is fetching and using the most recent versions of your gallery files from your web server.
If this still does not help, then please post the URL to your gallery's web page so that I can take a look and help further.

  • Registered: 2012-04-24
  • Posts: 5,904

Re: Problems embedding on moonfruit

The Embedding in a Web Template Site support section has now been updated (with instructions for determining the URL to load into the iframe) for the new Google Drive.