Uploading and Linking Files in Drupal

A common day to day task in Drupal is managing files that are used within the pages you have created. Using the Media and LinkIt modules this task becomes straightforward. The two tasks below are uploading a file, which will automatically create a link to itself and using LinkIt to link to an exisitng file.

Upload your file

  1. Within the page you would like to modify click the Edit tab to go to the editing interface.
    Click the Edit Tab
  2. In the main WYSIWYG area, click the media icon. It is a square with a mountain inside of it. Usually it is the last icon on the right, or if your button dock wraps it is the last icon on the second line.
    the media icon
  3. Click the Browse button and find the file you wish to upload. It can be an image, a PDF, etc...There is a listing of allowed file types in bold below the Browse button.
  4. Click the Upload button once you have selected the file you wish to upload.
  5. Next click the Submit button, if the file is an image fill in the Alt field by describing the image, and then click the Save Button.
  6. Click the word cancel if you do not want to automaticlly embed the file to the post or submit if you wish to include it on the page.

Linking Files within Drupal pages

  1. Within the page you would like to modify click the Edit tab to go to the editing interface.
    Click the Edit Tab
  2. In the main WYSIWYG area select the text that needs to become a link and then click the LinkIt icon. It is a chain link with a green plus next to it. It is always found next to the media icon.
    linkit icon
  3. Search for your file by the file name you used and select the appropriate result by clicking on it.
    Searching with the LinkIt tool
  4. Once selected a URL will appear in the target path field below.
  5. To be safe, even though Drupal should automatically update URLs for you I like to modify the path generated by Linkit. A default path may look like the following:

    http://example.atus.wwu.edu/sites/example.atus.wwu.edu/files/field/image/Bach-Elwhaflats.jpg

    Delete everything before /files so your final path looks like
    /files/field/image/Bach-Elwhaflats.jpg

  6. Click Insert Link