files & pdfs

Overview

This page shows how to create a popup link from an image to a file with JCE Editor Pro's Image Button.  Note: This can also be done in the standard JCE Editor.

Requirements

• JCE Pro with Image Manager Extended button enabled
• JCE Media Box 2 plugin installed and enabled

Procedure

Step 1: Click Insert/Edit Image button (the one with a star)

• Log into the Administrator interface using your NetID credentials.
• Find the article you want to edit and click on its title.
• In the text area, position the cursor where you would like your image to appear
• Click on the second "Insert/Edit Image" button; you can identify it by the star in the button (see below)
• If you do not have this featured installed, SUBMIT REQUEST and we can install it for you

Step 2: Select the image to be linked to the popup

• Navigate to the folder where the image is located (or, for a new image, where it should be saved) using the "Folders" pane (see #1 below). If you are adding a new image, click the Upload button (see #2 below):
  
  
• If you clicked Upload, choose the Browse button at the bottom of the "Upload" window and navigate to the location of the image on your computer (see #1 below). Alternately, you can drag and drop images to the 'Drop files here' area (see #2 below):
  
  
• Once you have located or uploaded your image, select its filename from the "Name" pane:
  
  

Step 3: Create the popup link

• Select the "Popups" tab in "Image Manager Extended" (see #1 below)
• For "Popup Type," select "JCE Mediabox" (see #2 below)
• Browse to the folder containing the file that should appear in the popup window and select the filename (see #3 below)
  • Note that you can upload a new file using the Upload button.
• Enter a title for the file in the "Title" field (see #4 below)
• Enter a caption for the file in the "Caption" field (see #5 below)
• Click Insert once complete (see #6 below)
  
  
• Save & Close your article.  The image you selected in Step 2, when clicked, will link to a popup window displaying the file you selected in Step 3.

Overview

You can link an image to a popup window that displays a larger version of the same image, another image, a PDF, or even a Joomla! article.

Requirements

• JCE MediaBox 2 plugin installed and enabled

Option 1: Make a popup link to a Joomla! Article

The "Apply Now" button at right is an example of an image that links to an article in a popup window.

1) Add the button image.

1. Click the Insert/Add Image tool and navigate and select the image to be linked to the popup window

2) Link the image to the article.

1. Select the image you added in Step 1.
2. Click the Insert Link button on the editor toolbar:
   
   
3. Under "Search...", click Content (see #1 below).
4. Click the name of the top-level category that contains the article you want to link to (see #2 below).
5. If your article is in a subcategory, click the name of the subcategory containing the article.  (If the article is in a category several levels down, you may need to repeat this step until you find the article).
6. Click once on the name of the article you want linked to the button.
   
   

3) Create the popup.

1. In the Link window, click the Popups tab (see #1 below).
2. In Popup Type, choose JCE MediaBox Popups (see #2 below).  (If you do not see the JCE MediaBox Popups, SUBMIT REQUEST asking us to add the JCE MediaBox Popups plugin to your site).
3. Select "Internal Links" for the Media Type option (see #3 below).  This will display the article content without the surrounding elements such as the banner and navigation menu.
4. Click Insert (see #4 below) and then Save & Close the article.
5. Test the page to check the display.  If the window needs to be a different size, go back to the JCE MediaBox Popups options and adjust Dimensions (see #5 below). The first field after Dimensions is width in pixels; the second field is height in pixels. 
   
   

Option 2:  Make a popup link to a File or Image

The "Rutgers Day" image at right is an example of an image that links to a PDF file in a popup window.  If adding a popup to an existing image or file link, skip to step 5.

1. Click the Insert/Add Image tool and navigate and select the image to be linked to the popup window. If the image already exists in the article, copy the link from the URL field.
   
2. Select the image you uploaded in Step 1.
3. Click the Insert Link button on the editor toolbar (See screenshot under Option 1, 2b above).
4. In the Link window, look to the right of the URL field for the "Browse" icon (it looks like a tiny piece of paper).  Click it and browse to the image or PDF that should open in the popup:
   
   
   
   
5. In the Link window, click the "Popups" tab (see #1 below).
6. In Popup Type, choose JCE MediaBox Popups (see #2 below).  (If you do not see the JCE MediaBox Popups, SUBMIT REQUEST asking us to add the JCE MediaBox Popups plugin to your site).
7. [Recommended] Enter a short description of the image or the file in the "Title" and/or "Caption" fields.
8. [Optional] Set dimensions for popup (see #3 below). The first field after Dimensions is width in pixels; the second field is height in pixels. (You may want to do this if what will be displayed in the popup is very large).
9. Click the Insert button (see #4 below).
10. Save & Close the article.
    
    
    
    

Get the public link to the Box file

General:  Be sure there is at least one other co-owner in your unit with full access to the files.

1. Click the Share button on the right side of the file.
2. Below Share Link, click the slider button for "Create shared link". Text will change to "Shared link is created" and a URL will appear.
3. Underneath the URL, change the access from "People in your company" or "Invited people only" to "People with the link". 
4. If the URL provided will work as it is, click Copy and move on to "Create link to the Box file" section. If a shortened or custom link is preferred, continue with next step in this section.
   
   
   
   
5. [optional]  Click "Link Settings".
6. [optional] Enter a custom path with no spaces (12-30 characters).
7. Click Save.
8. Click Copy to copy the URL to the clipboard for the next step.

Link to the Box file

1. In the Joomla article, select the text or image to be linked and click "Insert/edit link" tool.
2. Paste into the "URL" text box.
3. Select "Open in new window" for Target. This is standard for links to content on external websites though not used if the link opens in a popup. (See optional "Set the link to open in a popup window" section.)
   
   

   

4. Click Insert.
5. Save and Close.

Set the link to open in a popup window [optional]

1. While still in the Insert/Edit link window, click the "Popups" tab.
2. Select JCE MediaBox Popups in the Popup Type field.
3. Choose External Links/Iframe in Media Type.
4. Click Update or Save to save changes, whichever appears. If establishing the link initially,  Save will appear.  If the link is being modified, Update will show as the button text.  Both will save settings.
   

   

   
   
   
   

Get the public link to the Box file

General:  Be sure there is at least one other co-owner in your unit with full access to the files.

1. Click the Share button on the right side of the file.
2. Below Share Link, click the slider button for "Create shared link". Text will change to "Shared link is created" and a URL will appear.
3. Underneath the URL, change the access from "People in your company" or "Invited people only" to "People with the link". 
4. If the URL provided will work as it is, click Copy and move on to "Create link to the Box file" section. If a shortened or custom link is preferred, continue with next step in this section.
   
   
   
   
5. [optional]  Click "Link Settings".
6. [optional] Enter a custom path with no spaces (12-30 characters).
7. Click Save.
8. Click Copy to copy the URL to the clipboard for the next step.

Link to the Box file

1. In the Joomla article, select the text or image to be linked and click "Insert/edit link" tool.
2. Paste into the "URL" text box.
3. Select "Open in new window" for Target. This is standard for links to content on external websites though not used if the link opens in a popup. (See optional "Set the link to open in a popup window" section.)
   
   

   

4. Click Insert.
5. Save and Close.

Set the link to open in a popup window [optional]

1. While still in the Insert/Edit link window, click the "Popups" tab.
2. Select JCE MediaBox Popups in the Popup Type field.
3. Choose External Links/Iframe in Media Type.
4. Click Update or Save to save changes, whichever appears. If establishing the link initially,  Save will appear.  If the link is being modified, Update will show as the button text.  Both will save settings.
   

   

   
   
   
   

Overview

This document explains how to link text to a file that has already been uploaded to Media using JCE Editor Pro.

If you would like to upload and link to a document at the same time, see: Uploading and linking to PDF files using JCE Editor.

Procedure

• First, upload the file using JCE File Browser (JCE Editor PRO)
• Then, create or edit an article either in the front-end or the back-end
• In the article text area, type the text that will be linked to the file
• Highlight the text to be linked to the file
• Click the Insert/Edit link button on the editing toolbar:
  
  
• Click the "Browse" button to the right of the URL field (see #1 below)
  
  
• Browse the folder list to the left, then find the file that you uploaded earlier
• Click once on the name of the file you want to link to
• Click Insert to the lower right
• Recommended: Click the "Popups" tab (see #2 above)
  • For "Popup Type" select "JCE MediaBox Popups" (see #1 below)
  • Enter a title for the document in the "Title" field (see #2 below)
  • Click Insert to the lower right (see #3 below)
    
    
• Click Insert again
• Click Save & Close

Overview

In Joomla!, files such as PDFs and images (jpg, png, etc) are all stored in the "images" directory.  The exception is for files uploaded using a third-party document management extension such as DOCman.  These extensions have their own folder structure within the Joomla! website.

There are multiple ways to upload these files; follow the appropriate links below.

Uploading files to the "images" folder

The Media Manager in Joomla! and JCE Editor Pro both allow you to upload files to the "images" folder.

Media - for image files (gif, jpg, png, etc).

• Adding an Image to Media

JCE Editor File Browser - for PDF files

• Uploading and linking to files within articles using JCE Editor PRO
• Uploading a file using JCE File Browser

Uploading files with third-party extensions

DOCman, Ignite Gallery, and JEvents are all examples of third-party extensions that allow you to upload files to Joomla!.  The files are stored by the respective components within their own file structures, not the "images" folder.

DOCman

• Updating DOCman Documents with New Files
• Uploading and Publishing Documents using DOCman
• Uploading Multiple Files using DocMan

Ignite Gallery

• Uploading Images

JEvents

• Adding Images to Events using JEvents File Uploader Tool
• Adding PDFs to events using JEvents file uploader tool

Overview

This procedure describes how to find and resolve accessibility issues that may be present within PDF files.  All web content, including PDF files uploaded to websites, must be accessible to all users, including users with disabilities. 

Before remediating a PDF, consider whether it still needs to be hosted on your website.  It may be easier to remove old PDFs, and the links to those files, than it would be to complete the remediation process.

Procedure

Step 1) Back up your original PDF

Before proceeding, make a copy of your PDF file in case anything goes wrong during the remediation process. 

Step 2) Remediate original document (recommended if PDF document was originally created in Microsoft Word or PowerPoint)

For best results, we recommend remediating the original file (typically a Word document or PowerPoint presentation), then converting it to PDF and performing additional remediation within Acrobat. If your document was originally created using software other than Word or PowerPoint, skip this step.

If you have the original Word document or PowerPoint presentation, follow the appropriate documentation to remediate the original file:

• Remediating PowerPoint Presentations for Accessibility
• Remediating Word Documents for Accessibility

If you don't have the original Word document or PowerPoint presentation, you can export the PDF file to Word or PowerPoint as follows:

1. Open the presentation to be remediated using Adobe Acrobat. 
2. Under All tools to the left, select Export a PDF:
   
   
   
3. If the PDF is a syllabus, CV, or similar document in portrait layout, select Microsoft Word DOCX under "EXPORT PDF TO" and click Convert to DOCX:
   
   
   
4. If the PDF is a flyer, presentation slide, or similar file in landscape layout, select Microsoft PowerPoint PPTX under "EXPORT PDF TO" and click Convert to PPTX:
   
5. Select a location and file name for the converted file. The converted file will then open in Word or PowerPoint.
6. Close the original PDF file in Acrobat. 
7. Review the document to make sure it has been converted successfully.  If the text, images, or other elements are distorted or unreadable, close the converted Word or PowerPoint file and delete it.  Skip the rest of this section, and remediate the original PDF file following the steps under "Step 3) Remediate PDF file" below.
8. Follow the appropriate documentation to remediate the Word document or PowerPoint presentation:
   • Remediating PowerPoint Presentations for Accessibility
   • Remediating Word Documents for Accessibility
9. When all issues have been resolved, select the File menu:
   
   
   
10. Select Save to save your changes to the file.  Then consider the following two scenarios:
    • If the remediated file can remain as a PowerPoint or Word document, it may be more useful to your users than a PDF file.  In that case, upload the remediated PowerPoint or Word document to your website and stop here.
    • If there is a specific reason to keep the file in PDF format, continue following this procedure.
11. Select the File menu again.
12. Select Save as Adobe PDF:
    
    
    
13.  If asked, "Do you want PDFMaker to save the file and continue?" click Yes:
    
    
    
14. Save the Adobe PDF file to the appropriate location on your computer.  The PDF will open in Acrobat. 
15. Close the original Word or PowerPoint file.
16. Proceed to the next step, Remediate PDF File.

Step 3) Remediate PDF file

1. In Acrobat, under All tools, select View more:
   
   
   
2. Scroll down and select Prepare for accessibility:
   
   
   
3. Select Automatically tag PDF:
   
   
   
4. Click Confirm:
   
   
   The tagging progress will be shown to the upper right under Accessibility tags.  Wait for it to complete before proceeding to the next step.
   
   
5. Under Prepare for accessibility, select Fix reading order:
   
   
   
6. In the "Reading Order" dialog, click Show Order Panel:
   
   
   
7. In the Order sidebar to the right, select Page 1:
   
   
   
8. Ideally, Page 1 of your document will contain the title of the document. Mark the title as “Heading 1” as follows:
   •  Position the mouse cursor above and to the left of the box containing the page title:
     
     
     
   • Click and drag so that the mouse cursor creates an additional box around the page title. Then let go of the mouse button. The title text should now be selected:
     
     
     
   • Select the “Heading 1” button in the Reading Order dialog box:
     
     
     
   • Go back to the Reading Order by clicking Show Order Panel in the Reading Order dialog.
     
     
9. For each page in the document, drag and drop the numbered elements in the Order sidebar up and down until their numbered order matches the visual order of the elements (top to bottom and left to right).  For example, the uppermost element in the page should be numbered "[1]", the next element to the right of (or below) element "[1]" should be numbered "[2]", and so on.  In the following example, the numbering of the elements matches their visual order from top to bottom:
   
   
10.  Close the Reading Order dialog:
    
    
    
11. Under Prepare for accessibility, select Check for accessibility
    
    
    
12. In the Accessibility Checker Options dialog, click Start Checking:
    
    
    
13. The results of the check will be displayed under the Accessibility Checker sidebar to the right:
    
    
    
14. Use the arrows to the left to expand each category that displays a number of issues (see #1 below).  If the expanded categories have issues with sub-items, click their arrows to expand them as well (see #2 below).
    
    
    
15. Logical Reading Order - Needs manual check will always appear as an issue under Document. If you have already fixed the reading order, right-click on this issue and select Pass:
    
      
16. Color contrast - Needs manual check will always appear as an issue under Document. If you have already fixed color contrast issues in the original Word or PowerPoint file, or if there are no apparent color contrast issues, right-click on this issue and select Pass:
    
    If you are unsure if there is enough color contrast between the font colors and background colors, you can refer to the WebAIM Contrast Checker.
    
    We also recommend using only the colors listed at the Rutgers Color Contrast Look Up page at https://it.rutgers.edu/digital-accessibility/accessible-web-content/rutgers-branding-color-compatibility-tool/.  This page includes a color contrast widget that helps you determine which combinations of foreground color and background color pass the color contrast requirements in WCAG 2.1 AA.
    
    
17. To fix the issue Title – Failed follow these steps:
    
    • Right-click on Title – Failed in the Accessibility Checker sidebar, and select Fix::
      
      
      
    • In the Description dialog, clear the checkbox for “Leave As Is” under “Title” (see #1 below).
    • Enter the document title in the “Title” field (see #2 below).
    • Click the OK button in the Description dialog (see #3 below).
      
      
      
18. To fix the issue Figures alternate text - Failedunder Alternate Text, follow these steps: 
    
    
    • Right click on the first "Figure" listed under Figured alternate text - Failed, and select Fix:
      
      
      
      
    • If the image is relevant to the content of the document, enter a short, accurate description of the image in the text area labelled "Alternate text:" (see #1 below).
    • If the image is strictly decorative and does not relate to the content of the document, check the box for "Decorative figure" (see #2 below). 
    • If there are more images to fix, click the right arrow (see #3 below).  For each additional image, either enter alternate text or mark the image as decorative. 
    • When you have entered alternate text for the last image (or marked it as decorative), click Save & Close (see #4 below):
      
19. To fix issues with table header cells, do the following:
    • Under Prepare for accessibility, select Fix reading order (see step (5) above)
    • Click somewhere inside the table, then click the Table Editor button in the Reading Order dialog:
      
      
      
    • Right-click inside each cell that should be marked up as a header cell, and select Table Cell Properties:
      
      
      
    • Make sure Type is set to "Header Cell" (see #1 below)
    • Set Scope to "Column" for a header cell at the top of a column, or to "Row" for a header cell at the beginning of a row (see #2 below)
    • Click OK (see #3 below)
      
    • Repeat the above steps for any other cells that should be marked up as table header cells.
    • Return to the list of accessibility issues by clicking the Accessibility Checker icon in the right sidebar:
      
      
      
20. Drill down to any other remaining issues, right click them and select Fix. Follow the tips in Acrobat to fix the issues. 
21. Check for any untagged elements as follows:
    1. Click the "Accessibility Tags" icon on the right-side menu in Acrobat:
       
       
       
    2. Click the "Options" icon to the right of "Accessibility tags:"
       
       
       
    3. Select Find from the Accessibility Options menu:
       
       
       
    4. In the Find Element dialog, leave "Artifacts" selected and select Search Document(see #1 below).  Then click Find (see #2 below):
       
       
       
    5.  For each element found, click Tag Element:
       
       
       
    6. In the New Tag dialog, select the "Type" list option that best matches the element that is highlighted on the current page:
       
       If unsure which "Type" option to select, follow these guidelines:
       
       • For an entire page, select "Division"
       • For an image, select "Figure"
       • For a section of the page larger than a paragraph, select "Section"
       • For a line of text smaller than a paragraph, select "Span"
    7. After making a selection for "Type:" click the OK button:
       
       
       
    8.  Repeat steps (e), (f), and (g) above to tag any remaining elements.
    9. When all elements have been tagged, click OK at the message Find Completed:
       
       
       
    10. In the Find Element dialog, change the "Find" selection to "Unmarked Comments" and repeat steps (e) through (i) above to tag any unmarked comments.
    11. In the Find Element dialog, change the "Find" selection to "Unmarked Links" and repeat steps (e) through (i) above to tag any unmarked comments.
    12. In the Find Element dialog, change the "Find" selection to "Unmarked Annotations" and repeat steps (e) through (i) above to tag any unmarked comments.
    13. In the Find Element dialog, change the "Find" selection to "Unmarked Content" and repeat steps (e) through (i) above to tag any unmarked comments.
    14. In the Find Element dialog, change the "Find" selection to "OCR Suspects" and repeat steps (e) through (i) above to tag any unmarked comments.
    15. After all elements have been found and tagged, click Close at the Find Element dialog:
        
        
        
22. If any untagged elements were found and tagged, it may be necessary to fix the reading order again. Refer to steps (5) through (10) above to check the reading order and fix it if necessary.
23. Check the document for accessibility again; see steps (11) through (13) above. 
24. Fix any additional issues that were found; see steps (14) through (20) above. 
25. After all issues have been resolved, save the PDF file. 

Step 4) Scan your document for issues using third-party software

The accessibility scanner in Adobe Acrobat does not always detect all issues.  It is necessary to re-scan the document using software that can determine whether a document meets the WCAG 2.1 AA accessibility standards.

For this step, you will need to download and install the free CommonLook PDF Validator, available from: https://allyant.com/free-pdf-accessibility-checker-validator/. (Please note that this software only runs on Windows). 

To install this software on your office computer or RAD-managed computer, please do the following:

• Click the Windows Start icon
• In the Start Menu, click All to the right of Pinned
• Scroll down to the Rutgers SAS folder and click on it
• Click Install CommonLook PDF Validator:
  

Once CommonLook PDF Validator has been installed, use it to check your document as follows:

1.  Select the Menu to the upper left in Adobe Acrobat, then select Plugins > CommonLook > CommonLook PDF Validator: 
   
   
2. In the Standards pane to the upper right, click the arrow to expand Standards (see #1 below).
3. Click the arrow to expand Accessibility (see #2 below).
4. Select WCAG 2.1 AA (see #3 below).
5. Click the Full button to the lower right of the Standards pane to run a full scan of your document (see #4 below).
   
   
   
6. The results will appear in a new pane below the preview of your document. Click the Results column to sort the results by type:
   
   
   
7. If there are no “Failed” entries in the Results column, your PDF file is compliant with WCAG 2.1 AA and can be uploaded to the website.
8. If there are one or more “Failed” entries in the Results column, your PDF file is not compliant with WCAG 2.1 AA and needs additional remediation before it can be uploaded to your website.
   
   

Step 5) Upload your document to the website

1. Upload the PDF file to the same location on the website where the original PDF was located, so that the new PDF replaces the old one.  If you are unsure how to upload the new document, follow the steps for Uploading a file using JCE File Browser.

Overview

This procedure describes how to find and resolve accessibility issues that may be present within PowerPoint documents.  All web content, including PowerPoint presentations uploaded to websites, must be accessible to all users, including users with disabilities. 

Before remediating a presentation, consider whether it still needs to be hosted on your website.  It may be easier to remove old presentations, and the links to those presentations, than it would be to complete the remediation process.

Procedure

1. Open the presentation to be remediated using Microsoft PowerPoint . 
2. Click the Review menu:
   
   
   
3.  On the Review ribbon, select Check Accessibility (see #1 below), then select the Check Accessibility dropdown menu item (see #2 below):
   
   
   
   
4. Review the suggestions in the Accessibility Assistant sidebar to the right:
   
   
   
5. Items with a red check (see #1 above) have passed the accessibility check and do not need to be addressed. 
6. Items with a number (see #2 above) represent accessibility issues that need to be addressed.  Click on each item with a number and follow the suggestions to resolve the issue.
7. To fix the issue Missing alt text, follow these steps: 
   
   
   • If the image is relevant to the content of the document, enter a short, accurate description in the text area labelled "Enter image description" (see #1 below).
   • If the image is strictly decorative and does not relate to the content of the document, click the Mark as decorative link (see #2 below). 
     
     
     
8. After all issues have been resolved, save the PowerPoint presentation. 
9. Upload the PowerPoint presentation to the same location on the website where the original presentation was located, so that the new presentation replaces the old one. If you are unsure how to upload the new document, follow the steps for Uploading a file using JCE File Browser.

Overview

This procedure describes how to find and resolve accessibility issues that may be present within Word documents.  All web content, including Word documents uploaded to websites, must be accessible to all users, including users with disabilities. 

Before remediating a document, consider whether it still needs to be hosted on your website.  It may be easier to remove old documents, and the links to those documents, than it would be to complete the remediation process.

Procedure

1. Open the document to be remediated using Microsoft Word. 
2. Click the Review menu:
   
   
   
   
3.  On the Review ribbon, select Check Accessibility (see #1 below), then select the Check Accessibility dropdown menu item (see #2 below):
   
   
   
   
4. Review the suggestions in the Accessibility Assistant sidebar to the right:
   
   
   
   
5. Items with a blue check (see #1 above) have passed the accessibility check and do not need to be addressed. 
6. Items with a number (see #2 above) represent accessibility issues that need to be addressed.  Click on each item with a number and follow the suggestions to resolve the issue.
7. To fix the issue Missing alt text, follow these steps: 
   
   
   • If the image is relevant to the content of the document, enter a short, accurate description in the text area labelled "Enter image description" (see #1 below).
   • If the image is strictly decorative and does not relate to the content of the document, click the Mark as decorative link (see #2 below). 
     
     
     
8. After all issues have been resolved, save the Word document. 
9. Upload the Word document to the same location on the website where the original document was located, so that the new document replaces the old one. If you are unsure how to upload the new document, follow the steps for Uploading a file using JCE File Browser.

Overview

When uploading a PDF or non-image format file, use JCE File Browser instead of Media (used for images).  A bug in Joomla! prevents PDF files from being uploaded via Media.

Procedure

1. In the Joomla! back-end (Control Panel), go to Components > JCE Editor Pro > Control Panel
   
   
2. Click on the File Browsericon:
   
   
3. Once in the File Browser, look under Folders to the left. 
   • To upload directly to "images," don't select a folder; just proceed to the next step ("Click the Upload icon...")
   • To upload to an existing folder, browse to and select the folder.
   • To upload to a new folder:
     • Browse to the folder where the new folder should be located
     • Click New Folder to the upper right (see #1 below)
     • Enter a name for the folder in the New Folder popup window.  Do not use spaces or any special characters other than a dash ("-")
     • Click Create
     • Click on the new folder you created
4. Click the Upload icon to the upper right (see #2 below)
   
   
5.  Click Browse to the lower right (see #1 below).
   
6. Select one or more files from your computer, then click Upload (see #2 above).
   1. If you get the message "Upload failed!", the file may already exist.  Delete the current file following the next step (7a), then try to upload it again.
7. Once a file has been uploaded, you can select it, then do the following:
   1. Delete it - see icon #1 below
   2. Rename it - see icon #2 below
   3. Move it, by selecting "Cut" (see icon #4 below), browsing to another folder, and clicking "Copy" (see icon #3 below)
   4. The "View" icon (#5 below) may not work on PDFs, but should work with images.
      
8. Note: if you rename, move, or delete a file, any links to those files will no longer work.
   
   
   

Overview

JCE Editor PRO features a new "Insert/Edit File" button that can be used to quickly upload and link to a file while editing an article.  For websites with a small number of PDF files, this is a good alternative to DOCman.

If you anticipate that your website will need to include dozens of files, DOCman is a better option, since it allows you to move and rename documents without breaking any links to them. 

Procedure

• Select an article to edit following steps 1-3 of Basic Editing (front-end).
• Click the "Insert/Edit File" button:
• The "File Manager" popup window appears (see below)
• Select the folder where the file will be uploaded:
  • To upload to an existing folder, browse to and select the folder (see #1 below)
  • To upload to a new folder:
    • Browse to the folder where the new folder should be located (see #1 below)
    • Click New Folder (see #2 below)
    • Enter a name for the folder in the New Folder popup window.  Do not use spaces or any special characters other than a dash ("-")
    • Click Create
    • Click on the new folder you created
  • Click the Upload icon (see #3 below)
  
  
• Upload the file:
  • After clicking Upload, the "Upload" popup window appears (see below)
  • Click Browse to the lower right (see #1 below)
  • Select one or more files from your computer, then click Upload (see #2 below)
    
• Create the link to the file:
  • Select the file you uploaded (see #1 below)
  • Replace the filename in the "Text" field with a short description of the file.  This will appear in your article as text linking to the file (see #2 below)
  • Click Insert to the lower right (see #3 below)
    
    
•  Your file will appear as linked text within your article.

Example:

The link to your file will look like:

Campus Map

Overview

This page describes how to upload and link to a PDF file using the "Insert link" button.

To accomplish the same task, but with advanced options, see: Uploading and linking to files within articles using JCE Editor PRO

1) Find the Link tool.

• Select an article to edit following steps 1-3 of Basic Editing (front-end).
• Highlight the text in your article that will be linked to the file (see #1 below).
• Click the Insert/Edit link button on the editing toolbar (see #2 below).

2) Find the Browse button in the Link window.

• A Link popup window will appear.
• To the right of the URLfield, click the Browse icon.  It looks like a sheet of paper.

3) Navigate the File Browser.

• In the File Browser window, browse to the folder where the new file should be stored (see #1 below).
• Click Upload to the upper right (see #2 below).

4) Upload the file.

• Click Browse and navigate to the file to be uploaded (see #1 and #2 below).
• Click Upload (see #3 below).

5) Select the uploaded file.

• Make sure the newly uploaded file is highlighted in the File Browser window and the box to the left of it is checked (see #1 below).
• Click Insert to the lower right (see #2 below).
• Click Insert again at the Link popup window.

6) Save the changes.

Click Save (or Save & Close in the Joomla! back-end) to save the article.