Introduction
In this review, I will be reviewing the XPANDA Responsive Gallery Content Expander Plugin, a jQuery plugin designed to enable users to expand teaser items or thumbnail images to reveal related content. With its flexible and customizable design, XPANDA is perfect for a variety of content types, such as meet the team pages, image galleries, business services, and creative portfolios.
Review
With the latest version 1.2.1 released on August 28th, 2019, XPANDA has further solidified its position as a top-notch gallery plugin.
- Fluid, Fast, and Flexible: XPANDA utilizes the Flexbox CSS property to provide a more efficient and fluid way of laying out, aligning, and distributing space among the items. This ensures that the aspect ratios of the thumbnail images are preserved and never cropped, regardless of the dimensions.
- Many Customizable Options: Users can easily adjust the number of items per row for each breakpoint, along with vertical and horizontal spacing. Additionally, there are options to display a Call-To-Action, enable the lazyloader, enable auto-scrolling to the expanded item, and many more.
- Cross-Browser Responsive Design: XPANDA items adapt to the width of the containing parent element and has been tested on multiple browsers, including Chrome, Firefox, Safari, Opera, Internet Explorer 11+, Microsoft Edge, and various mobile browsers.
- Built-in Image Lazyloader: The plugin comes with a custom image lazyloader for both thumbnail and large images, eliminating the need for a third-party plugin.
- Beautiful Animations: XPANDA features slick sliding animations for expanding and collapsing items with smooth scrolling to active items.
- Multiple Galleries: Users can add multiple galleries on one page, each behaving independently of the others.
- History PushState: Support for history pushState has been added, allowing users to easily share links to specific expanded items.
- Support and Documentation: The plugin comes with 6 months of free support via the Support Forum, along with extensive documentation available before and after purchase to help users get the most out of XPANDA.
What People Are Saying
The reviews for XPANDA are overwhelmingly positive, with users praising its ease of use, excellent support, and customizable design. Some of the feedback includes:
- "Easy to work with and quick, excellent support!"
- "This is a great script and works great across platforms. Very well written with easy to customize code. Plus it can be used for so many different applications."
- "Excellent plugin with excellent support."
- "We love your plugin and will most likely purchase more licenses to use on other sites! The flexibility is awesome and it’s pretty easy to understand the documentation and implementation."
Changelog
XPANDA has a solid changelog, with frequent updates and bug fixes. The latest version 1.2.1 has added features such as:
- Added option to set the scrolltop offset in case of fixed headers
- Added a class to remove side margins to line up with columns found in css frameworks
- Upgraded jQuery to version 3.4.1
- Added support for backwards compatibility to jQuery 1.12.4
- Updated asset and info styling (flex order) to avoid hierarchical markup
Conclusion
Overall, XPANDA is an excellent gallery plugin that offers a high level of customization, flexibility, and ease of use. With its responsive design, beautiful animations, and built-in lazyloader, it’s no wonder why it has such a high rating. Whether you’re a developer, designer, or business owner, XPANDA is definitely worth considering for your next project.
Rating: 5/5
User Reviews
Be the first to review “XPANDA – Responsive Gallery Content Expander Plugin”
Introduction
Are you tired of traditional gallery plugins that are clunky and unresponsive on mobile devices? Look no further! The XPANDA - Responsive Gallery Content Expander Plugin is a game-changer. With its sleek and intuitive design, XPANDA allows you to create responsive and expandable galleries that seamlessly adapt to any screen size or device. In this tutorial, we will walk you through the process of setting up and using XPANDA to elevate your website's gallery content.
Getting Started
To get started with XPANDA, you'll need to follow these steps:
- Install and Activate the Plugin: Install XPANDA from the WordPress Plugin Directory or download it from the developer's website. Once installed, activate the plugin by clicking the "Activate" button.
- Configure the Plugin Settings: Click on the "XPANDA" menu in your WordPress dashboard and navigate to the "Settings" page. Here, you'll find various options to customize the plugin's behavior. You can adjust the transition speed, animation effects, and more to suit your needs.
- Create a New Gallery: Click on the "Gallery" menu in your WordPress dashboard and select "Add New" to create a new gallery. You can add images, videos, or other media to the gallery by clicking the "Add Media" button.
- Configure the Gallery Settings: On the "Gallery Settings" page, you'll find options to customize the gallery's layout, spacing, and more. You can also enable or disable the lightbox feature, which allows visitors to view images in a larger size.
Adding XPANDA to Your Gallery
Now that you've created a new gallery, it's time to add XPANDA to it. Follow these steps:
- Enable XPANDA on the Gallery: On the "Gallery Settings" page, scroll down to the "XPANDA" section and toggle the "Enable XPANDA" switch to the "ON" position.
- Configure XPANDA Options: You'll see several options to customize the XPANDA behavior, such as the animation direction, speed, and easing effect. Experiment with these options to find the combination that works best for your gallery.
- Save Changes: Click the "Save Changes" button to apply the XPANDA settings to your gallery.
Using XPANDA in Your Gallery
Now that XPANDA is enabled on your gallery, let's explore how to use it:
- Hover Over an Image: Hover your mouse over an image in the gallery to trigger the expansion animation. The image will grow in size, and you'll see a navigation arrow appear at the top of the image.
- Click the Arrow: Click the navigation arrow to navigate to the next or previous image in the gallery.
- Use the Lightbox: If you've enabled the lightbox feature, clicking on an image will open it in a larger size, allowing visitors to view it in more detail.
- Close the Expansion: Clicking anywhere outside the expanded image will close the expansion and return the image to its original size.
Customizing XPANDA
XPANDA offers a range of customization options to tailor the plugin to your website's unique needs. Here are a few tips:
- Customize the Animation: Experiment with the animation options to create a unique look and feel for your gallery.
- Change the Trigger: Instead of using a hover effect, you can set XPANDA to trigger on click or load.
- Modify the Lightbox: Adjust the lightbox settings to fit your website's design and layout.
Conclusion
With XPANDA - Responsive Gallery Content Expander Plugin, you can create stunning and responsive galleries that engage your visitors and enhance their browsing experience. By following this tutorial, you've learned how to set up and use XPANDA to elevate your website's gallery content. Don't be afraid to experiment with the plugin's customization options to create a unique look and feel for your website. Happy experimenting!
Navigation
xpanda_navigation_mode: 'horizontal'Container
xpanda_container_offset: 20
xpanda_container_duration: 600
xpanda_container_transition: 'ease'
xpanda_container_easeinout: 'in-out'
xpanda_container_expanded_offset: '200px'Trigger
xpanda_trigger_type: 'click'
xpanda_trigger_target: '.expand'
xpanda_trigger_width: 400
xpanda_trigger_offset: '200px'
xpanda_trigger_duration: 0.5
xpanda_trigger_transition: 'cubic-bezier(0.4, 0.0, 1.0, 1.0)'Content
xpanda_content_duration: 600
xpanda_content_transition: 'cubic-bezier(0.4, 0.0, 1.0, 1.0)'
xpanda_content_easeinout: 'in-out'
xpanda_content_expanded_height: '100px'
xpanda_content_auto_expanded: true
xpanda_content_expanded_max_height: 'none'Expander
xpanda_expander_duration: 600
xpanda_expander_transition: 'ease'
xpanda_expander_easeinout: 'in-out'
xpanda_expander_background_color: '#f8f8f8'
xpanda_expander_arrow_size: 20
xpanda_expander_close_text: 'Close'Here are the features of XPANDA - Responsive Gallery Content Expander Plugin:
- Fluid, Fast and Flexible: The plugin uses Flexbox CSS property to provide a more efficient and fluid way of laying out, aligning, and distributing space among the items. Flex values of thumbnail images are automatically calculated and applied, keeping the aspect ratios and never cropping the images.
- Many Customizable Options: Users can easily adjust the number of items per row for each breakpoint, vertical and horizontal spacing, display of Call-To-Action, enable lazyloader, and auto-scrolling to the expanded item, among other options.
- Cross-browser Responsive Design: The plugin adapts to the width of the containing parent element and has been tested on various browsers, including Chrome, Firefox, Safari, Opera, Internet Explorer 11+, Microsoft Edge, and mobile browsers. Users can also specify their own breakpoints.
- Built-in Image Lazyloader: A custom image lazyloader is built into the plugin for both thumbnail and large images, with the option to switch it off.
- Beautiful Animations: The plugin features slick sliding animations for expanding and collapsing items with smooth scrolling to active items.
- Multiple Galleries: Users can add multiple galleries on one page for separating staff members and portfolio or gallery categories, which all behave independently of each other.
- History pushState: The plugin supports history pushState (browser history), allowing users to easily share links to specific expanded items.
- Support and Documentation: The plugin comes with 6 months of free support via the Support Forum, as well as extensive documentation available before and after purchase.
- Free Photoshop Action: A free Photoshop action is included to blur and resize images to a very low filesize to speed up page loading time.
- 13 Pre-Built Examples: The plugin comes with 13 beautifully designed, ready-to-use examples for quick and easy implementation.
- Coming Soon: Many more examples and features are coming soon.
Changelog:
- Version 1.2.1 (28 Aug 2019): Added option to set scrolltop offset, added class to remove side margins, upgraded jQuery to version 3.4.1, added support for backwards compatibility to jQuery 1.12.4, and updated asset and info styling.
- Version 1.2.0 (4 May 2019): Added history pushState support, added option to have multiple instances interact with each other, and fixed scrolling to expanded item bug.
- Version 1.1.0 (8 October 2018): Added support for multiple gallery instances, sliding animation for expanding/collapsing with speed control, scrolling to active item animation with speed control, preloader, and refactored code to use promises.
- Version 1.0.0 (5 June 2018): Initial Release.
Related Products
.jpg?w=300&resize=300,300&ssl=1)
$14.00
There are no reviews yet.