Documentation:UBC Content Management System/How to/How do I create a link using an image

From UBC Wiki
UBC CMS
Codex
Welcome to the support documentation for the
UBC CMS Service.
Contents

UBC Content Management System

UBC Collab Theme

UBC Collab Theme Overview
Theme Options Index
CLF Options
Layout Options
Frontpage
Navigation
Display Options
SEO
Export
Import
Global Theme Options

Dashboard Overview
Pages and Posts
Adding Users

Menus
Widgets
Plugins
Forms
Shortcodes
RSS Feeds
Going Live

Complete Topic Index
PDF Wiki Book Version

Images can be embedded into pages and posts and each image can link to another webpage or document. If you wish to create a link using an image instead of text, you can do one of the following:

Linking the image to another webpage

  1. Enter your page's/post's Edit view or create a new page/post
  2. Click on the "Add an Image" button found above the content entry field (it should be the first icon under the Upload/Insert row)
    • NOTE: If you have already uploaded the image and it's in the entry field, skip to step #4
  3. Next, you can either upload the image from your computer or select it from the Media Gallery if it's already there
    • From computer:
      1. In the "Add an Image" window, under the "From Computer" tab, click on the "Select Files" button and choose the image you wish to upload from your computer
      2. After the image has been loaded, the tab should expand with entry and option fields for the image
      3. Enter the desired webpage address in the "Link URL" entry field and click on the "Insert into Post" button (this will also add the image into the Media Gallery if you wish to insert the same image into a different page/post)
    • From Media Gallery: (to add an image here first, go to Dashboard -> Media -> Add New)
      1. In the "Add an Image" window, under the "Media Gallery" tab, browse through all the files (or search using the "Search Media" bar) and click on the "Show" link of the desired image
      2. Enter the desired webpage address in the "Link URL" entry field and click on the "Insert into Post" button
  4. Additional | Editing the image link:
    1. First, click on the image in the entry field so that the Edit Image (landscape icon) and Delete Image (red circle with slash icon) icons appear (make sure the Visual tab is selected for the content entry field)
    2. Click on the Edit Image icon (if you're not sure which one it is, hover over an icon with the pointer until a description appears)
    3. Under the "Edit Image" tab, enter the new webpage address in the "Link URL" entry field
    4. Optional: If you wish for the link to open in a new page, go to the "Advanced Settings" tab and check the "Open link in a new window" checkbox
    5. Click on the "Update" button

Linking the image to a document

  1. Go to Dashboard -> Media -> Add New to add your document first
    • NOTE: If you already have the document you need in the Media Gallery, simply find it under Dashboard -> Media -> Library, click on the desired image name, copy/take note of the address found in the "File URL" field, and skip to step #4
  2. Click on the "Select Files" button and select the document you wish to link the image to
  3. Copy/take note of the address found in the "File URL" field and click the "Save all changes" button
  4. Use the "File URL" address as the "Link URL" address in the instructions on how to link an image to a webpage found in the section above

See Also