Adding Files and Image Links to Page Fields

Most OpenCities content types have fields, other than a WYSIWYG Editor, dedicated to linking document or image files to the page. You can attach files to supporting documents or images and the main image field. Some modules function primarily through linking files and images, such as image galleries and document libraries. There is also a field to add supporting links for internal or external links to web pages.

Supporting information fields help your community easily find links and documents that are otherwise buried in the body content. For example, you may have a detailed OC Service page, but the user may only need to find a PDF application form. You can add the document to the supporting documents field so that it displays in the side panel of the service page and is much easier for them to locate.

You must select a file from the Files Library for all document links and supporting image fields, but you can upload a file directly for the main page image fields.

Related Information Links

Most content types have an expanding Supporting Information menu, inside which you will find a field for supporting links and supporting documents. Some content types, such as OC Event, OC Park, and OC Venue, will also have a supporting image field to present the images you add as a built-in image gallery.

The supporting information fields are built into each content type and cannot be changed. The links will display at the bottom of the page or in the right-side panel, depending on the template you use. If you don't put any links in these fields, the Related Information section will not display on the live page.

Adding Links to Supporting Information

You add links to the Add supporting images and Add supporting documents fields in the same way. Please note that all files must be in the Files Library already – you cannot upload files through this process.

1. On the page admin, open the Supporting information menu.
2. Select Insert links in either the Add supporting images or Add supporting documents field. A window will open with several fields you can use to add file links. 
3. Select the Content selector icon in the Link Name field. If the file you're linking is in the Group Files folder, open Files, and if it's in the Shared Files folder, open Shared Files. A version of your Files Library's structure will appear, with folders in green and files in orange. 
   
4. Navigate through the library and click on the file you need to select it. Close the Select an item window when you're finished. You'll see that the file name has been added to the Link Name field, and the file path has been added to the Link URL field. 
5. Don't change the Link URL, but we recommend renaming the Link Name to the document's or image's title so you don't have any unusual characters or extension paths in your link text. Check the New Window box if you want the file to open in a new browser window when clicked.
   
6. If you're adding supporting images, you'll also be able to add a Description, which will be the caption for the image in the gallery.
7. Select Add more links to link more files, and use the four arrows icon to reorder your links if necessary.
8. Select Save when you've added all your links. 

Page Images

Most content types will also have a main page image field, which will display on the page for many templates and on listings, landing pages, and search results. These images can be files already in your Files Library, or you can upload them from the page into the File Library or as a content file.

First, let's go through the different source folders in your Files Library:

• Group files: Contains images available from the site you're working on.
• Shared files: Contains images available across all your sites.
• Content files: Contains images that are only uploaded to the page you're working on. Any files uploaded here are only attached to the page and are not available in the Files Library.

We recommend uploading all files to the Group or Shared files folder rather than the Content files folder. Content files are only accessible from the page they're uploaded from, which can confuse content authors. 

Here's how to add a page image:

1. On the page admin, select Add image in the main image field. This field may be titled Add main image or Add [content type] image.
2. Once the OC Page Image window has appeared, use the search function to look for the image or navigate through the folders to find it.
3. When you find the image, select it and add Alt text if it has none. 
4. Select Insert to add the image to the page.
   
5. If you need to upload a new image, navigate to the folder you want to add it to, then select the Upload icon in the top-right corner of the window.
6. Select Upload a file, then choose the image you need from your drives. 
7. Select your File Upload Option and File Configuration Options, then use the File description field to add alt text to the image. 
   
8. Select Upload when you're ready and the file will be uploaded into the folder you've specified.
9. Choose it from the folder, then select Insert to add it to the page.

Once you've added the image to the page, you can select Unlink to remove the image from the page or Edit to select a new one.

What Else?

• Learn more about the Files Library
• Adding hyperlinks to your page
• Upload and insert files using the Document Manager