30 May 2012

Guest Post - Adding Links to Comments

A big thank you to Ray for this Guest Post... you can try it out on FFAF (Free For All Friday)


If you’re a regular reader of Philofaxy, you can’t help but have noticed what a helpful and informative community of commenters visit the site. In the regular Tuesday and Friday ‘Free For All’ topics, dozens of questions are asked and answered every week. Often, the commenter will add a web address that gives further information or serves as an example. Here’s an example of one:


I made that comment before I knew better, so the web address is not a hyperlink. That means you can’t just click it and be taken there. What you have to do instead is copy and paste the link into your browser bar. No biggie, but compare with this example:


Note this time that you are offered not a long web address, but simply some highlighted text. Click anywhere on the highlighted text (although not as it appears above: that’s just an image) and you’ll be taken to the address to which it’s linked.

Hyperlinks like this are easy to create and make it easier for readers of your comments to go and have a look at the page you’re recommending.

To insert a hyperlink into your comment, you just write a very simple piece of HTML code. Here is the format for a hyperlink:
 
<a href="http://yourlink.com"> your text </a>

When this is included with your comment, you’ll see a piece of highlighted text that simply says: your text and is clickable.

Let’s see an example. I want to add a link on FFAT to a great cartoon that I think is very fitting to the spirit of asking and answering questions. Here is the address: http://xkcd.com/1053/

Notice that I’ve included it here as a hyperlink so you can just click it and go there. Now I want to add it as a link in a comment on FFAT. What I want to say is this:

Here’s a cartoon I think is very relevant to this community.

I want the words ‘a cartoon’ to be clickable and to take readers to the relevant web address.

Here’s what I’ll need to post in the comment box:

Here’s <a href="http://xkcd.com/1053/">a cartoon</a> I think is very relevant to this community.

So here we go...


Hit the ‘publish’ button and here’s the result:

Next time you want to include a web address in your comments, why not try hyperlinking?

Thank you Ray, I forget that people don't necessarily understand HTML, it is a second language to me!



21 comments:

  1. Thank you so much for this Ray! I always wondered how in the heck people did that!

    Steve has been an excellent HTML guru to me, and I appreciate this bit of info from you too. I'm definitely in the camp of " HTML as a foreign language!"

    (PS I love that cartoon! Yes very fitting to our supportive and fun community here on Philofaxy!)

    ReplyDelete
    Replies
    1. Yes I think it is nearly 20 years (1993) since I created my first website, the following year I created http://www.pembury.org which consisted of 5 pages!

      Back then a lot of the HTML'tags' didn't exist, you couldn't create tables in HTML, and I use them alot these days. And although I've moved on from creating pure HTML pages in an editor to using content management systems such as Blogger and Wordpress, I still have to get amongst the code to edit the HTML to make it look correct!

      A skill that will never be lost.

      Of late I've been self learning CSS code which is another form of mark up language... HTML has the grand title of Hyper Text Mark Up Language... CSS - Cascading Style Sheets

      Beware the comment box doesn't support all HTML commands!

      Delete
  2. Oh! I am now one of your 1000 a day. Not for the html which I knew ( although it a pain to type on an ipad!) but for the diet coke and menthos which I had to google! But, I am 41, not 30, so what does that do to the calculation?!!
    Helen.

    ReplyDelete
  3. Very helpful! Thankyou!

    ReplyDelete
  4. Synchronicity is a very weird thing!! I was just thinking yesterday how Steve and others manage to put items on the site which are just "clickable" to access, and was pondering how clever folks are to know these things. Now.... I know too!!! Thanks Ray. xx

    ReplyDelete
  5. this is great ... but i have one further sugestion/question - when you click on the highlighted text (the hyperlink) can you set it so that it opens in a new window? For example I am reading Philofaxy and RAy suggests I look at a cartoon ... i click the link and it now opens in place of Philofaxy when I was'nt finished reading the post. I hope my question is clear.

    ReplyDelete
    Replies
    1. Yes, it is. All you need to do is add target="_Blank" straight after the URL and before the > sign.

      Delete
  6. Oh cool! I've never had any training in html, so that's brand new to me. I'm a big fan of xkcd already though. They'll give your brain a workout. Thanks again, Ray.

    ReplyDelete
  7. One word of caution about adding links in comments... links to commercial sites that you have a financial interest in will be removed...

    We have a lot of spoof comments that appear on the blog which include a link in them to link back to the authors site, purely to gain them some visitors/customers.

    Often the comments don't make a lot of sense in terms of the post they have been posted on, so they tend to stand out like a sore thumb! It's also common for them to be put on old posts so they get held for moderation anyway so the normal reader will not ordinarily see them.

    ReplyDelete
  8. Thanks Ray and Steve - very useful. Is there a way to save the base code so it's easily available - I'd never remember this!

    ReplyDelete
    Replies
    1. May be save it as a macro, not sure what you could use though it will depend on browser and OS

      Steve

      Delete
  9. Thanks so much! I was one of those individuals who were horrible with the html coding.

    ReplyDelete
  10. Save it in a text file then just copy/paste and remember to change your link to the correct one! :)

    ReplyDelete
  11. Or write it in your Filofax?

    ReplyDelete
  12. Thanks. One question though. In your first example you typed <a=href and in the second example you typed <a href=

    Does the = come before href or after and if after is there a space between the a and href (hope my question makes sense!)

    ReplyDelete
    Replies
    1. Ah that's a typo... now corrected thanks for spotting it!

      Steve

      Delete
  13. You guys are so very helpful! Thanks so much!

    ReplyDelete
  14. Wow, this is great! It will be very helpful. Though I have to say, as someone who isn't literate in HTML and knows absolutely nothing about it, I will never remember this. I'd have to refer back to it every time I want to add a link, which is okay. But for me, just copying and pasting a URL from the address bar seems way simpler. However, for the good of the community and in an effort to make things cleaner, I will keep it handy.

    Thanks Ray and Steve!

    ReplyDelete
  15. Thank you for the tutorial! I have to confess though that I prefer the whole URL to be copied and pasted since that let me see where I am going. I would only click on the hyperlinked text if I know or trust the author of the comment (or here where I trust comments are moderated?).

    ReplyDelete
    Replies
    1. Yes I favour hyperlinking the URL rather than text. And yes comments are moderated but only at intervals. Comments are not held for moderation before they appear on the blog, if we did that there could be days when comments might sit in the queue for several hours before appearing.

      Steve

      Delete
  16. If you hover over the link, your browser will show the target address in its status bar at the bottom of the window.

    ReplyDelete