Topic: Squarespace
I have a squarespace site and I think Juicebox is the answer I'm looking for to replace the native gallery. However I don't understand how I would get the gallery uploaded to Squarespace.
Pages 1
You are not logged in. Please login or register.
Juicebox Support Forum → Juicebox-Lite Support → Squarespace
I have a squarespace site and I think Juicebox is the answer I'm looking for to replace the native gallery. However I don't understand how I would get the gallery uploaded to Squarespace.
As Squarespace is not a regular web host (which gives you FTP access to regular web space), you can embed a Juicebox gallery in a Squarespace web page by following the Web Template Site instructions here.
When it comes to inserting the <iframe> code into your Squarespace page, the following Squarespace articles should help:
http://help.squarespace.com/customer/po … les/438262
http://help.squarespace.com/customer/po … to-a-page-
As Squarespace is not a regular web host (which gives you FTP access to regular web space), you can embed a Juicebox gallery in a Squarespace web page by following the Web Template Site instructions here.
When it comes to inserting the <iframe> code into your Squarespace page, the following Squarespace articles should help:
http://help.squarespace.com/customer/po … les/438262
http://help.squarespace.com/customer/po … to-a-page-
Thanks for the info, Ive gone through all of this a few times, and can not get the gallery to show up on my site. If I can get this figured out, I will get a pro account, but until then I can't commit. I already had drop box. My steps were these.
1 copy and paste Iframe code into html code block on a page of my site
2 copy entire gallery folder to dropbox public folder
3 Copy index.html dropbox link
4 place the link into the appropriate spot in the iframe code
5 save and publish
6 view my site on a different browser/and or log out of squarespace back end to prevent any https issues that would keep me from viewing the live content.
7 see nothing but a blank white space
Any tutorials or examples would be great!
There are two separate things to check:
(1) Check that the Juicebox gallery (hosted on Dropbox) can be viewed in a browser.
Open the public link to the gallery's 'index.html' file in a browser and the gallery should be displayed.
If it is not, then you might be using the Dropbox download link rather than the public link.
The public link should look something like this: https://dl.dropboxusercontent.com/u/134593202/gallery/index.html
(2) Check that the <iframe> code is functional in your Squarespace page.
Try loading any web page (such as Google) into your <iframe> and see if it is displayed.
If it is not, then there may be a problem with either your <iframe> code itself or the way that you are including it in your Squarespace web page. Try the following as a test:
<iframe src="http://www.google.com" width="800" height="600" frameborder="0" scrolling="no"></iframe>If you continue to experience difficulties, please let me know if #1 and/or #2 above work on their own.
Also, if you could post the <iframe> code you are using and the URL to your Squarespace web page, I will be able to take a look for myself and help further.
Well, I think the problem may be that I can not figure out how to get to the public link, and can only get to the download link.
The only time I see a link pop up with the dl.dropbox... designation is when I hit download link it quickly flashes through the address bar and then returns to the dropbox download link.
Well, I think the problem may be that I can not figure out how to get to the public link
If you are using the Dropbox desktop application, then navigate inside your gallery folder within your Dropbox 'Public' folder, right-click the 'index.html' file and select 'Copy public link' from the right-click menu options.
If you are using the Dropbox web brower interface, then navigate inside your gallery folder within your Dropbox 'Public' folder and click the 'Copy public link' button on the toolbar at the top (as in the first screenshot on this web page).
If you do not see such an option, then it is possible that your Dropbox account does not yet have a 'Public' folder.
If this is the case, then you can create one by following the 'Creating a Public folder' instructions on the same page (link above).
Thanks Steven, I've had Dropbox since 2011. Ive got the Gallery folder in the public folder but the only link I can get is this one.
https://www.dropbox.com/s/qc4b79u6r3lotz5/index.html
My Dropbox does not look like the one in the pictures. I have no Copy Public Link option anywhere. All the copy link options I have only get me the above link.
According to dropbox there no longer are Public Links and now only Shared Links.
Here's my full code with URL
<iframe src="https://www.dropbox.com/s/qc4b79u6r3lotz5/index.html" width="800" height="600" frameborder="0" scrolling="no"></iframe>
Here's a link to the page. www.weatherbrand.com/gallerytest
What's interesting now is that I re-inserted the URL and instead of showing a big white empty box, it now says you must choose a collection to display.
For embedding I am using a Squarespace "code block" set to HTML.
Thanks!
The Dropbox link you quoted is, indeed, a download link. It offers the 'index.html' file to the user as a download rather than allowing the user's browser to display its contents like a regular web page.
Have you tried creating a 'Public' folder by logging into your Dropbox account and clicking this link?
https://www.dropbox.com/enable_public_folder
It looks like the <iframe> code itself has been inserted into your Squarespace page correctly. (The problem is just getting a Dropbox public link to your gallery's 'index.html' file.)
If you want to check that the <iframe> code is OK, just replace the Dropbox download link (with is currently used as the 'src' attribute of the <iframe>) with any other web page (such as http://www.google.com) and you should see the web page you choose displayed within your own web page.
Steven,
Thanks for all of your help, that last bit about enabling the public folder did the trick!
I can view the gallery on my test page, now I guess the next step is to figure out how to get it to fit on my phone. Its not displaying correctly on there. Any Ideas?
Thanks again!
I notice that your gallery has a fixed width of 700px (set in the embedding code in your https://dl.dropboxusercontent.com/u/129 … index.html page).
When loading a gallery into an iframe, I would recommend setting the gallery's dimensions to 100% x 100% so that it fills the iframe, no matter what the size of the iframe is.
Then, being that the gallery is 100% x 100%, the Splash Page will be disabled by default so if you want to continue to use a Splash Page, set showSplashPage="ALWAYS".
Please be aware that when clicking the Splash Page, the gallery will open only within the iframe and not covering the entire browser window. (This is a limitation of using an iframe but, being that Squarespace do not allow you to upload your gallery files to the web space that they provide using FTP, it is not possible for you to embed a Juicebox gallery using the recommended method.)
An alternative solution would be to simply provide links to your galleries within your web page.
When clicked, each link would redirect the user to a gallery's 'index.html' page to display each gallery on a page of its own. (You would still host your gallery folders on Dropbox.) If doing so, you could then use the Back Button in each gallery to allow the user to return to your home page.
Juicebox Support Forum → Juicebox-Lite Support → Squarespace
Powered by PunBB, supported by Informer Technologies, Inc.