Sunday 16 June 2013

Setting links & attributes in RapidWeaver 5 - Beginner’s Guide

RapidWeaver 5 Beginner’s Guide > RapidWeaver 5 Beginner’s Guide > Links : Safari Books Online

Links

Whether you link to other pages on your site or to other external websites, it goes without saying that you are going to want to add links to your web pages. RapidWeaver makes this very easy. You don't need to touch any code at all.
Simply highlight the text or image that you want to link and click on the Set Link button that we saw earlier in this chapter. You will notice a new window has appeared where we can enter in our link information.
Links

Linking to a URL or e-mail

The default drop-down option is set to URL. To link to an external page, simply type or paste in the URL of the page that you want to link to. The URL must begin with either http:// or https:// in order for the link to function properly.
If you want the link to simply start a new e-mail to a particular address, simply type or paste the e-mail address in the same location where you would have typed in the URL. You will want to leave the drop-down option set to URL. I should advise you that this may cause you to receive unwanted SPAM e-mail as anyone can send an e-mail directly from your website.
You can add a default subject, body, or other attributes to the e-mail that will be created when your link is clicked. To do this, simply add the attributes to the end of the e-mail address as if it were URL parameters. The values will have to be URL encoded. For example, you will need to replace all your spaces with %20. The following entry will add the subject "This is the subject" and a body of "This is the body" to the e-mail:
someone@example.com?subject=This%20is%20the%20subject&body=This%20is%20th e%20body
For more information on other options available head over to http://www.mailto.co.uk/ .

Linking to an internal page or resource

If you want to add a link to a page or resource that already exists within your project file, simply navigate to the page or resource from the page drop-down menu that defaults to URL.
When you use the drop-down menu to link to your internal pages, RapidWeaver will always maintain those links even if we rename or change attributes for our pages within our project file. If we were to instead type the URL to the published pages, RapidWeaver would not maintain that link for us if we were to change any of the attributes on the linked page. For example, if the page or folder name of the page we linked to was changed, RapidWeaver would only change links to that page if actually referenced the page instead of using a URL.

Opening in a new window

If you want the link to open in a new window or tab when it's clicked, make sure that you check the Open in New Window setting.
If I am linking to an external website, I tend to always open those links in a new window. This means that the user does not leave my website and can come back to where they were extremely easily. If the link was opened in the same window, then the user would have to search through their browser history in order to get back to the page on my site.

Custom attributes

For all you tech geeks out there, you can add all the custom attributes that you want to link. This could be useful for many things such as launching a lightbox.
Custom attributes
The following is a list of common attributes that can be added into a link:
  • rel: Specifies the relationship between the current document and the linked document. This attribute is commonly used to trigger JavaScript actions as well.
  • class: Specifies a class name for custom CSS styling or to trigger a JavaScript action.
  • ID: This is the unique ID for the element. This is commonly used to trigger JavaScript actions or custom CSS as well.
  • tabindex: Specifies the tab order of an element.
  • title: The information entered here will be displayed in a tooltip when a user's mouse hovers over the link.
  • onclick: Custom JavaScript to run when the link is clicked.

Removing links

It's very simple to remove a link. Simply highlight the link with your mouse and click on the Remove Link button on the bottom toolbar. You can also select the link text and choose Clear Formatting from the Format menu.