Caption Builder

Caption Builder is available in PRO version of Photo Gallery plugin and gives you more options for creating beautiful and colorful galleries.

Captions Settings are divided into 4 parts:

Background
Caption
Description
Icons
Caption settings include animation effects, text color, size and position, add new icons possibility and other options. All of them will be displayed when the mouse hover on the images.

Let’s see more details about all of these parts.

Background Settings

Here you have an option ability to customize your image background with amazing display effects that make your gallery more colorful and attractive:

• Color – set background color
• Transparency – set background transparency (in percent)
• Animation Effect – choose animation effect which will be displayed with your caption settings
• Image on hover – if this effect is enabled, the other image will be shown on the place of the current one, when hovering on it
• Personal captions – enable different caption effect per image on Images List. If the option is disabled chosen effect will be applied for all images
• Polaroid Style – displays images with special polaroid frame:
• Polaroid Image Animation – enables animation on hover for polaroid effect
• Polaroid Image Scattering – enables scattering for images
• Polaroid Frame Width – set frame width
• Hide image title tooltip – if selected Yes tooltip on hovering image will not appear
• Mobile –always shows caption – in order to show captions on mobile devices – select Yes
• Disable captions on mobile – check if you want to disable captions on mobile devices

Let’s see  the example of Gallery with Background Settings –

Caption Settings

You can configure caption text aspect – font size, style, color and position. You are able to specify caption text in Caption tab of gallery Images list.

• Height – choose the caption height in pixels or percents (for example: 33%, 50px).

• Position – select position where caption text will be displayed:
  • Top Left
  • Top Center
  • Top Right
  • Middle Left
  • Middle Center
  • Middle Right
  • Bottom Left
  • Bottom Center
  • Bottom Right
• Paddings – you can change the distance between caption text and image margin (in pixels):
  
  • Left
  • Right
  • Top
  • Bottom
• Font – here you can choose the font from the huge list of awesome fonts.
• Font size – select font size in pixels, percents or ems
• Text color – select caption text color
• Font style – here you can add an additional style for your caption text:
  • Bold
  • Italic
  • Line
• Text Highlight Color – set background caption color which will be displayed only on the height of the caption text
• Text Highlight Color Transparency – customize transparency for background caption

Below you can see gallery example with Background and Caption settings –

Description Settings

On your Images list you have Description tab where you can type images description.
These settings relate to the text you set in Description field:

• Position – select the position, which will display the description text:
  • Top Left
  • Top Center
  • Top Right
  • Middle Left
  • Middle Center
  • Middle Right
  • Bottom Left
  • Bottom Center
  • Bottom Right
• Paddings – you can change the distance from description text to image margin (in pixels):
  • Left
  • Right
  • Top
  • Bottom
• Font – you can choose the font from the huge list of awesome fonts
• Font size – select font size in pixels, percents or ems
• Text color – select description text color
• Font style – here you can add an additional style for your description text:
  • Bold
  • Italic
  • Line
• Text Highlight Color – set background description color which will be displayed only on the height of the description text
• Text Highlight Color Transparency – customize transparency for background description

Here is the example of gallery with Background, Caption and Deascription configurations –

Icons Settings

Show the amazing icons on the images preview. Unusual and creative effects will attract the attention of your readers.
Standard icons are specified by default  for popup image, link and video, but with Icons Settings you can choose your custom icons for different actions.

• Position – select the position, where  the icons will be displayed:
  • Top Left
  • Top Center
  • Top Right
  • Middle Left
  • Middle Center
  • Middle Right
  • Bottom Left
  • Bottom Center
  • Bottom Right
• Paddings – you can change the distance between icon and  image margin (in pixels):
  • Left
  • Right
  • Top
  • Bottom
• Use old icons and overlay – if you use our Photo Gallery plugin, before you can enable this option and display old icons, apply overlay settings
• Popup image icon – choose one icon that will be displayed on your image
• Video icon – set your personal icon for video
• Link icon – establish your personal icon for link
  Icon size – set icon size
• Icons color – select an icon color
• Icons hover color – set the icon color when mouse is over
• Icons Transparency – customize icon transparency (in percent)
• Background color – set  the background color for icons
• Background hover color – choose background hover color for icons
• Background Transparency – customize background transparency (in percent)
• Text Highlight Color – set background color which will be displayed only on the height of the icon (and on all image width)
• Text Highlight Color Transparency – set transparency of background color
• Distance between icons – enter the distance which will be between icons
• Animation Effects – select animation effect for icons

And here goes the last gallery example, which is fully customized with all Caption Builder settings –