Woomark Image Gallery 2.2

Download

Installation

Downloading the Extension

Email : After purchasing the extension from our store, you will receive an email with the link to download the extension.

Store : You can also download the extension from the Downloads section of our store. If you are new to our store, then you have to first create an account using the same email address which you have used while purchasing the extension.

Click to download the extension package - WoomarkImageGallery_UNZIP.zip

Unzip the Package

  • UNZIP the package WoomarkImageGallery_UNZIP.zip using any file unzipper or winrar.
  • Upon unzipping the package you will find the following.
    • pkg_woomark_gallery_X.x.zip : The file is supported by both Joomla 3.x and 4.x
    • ReadMe.txt - The file has information about the current version of the extension.

Install the Extension

  • Now to install the file  login to the backend of your Joomla website.
    • For J3 - Go to Extensions > Extension Manager and click on the Upload Package File Tab. Click on browse to choose the correct installation file and click on "Upload and Install"
    • For J4 -  Go to System > Install > Extensions . Drag and drop or browse for file to install.
  • The success message will appear after installation is completed.

You can no use the module or plugin as per your requirements. Module can be published directly to a module position whereas for a plugin you have to insert the shortcode into an article.

Module Settings

After successful installation, to setup the module

  • For J3 - Go to Extensions > Module Manager
  • For J4 - Go to Content > Site Modules.

Search for Woomark Image Gallery, open it and set the module to a module position where you would like the module to appear and assign to a menu item. Now go to the Module settings tab.

Module Settings Tab

  • Fetch Image : You can fetch the images from a folder or select individual images/path
  • Sort Images: Option to sort the images of the gallery as Sequence(by name) or Random.
  • Thumb Width : Enter the width of the thumbnail image. Example 150 which implies 150px. Don't add px to it. The height will be automatically set proportionately.
  • Caption: You can set the caption for the images. Caption won't work if fetched from folder.
    • For Large Image Only
    • For Thumb Image Only
    • For Both large and Thumb Images.
    • None
  • Link : Option to set link for each image. When link is set for the images, the thumbnail will not open the large image as popup. It will open the link which has been assigned.
  • Open In : Option to open the link in new window or same window.
  • Grid Spacing: The spacing between the tab. It can be defined as a number. Example : 2

Slide Settings

The slide settings will only show up when the Fetch Image is set to Individual Path. Here are the option to set

  • Select and Image: Option to select the image from the media gallery.
  • Caption: Enter the caption for the image
  • URL : Enter the URL which you would like to open when the thumbnail image is clicked. Leave it blank if you don't want to link it to any URL.

You can click on the + button to add new slides and repeat the process.

Styling Settings

After setting the Module, you can now stylize it. Here are the options which you can find in the styling tab.

  • Background Color: Select the background color of the large image popup.
  • Opening Speed: Set the opening speed of the popup. Example : 500 which means 500 ms (milliseconds.
  • Closing Speed : Set the closing speed of the popup. Example: 300 which means 300 ms
  • Shadow Color: Select the shadow color of the popup image.
  • Shadow Width : Set the shadow width. Don't mention px.
  • Show Close Button: Option to enable/disbale the close button of the popup.
  • FancyBox Border Width : Mention the border width in px. Example: 5 which means 5px.
  • Opening And Closing Effect: Option to set the opening and closing effect to Elastic, Fade or none.

Plugin Setttings

If you are using the plugin, the go to the plugin manager and publish the Content - Woomark Image Gallery.

  • Fetch Image : Option to set the fetch image option to folder or individual path. The shortcode has to be entered into the article on the basis of the option selected.
  • Thumb Image Width: Set the thumb image width for the image gallery.
  • Large Image Caption : Option to enable the caption for large image. It works when the Fetch image is set to individual.
  • Offset : Enter the distance between grid items in pixels.

Shortcode

If you are using this plugin and you want to grab images from a folder. Then write the following pattern inside your article

Pattern:  

{wookmark}path/to/image_folder{end-wookmark}

Example

{wookmark}images/test/{end-wookmark}


2) If you want to grab individual images along with their title. Then use the
following pattern.

Pattern:  

{wookmark}image_path1,image_path2,image_path3{title}Title1,Title2,Title3{end-wookmark}

Example

{wookmark}images/test/new1.jpg,images/as/2.jpg,images/test/za.jpg{title}Text1,Text2,Text3{end-wookmark}