Tutorial Link Function

Link Function

 

Links are an excellent Website Builder tool that allows you to guide your visitors to other related areas on your website.  These areas can be another web page, or items on the same page.

There are different formats available for linking, depending on the style and type of linking you wish to display.  We suggest you review them all prior to usage.

Using the browser's back arrow will quickly return you back to where your started.

Linking Text - Palette

link function 1.fw

  • Option for linking specific words or phrases contained within a text box.

link function 2.fw

 

  • Highlight word or phrase for link. 
  • Select Bold and then select link icon.  Solid chain for link, broken chain for unlink.  (See red square to left)

link function 3.fw

link_5.fw

Insert/Edit Link

  • When you select link icon, Insert/Edit Link screen displays.
  • Select Browse icon to access your web pages.

link_6.fw

  • Select public_html, where all web pages are stored.
  • You will see all of your folders and then all web pages listed in alphabetical order.
  • You will only link to the .html web page, with this icon:link_8.fw
  • Double Click on your html page you are linking to.

anchorlink6.fw

  • Insert/Edit Link screen now displays your page name in Link URL box.
  • Make selection in Target box drop down menu.
  • Open Link in Same Window is recommended.
  • Open Link in New Window leaves the window open until closed by the visitor.  Is is also subject to pop-up security, and could slow down your website.
  • Select SAVE to publish and save your page

Linking Text - Button Function

  • Button Function is a quick and easy way to create a text link with a customized button, as we have done here.

Linking Images - Palette

link function 4.fw

  • Insert Image on web page.
  • Click image once, Palette - Image will display.
  • Go to Links section on Palette, and select icon to the right of SET.
  • This will display the file folders, select public-html folder.
  • Follow directions as shown in Linking Text - Palette
  • Select SAVE to publish and save your page

links_8.fw

  • Palette - Link will now display, with Link URL entered in Link section box.
  • Select Opens In box and set to Open In Same Window.
  • Select SAVE to publish and save your page.
  • Once an image has been lined, the Title under Element Properties is Blank.  Be sure and enter a image title here.
  • Put a short description of the image in Name. 
  • Title and Name are used by search engines.
  • The title will display to visitors when the cursor is placed on the image.
  • Select save to save and publish your page.

Linking Images - Edit

link_10.fw

  • Use Edit for a quick and easy image link.
  • Click once on image.
  • Select Edit drop-down menu.
  • Select CONVERT TO LINK
  • Double click on page to link.
  • Link is complete, will automatically open in Same Window.
  • Select SAVE to publish and save your page

Linking - Anchor Function

link function 5.fw

anchorlink3.fw

 

  • The anchor icon will now display in the text field.  (It is only visible in text edit mode).

anchorlink5.fw

 

  • Highlight the words or phrases you want to be clickable.

anchorlink6.fw

 

  • After the link URL name, add # and then the name of your anchor.
  • In our example, we are linking to the page links.html and then the #anchorlink..
  • Open in same window.
  • Select insert.
  • Save and publish your changes.
  • Select View and check to make sure that your link is functioning correctly.
  • If you forget the name of your anchor, just go back to the anchor text box, put cursor on the anchor and select the anchor icon in the Palette.
  • Anchor name will display.