I use an embedded content frame to incorporate a piwgo gallery so that the site and gallery have a consistent look and feel. I would like to be able to target a link within that frame. Inside the frame I placed:
Now on a page I have an image I would like to be able to target the following on a click of that image.
I placed that in the box after selecting on touch, go to external website. But it doesn’t work. Is there another way to code a link to an image other than the on touch in the side bar?
If the gallery is hosted on a third-party server and is being displayed in an iframe on your website, you will not be able to create image links within Sparkle. You will have to do that wherever the images are hosted. Framed content is essentially just a window in your page that displays something from another website. Any interaction on that content has to be set up on the other website.
If it’s single images, just use the Onclick option in the properties panel. Use go to external website and enter the full URL of the website. This works.
If you have created a multi-image gallery, you can select any of the images in the gallery and then specify the link type and the URL. By selecting another image in the gallery, you can specify a different URL.
I understand what your saying, but what I would like to do is target an image or album within that frame so the website interface, navigation etc, is consistent. I can open the gallery outside the main website at any point but doing so loses the website interface. The on-click option won’t accept the code needed to target an element within the frame. I posted code above which should under HTML5 but where can I place it. Is there a way to enter code directly for a click and not use the sidebar on-click option?
If I’ve understood you correctly, you want to put links on your page that will call content into a frame rather than open another page. If that is correct, it can be done, but it’s a bit tricky.
Basically, you add an iframe to your page with code such as:
<iframe name="myiframe"></iframe>
You can add dimensions and styling also so that the frame is of a specific size with or without borders etc…
Next, you would create your content on individual pages of your website (all excluded from navigation) Each page should be sized to the same dimensions of your iFrame.
Unfortunately, Sparkle doesn’t include an onclick event for links and buttons where you can specify a page or url and a target. So, you will have to create your links by adding embed codes such as this
<a href="1st-page.html" target="myiframe">Description of the first link</a>
<a href="2nd-page.html" target="myiframe">Description of second link</a>
<a href="3rd-page.html" target="myiframe">Description of third link</a>
You may have to style your links by adding some CSS to the code window between style tags.
When any of the links are clicked, the relevant page will display inside the iframe.
It’s not an ideal solution because you won’t be able to preview the result in Sparkle. You’ll have to publish to disk to see it working.
That’s what I was looking for. How do I embed code into an object and not use the on-click option? Is there a native code option that I have never seen in Sparkle?
Thanks for the above, but I guess I am not quite getting it or maybe I have described my situation inadequately. Let me try again.
In sparkle I created a page that has only a header with a title and navigation dropdowns and a body which is entirely an embedded content frame. That embedded content frame has the URL to the gallery which is on the same server and database driven so its content is dynamic, the frame is named “gallery”. This places the gallery within the same static page so I still have site navigation and title.
On another page I have buttons to take you to the page above but I am not able to point to a specific URL within that embedded content frame.
If I understand you correctly, I need to place another embedded content frame over my button and point it, as described above? I have done that but so far it has not worked.
I really appreciate you taking the time to explain.
The issue you’re facing (if I’ve assumed correctly) is that your galleries are in a database of some sort. If that is the case, you must have some sort of mechanism for calling the database galleries into a normal HTML page. This is often achieved with a piece of embed code that will call-up the relevant gallery into your page. If this is your situation, you should start first by creating separate pages for each of your galleries. Essentially, you will place your call-up code into each gallery page so that the gallery can then be displayed on it’s own sparkle page. All these gallery pages would be excluded from your site navigation.
If you can get to that stage, you would typically set up your iframe to point to a default gallery or some other content so that it isn’t blank when first displaying the page. If you wish to display galleries in the iframe via links on the iframe page, it’s easy, you just create links that target the iframe. If, however, you want links on other pages that returns visitors to the iframe page AND displays an alternative gallery page, you are going to have to resort to javascript or pure php to achieve this.
To be quite honest, it sounds a little messy and may even create unnecessary page switching for users as they flip back and forth between pages in order to view specific galleries. Why not simplify matters by creating a set of iFrame content pages containing links to all the other galleries. Here is an example that you can take a look at. Surely this is a neater option than having people hopping from page to page!!! AND, you don’t have to get into hand coding script functions.
I had contemplated creating a page for each button to go to but was wondering if there was a simple way to expand the link to have the gallery take me to a specific link within the database driven gallery.
Basically I am creating a few buttons pointing to the gallery at different entry points then they can navigate within the gallery anywhere they want.
If the galleries are called up using url links, then just name your iframe and use it as a target when the links are clicked. Here is an example of the link you should use:
href="yourGalleryLink" target="myFrame"
This assumes you name your iframe “myFrame”. You do this when adding the iframe to the page, like so:
I haven’t tried it in Sparkle, but you should try adding the target attribute to a URL option. If this doesn’t work, you will have to add the attribute manually in the generated page code after publishing the page to disk. I’ve often wished for a custom onclick event to be added as an option on the On click drop down - but this doesn’t appear to be an important addition for most users or, the developers who wish to keep things very much simpler for non-coders to deal with. Maybe one day it will appear!!!
Ok, running into to too many difficulties with this option in Sparkle; I gave up and just pointed to the gallery directly, then put text links in the gallery back to the website.
On another note; what is the best way to point to specific paragraph in a long help page from a link on another page so users don’t have to go to the page then scroll down to the paragraph they need? Use the embed item again and call a text file with HTML code?
Just add the location to your long help page and give it a name. It will automatically add a name such as anchor1, anchor2 etc, but you can give it a more meaningful name.
When you want to link to the location from another page (or the same page) create the link and use the option to go to a page in the website and choose one of the locations you set.
Ok, this does not work within a text box. I have footer and header elements that things appear to scroll from underneath. If I use this feature then my footer will scroll up the page and my header will scroll off.
@Radjin, It works perfectly well as @francbrowne mentioned it should work. I have used it in such a way many of times. An anchor point (and it is usually used beyond the fold - monitor hight) pulls the user down the page to where they want to go, so the rest of your page scrolls.
The “Scroll location” needs to be placed near the information you want to be viewable by the user. And an SEO hint, name your anchor point relevant to what you are anchoring too - Google and the like take notice of that.
Yes, as I said it will take you to any point in the page but not any point in a text box set to scroll; I use one text box for the long help document. I have header and footer elements that the contents of the scrolling text box appears to scroll under. This keeps the rest of the page, it’s navigation elements and title fixed.
So the question is, can I create a text document basically creating an html document and, pull that document into the embedded content frame and then point to tags within that text from other pages in the website?
@Radjin, I’m going to say no, sorry. I think in the end you have to think Sparkle (this is the framework we have) and then create it so it works for your users.
The anchor tags in Sparkle work linear (as per the canvas) so it anchoring to content within an Embedded content frame isn’t possible unless you introduce code which in my opinion would just be a mess, and something that will be just to tedious everytime you Publish your website. I would go simple…
I have never used a textbox set to scroll. For me that is so 1990’s and hides information from the user if they were to quickly glance over your website. Content needs to be visible to catch the user’s eye!
