Link pics to pages

  • 1
  • Question
  • Updated 6 years ago
  • Answered
I want to link pictures to different pages on my site. The directions say to hover over the picture widget and edit will appear. It does not. How do I get this feature to work?
Photo of Francine

Francine

  • 8 Posts
  • 0 Reply Likes
  • frustrated

Posted 6 years ago

  • 1
Photo of Philip Taylor

Philip Taylor

  • 355 Posts
  • 66 Reply Likes
If you go into edit mode for your page, at the top of the picture widget is a small Edit tag.Click this and a box pops up with Choose a link as one option. Select "Page in this site" and give it the page you want (include the .php at the end of the name). Save the page and preview it to test it.
Photo of Francine

Francine

  • 8 Posts
  • 0 Reply Likes
As I said in my question, "edit" does not appear when you hover over the picture widget. The "edit" that appears in the blue margin area does not provide the option of linking the picture to a page as far as I can see.

I am still unable to link pictures with pages.
Photo of Gop

Gop

  • 7473 Posts
  • 2115 Reply Likes
Hi Francine,

You may like to try another browser and see if that works.

In the meantime you can use HTML to do this:

<a href="url of your link page><img src="resources/{optional folder}/imagename.{type}"; height:x px; width:y px; alt="whatever comment you wish to add"></a>

I missed the last </a> and Philip kindly picked it up and posted the correction. I've amended this original post to reflect this.
Photo of Philip Taylor

Philip Taylor

  • 355 Posts
  • 66 Reply Likes
... then <!--
</a>.
-->
But the method I described above works in Internet Explorer and Firefox on my system. Is it possibly something to do with pop-up blocking, Gop?
Photo of Gop

Gop

  • 7473 Posts
  • 2115 Reply Likes
Thanks for the heads up on the missing code Philip.

I have no idea what may be causing it. I've read a few times of this happening but can't find the threads.
Photo of Francine

Francine

  • 8 Posts
  • 0 Reply Likes
Thanks to both of you for trying to help. This is the problem: Since I was using the template that is provided in the free version I did not realize that I was trying to link pictures within a picture gallery.

Is it possible to link individual pictures within a picture gallery to specific pages on a site? It doesn't seem that there is a way, which is too bad.

I also don't see a way (b/c of the margins) to set up individual pictures in a horizontal line of small tiles/icons. If I have, for example, 5-6 pictures, they would need to be set up vertically if I wanted them in the same area of the page. That makes for an inconvenient presentation b/c the viewer has to scroll down before they can click on an icon/picture.

Can you suggest a way of accomplishing what I want to do?
Photo of Gop

Gop

  • 7473 Posts
  • 2115 Reply Likes
Yes.

have a look at this page as an example: http://davidsorchids.yolasite.com/orc...

These were set up by placing the images in image widgets within a series of column divider widgets.

Place a column divider on your page and then in the left and right columns drag another column divider widget and then another into the right or left side. That will give you five areas to place your image or text widgets into. You just need to adjust the width of the divided areas by dragging the dividers left or right.

Good luck and let me know if you need assistance.
Photo of Francine

Francine

  • 8 Posts
  • 0 Reply Likes
YOU are a genius. I actually have 2 rows of pictures now with text identifying what page is linked.

It would be great if I could duplicate this section of my home page at the bottom of every other page on the site. Is there a way to do that?

When I tried searching I only found directions on how to duplicate entire pages. I don't want that.
Photo of Philip Taylor

Philip Taylor

  • 355 Posts
  • 66 Reply Likes
Go to the page in edit mode, select the code you want to copy, hit Ctrl / c, and you have it on your clipboard. Go to each page you want it on and paste it.
Photo of Gop

Gop

  • 7473 Posts
  • 2115 Reply Likes
Francine,

Thanks for the compliment. I think a number of people have hit on this solution at various times but also remember Sanja, Yola's HTML consultant, publishing this somewhere on this forum. I would very much defer to her as being the memorable creator of this system. maybe we should call it The Sanja Shuffle and ask Yola to publish this in Tricks and Traits. I bet it's easy to find subsequently in a search because members will certainly remember the name and procedure.

As for duplicating the outcome on your page to other pages, this is possible. It's a matter of locating the complete related HTML code collection on the page, copying it and pasting it. This would necessarily require that the pictures also remain the same, but could be edited to change images subsequently. if you want me to have a look at this then could you publish your site and let us know the URl including the page name? I'm happy to try.

It would require that you View the Page Source not any single widget because it's a collection of widgets.
Photo of Francine

Francine

  • 8 Posts
  • 0 Reply Likes
...and modest too.

The pictures and words are the same. It would be great to have you locate the HTML code since I know nothing of that.

I figure, if I'm going to learn a foreign language I'll choose French.

