Lightbox Images for Divi Enhanced vs NextGen NivoSlider

The main purpose of the ‘Lightbox Images for Divi’ plugin is to extend Divi’s native lightbox functionality to all auto-linked images, not just Divi galleries. Requirements: This plugin requires ONE of the following to be installed and active: * Divi Theme (version 4.10 or higher) * Divi Builder Plugin (version 4.10 or higher) The plugin will automatically check for these requirements during activation and will not activate if they are not met. Main features: Full Divi 5 Support: Works with Divi 5 pages, including backwards compatibility mode. No jQuery required — the plugin works in vanilla JavaScript with an elegant built-in lightbox when Magnific Popup is not available Attachment Page Links: Now handles images linked to WordPress attachment pages (not just direct image URLs), resolving the full-size image automatically Dependency Checking: Automatically verifies Divi theme or Divi Builder plugin is active before allowing activation Extended Compatibility: Works with the Divi or Divi Builder theme, compatible with Divi 4.10+ and Divi 5 Native Integration: Uses Divi’s Magnific Popup when available, falls back to a lightweight built-in lightbox otherwise Easy to Use: Simply install and activate the plugin. No additional configuration is required Optimized Performance: Vanilla JavaScript with no hard dependencies. CSS and JS loaded conditionally Ready for the Future: Works in both Divi 4 (jQuery/Magnific Popup) and Divi 5 (vanilla JS fallback) environments Extensible: Includes a filter (ayudawp_lightbox_selectors) that allows developers to customize CSS selectors to include or exclude specific elements This plugin enhances the user experience on websites built with Divi, ensuring that any image linked to itself (i.e., clicking on it opens the image in its full size) is displayed in a lightbox effect. Unlike Divi’s default functionality, which often restricts this effect to galleries, this plugin extends it to all individual images, providing a consistent and engaging visual experience. The plugin is ideal for photographers, bloggers, and any Divi user who wants to offer a more polished and professional image viewing experience without the need for complex configurations or additional gallery plugins. Support Need private support or custom development? Do you need one-on-one help, priority troubleshooting, or a custom feature, integration, or tweak built specifically for your site? I offer private support and custom development. Just contact me and tell me what you need. Need help or have suggestions? Official website WordPress support forum YouTube channel Documentation and tutorials Love the plugin? Please leave us a 5-star review and help spread the word! About AyudaWP We are specialists in WordPress security, SEO, and performance optimization plugins. We create tools that solve real problems for WordPress site owners while maintaining the highest coding standards and accessibility requirements.

