1. Home
  2. Docs
  3. Sky Addons for Elementor
  4. Gallery Widgets
  5. Reveal Gallery

Reveal Gallery

How to use Reveal Gallery Widget of Sky Addons for Elementor

Sky Addons Reveal Gallery Widget is a powerful tool that lets you create visually engaging galleries with a unique reveal effect. Perfect for showcasing portfolios, product showcases, or any collection of images, this widget adds a touch of interactivity to your Elementor website. It’s part of the essential addons for Elementor, designed to enhance your elementor page builder experience. Whether you’re building a landing page or a full-fledged elementor website, the Reveal Gallery widget offers a dynamic way to present your content. It seamlessly integrates with elementor pro and works with free elementor templates, making it a versatile addition to your elements pack.

Description:

The Reveal Gallery widget is designed to captivate your audience with its stylish reveal effect. Instead of static images, each gallery item subtly unveils its content on hover, creating an engaging user experience. This widget is ideal for anyone looking to elevate their elementor templates and themes. It’s incredibly user-friendly, allowing you to easily add titles, categories, and links to each item. Whether you’re a seasoned designer or just starting with elementor wordpress, you’ll find this widget intuitive and easy to customize. It’s a fantastic way to create an elementor landing page that stands out. As part of the premium addons for elementor, it offers advanced features without sacrificing ease of use. The Reveal Gallery widget is a must-have for anyone serious about building a visually stunning elementor website builder. It’s also fully compatible with elementor kit library.

Key Features List:

  1. Dynamic Reveal Effect: Creates an engaging user experience by revealing content on hover.
  2. Customizable Content: Allows you to add titles, categories, and links to each gallery item.
  3. Seamless Integration: Works perfectly with Elementor and Elementor Pro.

Inserting the Reveal Gallery Widget

  1. Open the Elementor Editor. In the Elementor panel, search for “Reveal Gallery.”
  2. Drag and Drop the Widget to the desired location on your page/editor.

Content Section

This section allows you to define the content that will be displayed in the reveal gallery.

Content Source

Choose where the content comes from.

  • Default Repeater: Manually add each item with its own title, category, and image.
  • Dynamic Posts: (Future Update) Pull content dynamically from your WordPress posts.

Items (Repeater)

This is where you add and customize each gallery item.

  1. Title: Enter the title for the gallery item. This will be displayed prominently.
  2. Category: Add a category or source label for the item. This could be a type of project or a source.
  3. Image: Upload or select an image from your media library. This image will be revealed on hover.
  4. Link: Add a URL to link the gallery item to a specific page or external site.

Query Section

This section is available when you select “Dynamic Posts” as the content source. It allows you to filter and order the posts that are displayed in the gallery.

Additional Section

This section provides additional options for customizing the gallery.

  1. Title HTML Tag: Choose the HTML tag for the title (e.g., H1, H2, H3). This is important for SEO and accessibility.

Style Customization

The Style tab allows you to customize the appearance of the Reveal Gallery widget, including the layout, title, category, and image styles.

Layout Section

Customize the overall layout of the gallery items.

  1. Padding: Adjust the padding around each gallery item to control spacing.
  2. Border Bottom Size: Set the size of the border at the bottom of each item.
  3. Border Bottom Color: Choose the color of the border at the bottom of each item.
  4. Background (Normal): Set the background color or gradient for the normal state of the gallery item.
  5. Background (Hover): Set the background color or gradient for the hover state of the gallery item.

Title Section

Customize the appearance of the title.

  1. Color: Choose the color of the title text.
  2. Hover Color: Choose the color of the title text on hover.
  3. Typography: Adjust the font family, size, weight, and other typography settings for the title.
  4. Text Stroke: Add a stroke around the title text for emphasis.

Postfix / Category Section

Customize the appearance of the category/source label.

  1. Typography: Adjust the font family, size, weight, and other typography settings for the category.
  2. Padding: Adjust the padding around the category label.
  3. Border: Add a border around the category label.
  4. Border Radius: Round the corners of the category label.
  5. Color (Normal): Choose the color of the category text in its normal state.
  6. Background (Normal): Set the background color or gradient for the category label in its normal state.
  7. Box Shadow (Normal): Add a shadow to the category label in its normal state.
  8. Color (Hover): Choose the color of the category text on hover.
  9. Background (Hover): Set the background color or gradient for the category label on hover.
  10. Box Shadow (Hover): Add a shadow to the category label on hover.

Image Section

Customize the appearance of the revealed image.

  1. Height: Set the height of the image container.
  2. Width: Set the width of the image container.
  3. Border: Add a border around the image.
  4. Border Radius: Round the corners of the image.

Save and Preview

  1. Once you’ve customized and styled your gallery, click “Publish” or “Update” to save your changes.
  2. Preview the page to ensure the widget looks and functions as desired.

Troubleshooting

  1. Image Not Displaying: Ensure the image URL is correct and the image file exists.
  2. Reveal Effect Not Working: Make sure the necessary JavaScript files (GSAP) are loaded correctly.

Conclusion

The Sky Addons Reveal Gallery Widget is a fantastic way to create visually appealing and interactive galleries on your Elementor website. With its easy-to-use interface and extensive customization options, you can create stunning showcases that captivate your audience.

If you have any questions or encounter any challenges while using, please don’t hesitate to reach out to our dedicated support team at https://wowdevs.com/support/ where our expert team is ready to provide prompt and helpful assistance.

How can we help?

Leave a Reply