There is a problem, though, with the publishing idea. (I was planning on "going live tonight). I constructed these pages for my doctoral portfolio. I have locked access to many of them. I will be giving the password to my reviewing committee but putting it in this forum area kind of defeats the purpose...
Photo of Gop

Gop

  • 7473 Posts
  • 2115 Reply Likes
You re welcome to send me the p/word by email but understand completely if your not comfortable with that. Anyhow gop@designscent.com and up to you.

Currently on the other side of that and understand the protection of that work.
Photo of Philip Taylor

Philip Taylor

  • 355 Posts
  • 66 Reply Likes
These lines will make 3 pictures in a row horizontally, centred on the page. Change page names, alt text (that shows if the image isn't displayed) and title if you want one (that pops up on hover). Add as many as you want.

<!--

<p align="center">
<a href="index.php"><img src="page 1 pic.gif" alt="Home page" height=30px width=80px title="Home page of My Website."/></a>    
<a href="first page.php"><img src="resources/next page pichomegoods.png" alt="" height=30px width=80px title="My first Page."/></a>    
<a href="second page.php"><img src="resources/my next page pic.png" alt="" height=30px width=80px title="another one"/></a>    
</p>

-->
Photo of Gop

Gop

  • 7473 Posts
  • 2115 Reply Likes
Francine, a thought...

Because of your deadline, maybe Yola people could expedite this and try this process out for you. They won't need a published site but would need your login email address if you have logged onto the forum with a different ID. If same then they can rip it from the forum.

I don't know if this is possible for them on short order but hoping they see this thread soon?
Photo of Stefan

Stefan, Official Rep

  • 4448 Posts
  • 190 Reply Likes
Hello Francine

I've seen that you have received a lot of great help on this thread already. It's nice when users offer searching for or creating some code for you.

If you don't know anything about HTML, however, it's a lot of work to get this done for you, and once added to your website, you will not understand it and not be able to edit it someday yourself when you want to change something. Then you will need help from someone else again.

I appreciate advanced users trying to help you, but Yola was designed to make it easy for people exactly like you to design their own website without professional help or knowledge about code. So what I'd recommend to you is to keep it simple, and use the means of our awesome Sitebuilder which actually allow you to do what you request in your above posts.

The Save Page As option is actually the perfect way for you to go. It only requires a little effort afterwards. To have your linked pictures on a new page as well, you save your page as a new page, and then remove all widgets and contents from that new page that you don't want to be there. If you spend more than 10 minutes doing so, I boldly claim that there was too much content on your page! :-) Once done, you can continue adding new widgets and contents to your newly created page.

Another option is to create a sample page for your website. This means that you first figure out the complete default design of a page of your website, and then create that sample page where all the elements of your default design are on, e.g. your picture links, Facebook and Twitter buttons, a box with your opening times, or whatever you have on your pages. Whenever you create a new page, you will do so not by choosing "Add new page", but by opening your sample page and select Save page as.

These two options are an elegant way to keep the control over your website yourself and edit it to your liking without using code or needing someone else's help. If you have any questions on this, please let us know, and we'll be happy to assist you further. Thanks.
Photo of Gop

Gop

  • 7473 Posts
  • 2115 Reply Likes
Francine has already created her site so unfortunately the Save As facility that she has previously mentioned is of no help to her.

Francine another way around this is to open your page where the images gallery-menu resides. Right Click on any clear space within the page and select View Source from the options displayed. Copy and Paste all the "View Source" content into a Word document and you are welcome to send this to me.

I hope I can then identify the code and send the relevant snippet back to you. What you then do is to create a test page on your site, paste the snippet into Notepad and copy it again to strip unwanted code, pull an HTML widget onto your test page and paste the copied code into the widget.

What you should see then is the gallery that you produced originally on this test page. If this all works then you can Paste this code via an HTML widget onto each page at the position it is required.
Photo of Francine

Francine

  • 8 Posts
  • 0 Reply Likes
Thank you Stefan and Gop!

I appreciate all of the advice, time, and energy you have given my problem. My site is up, but I need to let it stand as is for a bit because I have some changes to make on my "general statement" (the first page of my site---remember, this is for my doctoral portfolio & it's important that it meet my committee's expectations).

So...I will return to deal with the presentation (making everything look pretty) once I have satisfied my constituents with the content.
Photo of Gop

Gop

  • 7473 Posts
  • 2115 Reply Likes
Good luck with your endeavour Francine. Look forward to seeing your work in due time.
Photo of Francine

Francine

  • 8 Posts
  • 0 Reply Likes
Hi Gop-

I'm all set with my content. My site has been updated.

The issue I was discussing earlier with the image widgets is not so much a concern now---I'm generally happy with the look of the site.

But---I discovered that the website appears differently on different computers. For example, my on my cv page---I copied and pasted that from an rtf. Yet "field tags" are showing when I view the page on certain computers....but on others it looks perfectly fine.

Could this be an issue with the browser used? Or the age of the computer?

Unfortunately, you can't view the page I'm referring to b/c it is password protected...but are you aware of the problem I am referring to?

-Francine
Photo of Gop

Gop

  • 7473 Posts
  • 2115 Reply Likes
Hi Francine,

Glad you got so far with this and thanks for the update.

You mentioned you copied and pasted source text from an rtf file. That's quite dangerous because the rtf tags can and do conflict with many of the HTML tags used in markup of a web-site. It can actually break your site and render it dead!. The first thing I would do would be to copy the text and place it into a plain text editor like Notepad. This strips all the rtf tags. Then replace the rtf text with this stripped text.

The outcomes are unpredictable but the grief is commonly shared. Sometimes this can go on and then one day your site dies, or you add something new and then it happens.

Don't risk it. Take it out and use plain text, format it with the HTML tools being the text widgets in the sitebuilder.
Photo of Francine

Francine

  • 8 Posts
  • 0 Reply Likes
Okay. I thought I did open notepad and the suffix was rtf---but no matter---I've deleted it now. I also had a Word Doc attachment on that page of my CV. I'm just leaving that, so viewers will need to open the document.

Thanks for the info. I certainly don't want my site to "break" after all the work and grief I put in.
Photo of Gop

Gop

  • 7473 Posts
  • 2115 Reply Likes
Glad that you asked :). You mentioned that you saved the file as rtf. I wouldn't but rather save it as plain text (.txt) then this won't bring any formatting at all. ( I have never experimented with the rtf option because I'm chicken!)