NextGen NivoSlider allows you to create a NivoSlider as a widget or with a shortcode. This plugin uses the ‘NextGen Gallery’ plugin to obtain the images using tags or gallery IDs. NivoSlider is a great responsive image slideshow that is highly customizable. With a large array of effects and many additional options you are sure to find a combination that will suit your website. Requirements: NextGen Gallery Plugin Features: NextGen NivoSlider has been completely overhauled and is continually being added to. It currently supports all the of NivoSlider’s original functions and even has some extra’s! Responsive! Fully integrated with NextGen gallery Theme support Automatic URL linking (put a mailto:, http://, ftp:// or local / into your alt text) Extra effect(s) Shortcode and Widget support Touchscreen support (experimental) Parameters: You can use the following parameters in the [ngg-nivoslider] shortcode. Defaults, where applicable, are shown between parentheses (), available options between brackets []. title: Title for slider. Leave blank for no title. (ex: title=”My Slider”) gallery: Leave blank to use all galleries or choose a gallery to use. (ex: gallery=”galleryid”) order [random”|”asc”|”desc”|”sortorder”]: Order to display results in. You can choose; Random, Latest First, Oldest First, or NextGen Sortorder. Random will still work when a page is cached. (ex: order=”random”) tags: comma separated list of tags to filter results by. (ex: tags=”tag1, tag2″) shuffle [boolean]: If order is random and this is true will shuffle images with javascript. Useful if your are caching your pages. (ex: shuffle=”true”) max_pictures: The maximum amount of pictures to load. (ex: max_pictures=”6″) html_id (“slider”): HTML id to use. Defaults to ‘slider’. Needs to be different for multiple sliders on same page. (ex: html_id=”custom-slider”) width: Width to use on slider. (ex: width=”200″) height: Height to use on slider. (ex: height=”150″) center: Centers content in container. Requires width to be set. (ex: center=”1″) resize: Resizes the images using TimThumb(v2). Available options are: (ex: resize=”3″) 1 – Resize to Fit specified dimensions (no cropping) 2 – Crop and resize to best fit the dimensions (default) 3 – Resize proportionally to fit entire image into specified dimensions, and add borders if required 4 – Resize proportionally adjusting size of scaled image so there are no borders gaps resizewidth: The width TimThumb will use to resize the image (sc: resizewidth=”800″) resizeheight: The height TimThumb will use to resize the image (sc: resizeheight=”600″) resizebg (“ffffff”): The color (denoted in hex) to use for the borders that are generated when using resizing option 3 (ex: resizebg=”a0fb69″) caption [“alttext”|”description”|”both”]: Show a caption with the slide, showing either the alttext or description as set up in NextGen gallery or both as “Bolded AltText – Description” htmlcaption: HTML formatted caption to show on all images (ex: htmlcaption=”Title Welcome to this website“) showgallerytitle [boolean]: Display the gallery title (ex: showgallerytitle=”true”) showgallerydesc [boolean]: Display the gallery description (ex: showgallerydesc=”true”) Nivo slider settings: Please check the NivoSlider website for more details. effect: What effect to use as transition. You can specify sets like: ‘fold,fade,sliceDown’. See list below for available effects.(ex: effect=”sliceDown,sliceUp”) slices: The amount of slices to divide the image to for the slice effects(ex: slices=”3″) boxCols: Amount of columns to split the image into for the box effects (ex: boxcols=”10″) boxRows: Amount of row to split the image into for the box effects (ex: boxrows=”8″) animSpeed: Slide transition speed in milliseconds (1000ms = 1 second). (ex: animspeed=”300″) pauseTime: Time to pause in milliseconds (1000ms = 1 second) before continueing to the next image (ex: pausetime=”5000″) startSlide: Set starting Slide. It’s 0-index so use 0 for the first slide. (ex: startslide=”3″) directionNav [“true”|”false”]: Whether to display the Next & Prev controls or not. (ex: directionnav=”true”) controlNav [“true”|”false”]: 1,2,3… (ex: controlnav=”setting”) controlNavThumbs [“true”|”false”]: Use thumbnails for Control Nav if set to true. (ex: controlnavthumbs=”true”) thumbsWidth: Resize thumbnail to this width. Recommended to set if using thumbnails. (ex: thumbswidth=”20″) thumbsHeight: Resize thumbnail to this height. Recommended to set if using thumbnails. (ex: thumbsheight=”20″) thumbsContainerHeight: Height for thumbnails container. Calculation should be ‘number of thumbnail image rows’ x ‘thumbsheight’. (ex: thumbscontainerheight=”20″) thumbsGap: Gap between thumbnails. (ex: thumbsgap=”5″) controlNavThumbsFromRel: Use image rel for thumbs. (ex: controlnavthumbsfromrel=”setting”) controlNavThumbsSearch: Replace this with… (ex: controlnavthumbssearch=”setting”) controlNavThumbsReplace: …this in thumb Image src. (ex: controlnavthumbsreplace=”setting”) keyboardNav: Use left & right arrows. (ex: keyboardnav=”setting”) pauseOnHover: Stop animation while hovering. (ex: pauseonhover=”setting”) manualAdvance: Force manual transitions. (ex: manualadvance=”setting”) prexText: Text to display for previous (ex: prevtext=”prev”) nextText: Text to display for next (ex: prevtext=”next”) randomStart [“true”|”false”]: Start with a random slide (ex: randomstart=”true”) captionOpacity: Universal caption opacity. (ex: captionopacity=”setting”) disableCaptions: (ex: disablecaptions=”1″) beforeChange: (ex: beforechange=”setting”) afterChange: (ex: afterchange=”setting”) slideshowEnd: Triggers after all slides have been shown. (ex: slideshowend=”setting”) lastSlide: Triggers when last slide is shown. (ex: lastslide=”setting”) afterLoad: Triggers when slider has loaded. (ex: afterload=”setting”) Nivo Effects: random sliceDown sliceDownLeft sliceUp sliceUpLeft sliceUpDown sliceUpDownLeft fold foldReverse fade slideInRight slideInLeft boxRandom boxRain boxRainReverse boxRainGrow boxRainGrowReverse Shortcode examples: [ngg-nivoslider html_id=”about-slider”] [ngg-nivoslider title=”Hello” gallery=”1″ html_id=”about-slider” width=”200″ height=”150″ center=”1″] [ngg-nivoslider html_id=”about-slider” directionnav=”false” controlnav=”false”] [ngg-nivoslider tags=slideshow order=”random” effect=”fade” shuffle=”true” max_pictures=”12″ html_id=”slider” resizebg=”fdfdfd” resizewidth=”900″ resizeheight=”620″ resize=”3″ center=”1″ directionNav=”false” controlNav=”false” pauseTime=”10000″ animSpeed=”1000″ pauseOnHover=”false”] To do Feel free to suggest new features or things you’d like to see in this plugin! Create some extra themes. Scrollable thumbnails?