Insert Gallery Images using MOS Image Mambot

What you will learn:

  • Upload images in Media Manager
  • Create a folder/directory in Media Manager
  • Use mosimage to show images in content
  • Edit image attributes

STEP 1:

From the ADMIN PANEL, click SITE >> MEDIA MANAGER. See image below:

Image

STEP 2:

In the Create Directory input box, type the name of the folder/directory of your choice
and hit the Create icon found in the Media Manager Toolbar.

Image

STEP 3:

Using the Directory Combo Box/Dropdown Box, Select the folder/directory that you just created. See image below.

Image

STEP 4:

Now you are ready to upload your image in the folder/directory you have created :). Click Browse, and locate the image to be uploaded. When you are ready hit the Upload Icon found in the Media Manager Toolbar.

Image

STEP 5:

When upload completes, the image is now inside the selected directory. See image below.

Image

STEP 6:

It's time to put the image in your content. In ADMIN PANEL, click >> CONTENTS >> SECTION OF YOUR CHOICE >> SECTION ITEMS.

NOTE: In this tutorial, I have used the Getting Started section and Welcome to Mambo as the item. See image below.

Image

STEP 7:

Click the CONTENT ITEM were you want the image to show or tick on the checkbox and click on EDIT icon in the toolbar. See image below.

NOTE: The blue text in the image is the selected item. CONTENT ITEM..

Image

STEP 8:

: In the IMAGE TAB >> MOSImage Control >> Sub-Folder. Select the folder/directory in which your image resides. See image below.

Image

STEP 9:

The list of images will be shown in the GALLERY IMAGES list box. Select the image you have just uploaded and click on ADD button. See image below.

Image

STEP 10:

The image has now been added in the CONTENT IMAGES list. See image below.

Image

STEP 11:

Now let's edit the image parameters. see image below.

NOTE: Every time you edit the image parameter always click the APPLY BUTTON

Image

Image Attribute :

  • ALT TEXT: This is used for the Caption, in the Gallery
  • APPLY BUTTON: Click Apply button every time you have edited the image attribute

STEP 12:

Add the mosimage parameter in the content were you want your image to appear. See image below:

Image

IMPORTTANT: The first mosimage (asterisk.png) in the content is the first image in the CONTENT IMAGES while the second mosimage is the logo.png, the image is which we uploaded earlier (SEE STEP 10 IMAGE) list. Mambo arranges images in TOP to BOTTOM order.

STEP 13:

Lastly, Save the content by clicking the SAVE icon found in the CONTENT ITEM Toolbar.