Web Development Documentation

Creating a Popup Link to a file with JCE Editor Image Manager Extended

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.

Procedure

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

JCE Editor Pro: "Insert/Edit Image" button (with star)

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):

    JCE Editor: Image Manager Extended, "Folders" pane and "Upload" button
  • 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):

    "Upload" popup window

  • Once you have located or uploaded your image, select its filename from the "Name" pane:

    JCE Editor: Image Manager Extended, Select filename

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 (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)
    JCE Editor: Image Manager Extended, "Popups" tab
  • 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.

 

Joomla-Workshops-Button-Hugo