Overview

This is an intermediate topic and assumes you already have some level of comfort with inserting images and files. If not, please see our basic topics, Adding Images to Content and Inserting PDFs and Other Documents.

Table of Contents

Background Information

Where on the site can I reuse existing images and files?

It is possible to reuse images and files in some places on the site. For example, a thumbnail or banner field in Article provides link text to "Open File Browser" and look for images that are already uploaded, as in the screenshots below.

But you've probably noticed that you don't have the same option for inserting images to Body text fields-- the big fields where you have control over text and image layout. 

When you click the image icon in a Body text field, you get a prompt to upload something from your computer.

And this is your only option.

However, there is a way to insert images and files that already uploaded to the site for the Body text fields. It is not an ideal and doesn't give you options for resizing, captions, or alignment, and you must remember to add alternative text.

Step 1: Find the image file, or pdf file, you wish to reuse

Go to Content and Select the Files tab.

Use the "Filename" search field to find the image or file.

You'll need some idea of the file name to locate the image.

Click on the image of the image or file.

You'll see the image in its full, unedited form.

Make sure this is the image you want. There will be no option to resize when you insert it. 

Copy the url location to the image or file.

Take everything after the .edu. Do not include the name.franklin.uga.edu part. 

Step 2: Use html to Add the Image url Location to the Source of Your Text Field

A. Go to your content, or create new content from a content type or template, such as Article or Basic Page.

B. Click the "source" button.

You're now in HTML mode.

C. Type html code for inserting images...

<img src="/url-goes-here/image.jpg">

...and alternative text:

<img src="/url-goes-here/image.jpg" alt="This is the image's description">

D. Click "Source" again to get out of Source mode.

You'll notice that this image is really too big for this page.

Now, the theme will resize it to make it look okay, however it is still loading the original sized image. So someone on a mobile phone will see a small image, but it still loading all 2 megabytes of this picture. 

E. Save your content. 

Again, this method isn't ideal if you were hoping to add alignment, captions, or even resize the image.