CodeCanyon Epic Gallery - WordPress Plugin

CodeCanyon Epic Gallery Setup and Usage Guide

This guide to CodeCanyon Epic Gallery will help you build a manageable photo gallery, prepare images and pages, configure zoom and captions, verify how it behaves on the public-facing site, and decide safely whether this display method suits your project. Rather than repeating the plugin's general product pitch, the sections below walk through a practical path from the WordPress Media Library to a finished gallery embedded with Elementor, WPBakery, a widget, a shortcode, or the standard media gallery.

This solution has one important characteristic: it does not require you to maintain a separate private photo catalog. Its source material remains WordPress images or site posts, while the module controls how that material is displayed - standard browsing, expanded viewing, zooming, captions, and, where deliberately needed, an advertising area in the viewer. As a result, the quality of the finished gallery depends on more than clicking an add button. You need a clear image selection, a logical order, prepared captions, careful placement in the layout, and a separate check of what visitors actually see on desktop and mobile screens.

The developer documentation calls the product Epic Gallery, while the marketplace listing refers to it as CodeCanyon Epic Gallery or Epic Zoom Gallery. These names refer to the same plugin throughout this guide. Confirmed display methods include Elementor and WPBakery elements, a WordPress widget, shortcodes for images and posts, and gallery settings in the Add Media window. This is useful when the same collection needs to appear both on a landing page and inside editorial content, but it does not imply automatic synchronization between different sets of files.

What a Zoomable Gallery Is Designed to Do

A standard thumbnail grid works well when visitors only need a quick sense of the subject. Portfolios, work catalogs, editorial photo essays, real-estate pages, design-team showcases, and articles with large illustrations often require the next step: visitors want to inspect a detail without losing the context of the page. CodeCanyon Epic Gallery is built around that transition. The gallery can remain part of the content while opening a larger view with zoom and descriptive text when a visitor selects an image.

In practice, this separates the task into two layers. The first is the content layer: which images to show, in what order, what the title and caption say, and which images should not be published. The second is the presentation layer: how visitors enter the viewer, whether they can zoom in, how visible the description is, whether full-screen mode is needed, and whether a dark or light theme interferes with reading. If you try to solve the presentation layer first and choose the images afterward, the gallery may look impressive in one example but become inconvenient in real content.

The plugin supports two distinct types of source material. An image gallery is suitable for a set of files from the Media Library: product photographs, process steps, article illustrations, interiors, or visual samples. A post gallery is appropriate when each card should lead readers to a separate post or display dynamic post data. Do not mix these use cases in one container simply because both may look like a grid. Their editorial requirements differ: files depend on resolution, cropping, and captions, while posts depend on titles, featured images, publication status, and links.

When This Choice Makes Sense

The plugin is especially appropriate when the main content benefits from a closer look at each image. For example, an architecture firm might place five wide shots and one large facade detail on a project page. The outer grid helps visitors compare compositions, while zoom lets them inspect the detail. An editorial team can include a photo series in a long-form article and add explanations to individual images. A manufacturing company can show one stage per image without overloading the page with identical cards.

In these cases, answer one simple question in advance: what should visitors do after opening an image? If they need to compare color, texture, a diagram, text on a sign, or a stage of work, zooming has a clear purpose. If the photographs serve only as decorative imagery, a standard optimized gallery or a single image is enough. The latter situation does not need a complex viewer, and additional controls will increase page weight and create more opportunities for conflicts with the theme's styles.

Who the Plugin Works Well For - and Who May Need Another Option

CodeCanyon Epic Gallery suits site editors who already work in Elementor or WPBakery and want to add a gallery as a familiar layout element. It is also useful for site owners with a traditional editorial workflow: the collection can be inserted through the media gallery, or, if the display location is determined by a template or widget, through the relevant WordPress mechanism. Developers may find shortcodes convenient when the output must appear where there is no visual builder but the required IDs are already known.

It is less suitable for a new site built exclusively with the WordPress block editor that deliberately does not use Elementor, WPBakery, classic widgets, or shortcodes. The product page states that it is not optimized for Gutenberg, so block-editor support should not be treated as confirmed. In that situation, first create a test page on a copy of the site and check whether your theme provides a safe way to insert a shortcode. Do not turn the absence of a confirmed block into an unsupported compatibility claim.

This is also not a tool for managing a massive photo archive. It presents already prepared material; it does not handle storage rules, image rights, RAW processing, backups, or bulk compression. For collections containing hundreds or thousands of images, establish a media workflow and folder or taxonomy rules first, then add a showcase to specific pages. This substantially reduces the risk of accidentally displaying draft, duplicate, or oversized files.

Feature Map: Source, Viewer, and Display Location

The easiest way to think about Epic Gallery is not as a single button, but as a combination of three decisions. First, choose the source - images or posts. Next, choose the display mode - a compact gallery, an expanded viewer, zooming, captions, or a light or dark theme. Then decide on the display location - a builder element, widget, shortcode, or media-gallery setting. If any of these three questions is skipped, editors often end up with an unpredictable insertion: the right images are available, but they appear in the wrong place or fail to explain why visitors should open them at a larger size.

The official shortcode examples use [eg_image_gallery image_gallery="80,79,78,77"] and [eg_post_gallery include_post="2279,2314,2273"]. These are examples of the format, not universal values. Do not copy the numbers from an example into a live page: they belong to a different installation. Your IDs come from your own WordPress database, so first create a small test collection of three items and only then apply the method to a larger page.

A practical limit: zooming improves the viewing of a good original image, but it does not fix a poorly shot, excessively compressed, or randomly cropped file. Before configuring effects, keep only assets that have a clear role on the page.

Prepare Your Content and Environment Before Installation

The most common gallery-launch mistake is treating installation as the start of the work. In reality, preparation starts earlier: with selecting files, confirming that they open correctly, and deciding exactly where they will live. Epic Gallery uses familiar WordPress mechanisms, so there is no need to create a parallel collection containing the same images. It is far more useful to organize the existing Media Library and define a short workflow: which content introduces the gallery, which images come first, which caption answers the visitor's question, and what should happen when an image is selected.

Start with a copy of the page or a separate draft post. This is not just a formality. Themes, caching, script minification, image optimization, and sometimes page builders all operate at the same time in a gallery. A test page makes it easier to notice that a dark theme clashes with the background, an overlay viewer is covered by the header, or a description is too long. It also allows editors to reorder images and test captions without changing published content for visitors.

Image Checklist

Build a small initial collection of five to seven files. That is enough to test navigation, zooming, captions, and the above-the-fold area, but not so many that an issue can hide among dozens of cards. Each file should have one role: an overview, a detail, a sequential step, a comparison, a subject portrait, or an explanatory diagram. Do not place five nearly identical images together simply because they came from the same shoot. Repetitive imagery makes even a technically sound gallery tiring to use.

• Check the source resolution. The image should remain detailed enough in the intended enlarged view without being needlessly heavy for the page.
• Prepare the order. The first image introduces the collection, the following images develop it, and the last should conclude the idea rather than feel like a random leftover.
• Write captions. One precise sentence is enough for every important image: what it shows, which detail to notice, and why it matters.
• Check publication rights. A gallery does not change the right to use a file. Material suitable for internal discussion may not be suitable for public display.
• Add alternative text. It is useful when an image fails to load or a visitor uses assistive technology, but it should not be a collection of keywords.

Do not confuse an image caption, filename, and alternative text. A caption can explain context to visitors: "Facade detail after restoration." Alternative text should briefly convey the content: "Stone facade with restored window openings." A filename should be technically clear and free of chaotic spaces. This does not guarantee an SEO benefit, but it makes editing easier and reduces the chance that the wrong version ends up in the gallery.

WordPress Environment and Builder Compatibility

Before installation, note which editor created the target page. Epic Gallery is officially listed for Elementor and WPBakery, and its documentation shows separate methods for adding it in both builders. If the page was built with either one, start with that builder's element: it is easier to control container width, section order, and theme spacing. A widget is appropriate for an area that the theme actually renders as a widget area. A shortcode is useful in content, a post template, or another location where text-based shortcode output is supported.

Do not assume automatically that the Elementor and WPBakery elements will produce identical appearances. The plugin may display the same collection, but its surrounding context differs: column width, global spacing, theme settings, responsive rules, and additional builder styles. For one page, choose one primary insertion method. Do not place the same collection through a widget, shortcode, and builder element at the same time while expecting them to share settings. That approach creates duplicates on the page and makes troubleshooting more difficult.

If the site uses a caching or optimization plugin, temporarily note which script-combining and deferred-script settings are active. Do not disable anything blindly on a live site. First open the page in a standard browser window and in a private window. If behavior differs, that is a signal to check the cache rather than reinstall Epic Gallery. The same principle applies to the theme: if it has its own image lightbox, decide in advance which solution controls the click. Two independent handlers attached to the same image usually interfere with one another rather than adding useful functionality.

Safe Installation Without Unnecessary Steps

The developer's official instructions describe a standard WordPress installation: select the installable archive epic-gallery.zip from the package you received, upload it through the plugin-add screen, install it, and activate it. If you received a full package, do not upload the entire package without checking its contents. It may include documentation and additional materials, while WordPress expects the plugin archive itself. The error "The package could not be installed. The plugin does not have a valid header." often means the wrong file was selected, not that there is a server problem.

1. Create a restore point for the site and make sure you know how to return to the previous state.
2. In the WordPress admin area, open Plugins, then select Add New and Upload Plugin.
3. Select the verified epic-gallery.zip archive, complete the installation, and click Activate.
4. Make sure the plugin list does not contain a second accidentally installed copy or an extracted archive with a similar name.
5. Create a draft page and insert one Epic Gallery element using the chosen method, without changing the theme, cache, and builder at the same time.

For technical updates, the developer recommends creating a backup of files and the database in advance, then clearing the browser cache afterward. Even if gallery assets are stored in WordPress, that is not a reason to update a live site without testing. First review the change list, then reproduce the key workflow on a copy: open the collection, move between images, check the description, close the viewer, and confirm that regular images on the page have not lost their click behavior.

Installation through server file access is needed only when a normal admin-area upload is unavailable or restricted by infrastructure. It is a higher-risk path: an incorrect folder name, incomplete upload, or wrong permissions can make the plugin unavailable. Do not turn this method into routine practice for an editorial site. If server access must be used, preserve the old folder separately before replacement and do not edit plugin files manually. Manual changes will disappear during the next update and make it harder to get support.

First Check After Activation

After activation, do not spend time configuring a full showcase. Find Epic Gallery in the Elementor or WPBakery element list, or open a draft post and add a standard media gallery. The first check has a narrow purpose: prove that the component is available and can display three selected images. If the element does not appear in the builder, confirm that it is active, that you opened the correct page in the same editor, and that no mode is enabled that hides third-party elements. At this stage, there is no need to change the site's global styles.

Make it work in a draft first, then move the gallery into the published layout. This separates an installation issue from a theme, container, or caching issue and makes the rest of the configuration much calmer.

Initial Configuration in the WordPress Media Gallery

The media gallery is useful when the collection should be part of a post rather than an independent page block. In the official workflow, open the needed post, place the cursor where the collection will go, click Add Media, select Create Gallery, choose several images, and proceed to edit the new gallery. This is where you set file order and captions. An Epic Gallery settings area then appears on the right side of the editor for that specific insertion.

The first setting that should actually be enabled is Enable Epic Slider Gallery. It changes the created media gallery into Epic Gallery mode. After saving, open the post on the public-facing site. If you see a normal standard gallery, do not add a second shortcode over the first one. Return to the post, make sure the setting is enabled for the correct insertion, and verify that you are editing the published version rather than a similar draft or template.

The next setting is Use Slider Zoom with Description. Enable it when the caption contains information visitors need to read in enlarged mode: a work number, material, stage, or explanation of a diagram. If captions are decorative or repeat the obvious, do not enable the feature simply because it is available. During testing, open an image, zoom in, and evaluate two things: the description must not cover a critical part of the image, and its length must not turn the viewer into a long article.

The Show Ads Wrapper setting requires a separate editorial decision. The documentation connects it with displaying an advertising block in the enlarged viewer, and the product page mentions advertising capabilities in the preview gallery. This is not a default setting for every collection. Enable it only when the site already has an approved advertising placement, clear spacing requirements, and a separate check that the block does not cover the image, navigation, or description. A cleaner viewer is generally more useful for portfolios, tutorials, museum collections, or pages containing technical diagrams.

Finally, the Slider Title field names the collection itself. Use it as a brief guide: "Installation Stages," "Interior After Renovation," or "Collection Details." Do not repeat the page's full primary heading here. A good title has one purpose: visitors understand what connects the photographs before opening the first image. An overly long title competes with the caption and often disrupts the layout on a narrow screen.

Building a Gallery with Elementor and WPBakery

When a gallery needs to be part of a deliberately designed page, the Epic Gallery element in a visual builder is usually more convenient. The official documentation confirms that an element is available for both Elementor and WPBakery. The underlying principle is the same: open the editor, find the element by name, place it in a prepared container, and configure the source. However, the workflow differs from the media gallery: first design the gallery's place on the page, then choose the images, and finally check the appearance in the context of neighboring blocks.

Do not begin with the zoom effect. First decide what the section is meant to accomplish. For a studio page, it may be three works that lead into a closer view. For a service page, it may be a sequence of before-and-after stages. For an author article, it may be one image after the introduction and a small collection closer to the conclusion. Once the section's purpose is clear, it becomes easier to decide how many images to show and where to leave breathing room. Builders make it easy to add another row, but an unnecessary gallery can turn a page into an endless feed of similar images.

Elementor Workflow

Open the target page in Elementor and find a location where the collection genuinely supports the text or the page's purpose. Add a new container or use an existing section, then find Epic Gallery in the element list. After inserting it, do not rush to fill in every field. Save the page first and make sure the element itself is present on the canvas. This is a simple but valuable check: if the element is not visible, the issue lies with the add-on's availability or the editor, not with the images.

Next, attach a small test set. Choose the images, define a clear order, and check the width of the parent container. A wide collection inside a narrow column may look like cramped thumbnails, while an overly wide gallery beside lengthy text can disrupt the reading rhythm. Place the block after a relevant subheading or next to a short explanation, rather than between two sentences. If the page has a sidebar, do not assume it can handle the enlarged viewer without testing.

After the first save, use Elementor's preview, then open the published or draft page in a separate tab. The builder shows the layout, but only the public-facing page reflects the theme, connected scripts, cache, and real viewport width. Open the first and last images, then return. If arrows, the overlay, or captions conflict with the background, document the symptom. Do not treat it with arbitrary styles until you have confirmed that the conflict is not caused by another image-viewing plugin.

WPBakery Workflow

In WPBakery, the process begins by selecting an element in the Add Element window. Find Epic Gallery and place it in the required row or column. Nesting is especially important here. A full-width block and a block inside a column may use the same files but create different layout rhythms. For the first launch, choose a row without a complex background, nested sliders, or several adjacent interactive components. That makes it easier to see how the gallery itself behaves.

Check the spacing before and after the block. Image cards should not stick to the section heading, but they do not need a huge empty gap either. If the theme already supplies vertical spacing for rows, do not add it a second time in the element settings. Visually, duplication looks like a design error; on mobile, it can turn a small collection of photographs into a very long page section. After configuring width and spacing, save the page, open it outside the editor, and only then move on to enlarged-view settings.

The product page mentions ready-made light and dark themes. Treat them as readability choices rather than effects for their own sake. On a light page with a calm background, a dark theme may clearly separate the viewer from the content. On a site with a dark theme, it may make interface edges difficult to see, in which case a light option may work better. Do not judge a theme from one image: open a dark photo, a light photo, and an image with an important caption. If contrast is weak in even one case, reconsider the setting.

Widgets and Shortcodes as Deliberate Display Methods

A widget is appropriate when the gallery is needed in a theme-controlled area: a footer, sidebar, or another registered location. Before configuring it, make sure that area actually appears in the intended template. One common trap is configuring a widget, seeing it in the administrative list, and assuming the task is finished. Some templates display different areas for posts, pages, and archives. Check the exact page type for which the collection is being created.

A shortcode is convenient when an editor needs a compact, portable entry in content. For images, use [eg_image_gallery image_gallery="ID1,ID2,ID3"]; for posts, use [eg_post_gallery include_post="ID1,ID2,ID3"]. Save this code alongside a description of the assigned collection in the team's working document. A sequence of numbers alone will explain nothing several months later. If you need to change the contents, first make a new list, test it in a draft, and only then replace the old code on the published page.

Do not try to insert a shortcode into a field that the builder treats as a normal heading or decorative caption. In that location, visitors will see a technical string instead of a gallery. Use a text block or a dedicated shortcode element, save the changes, and check the page. If the code appears as text, the cause is almost always the block type, content-filtering settings, or improperly closed syntax, not the IDs themselves.

Zoom, Descriptions, and Expanded Viewing Without Unnecessary Noise

The main practical value of Epic Gallery is not hiding photographs inside an attractive container. It is the controlled transition from overview to detail. The marketplace page lists zoom in and out, a full-screen background, standard expansion, and image descriptions. These features form one sequence. A visitor sees a collection, opens an interesting image, receives a larger viewing area, examines a detail when needed, reads the explanation, and returns to the page. If any transition is unclear, the entire experience becomes harder to use.

Test the visitor journey literally. Open the first image using a mouse cursor and a finger on a touch device, if one is available. Check whether it is obvious that the thumbnail is interactive. Then zoom the image. An important detail should become larger, rather than simply switching to an image of the same size inside a dark frame. Finally, close the viewer. The visitor should return to the same point on the page rather than lose their place in a long article. This simple test finds far more issues than configuring settings by field names alone.

Writing Descriptions for Enlarged View

A description in enlarged view should not repeat the page heading or list technical parameters unrelated to the image. A good caption answers one of three questions: what is shown, which detail to examine, or why the image matters in the sequence. For example: "Mounting detail after cleaning: the new gasket is visible on the right side." This sentence provides the subject, a viewing cue, and context. Visitors do not have to guess why they were invited to zoom in.

Try to keep captions at a consistent length. If one image has two words and the next has ten lines, the interface will jump around and become distracting. For a series with detailed explanations, place the extended discussion in the main page text and keep only a brief guide inside the viewer. This is especially important in tutorials: an image should confirm a step, not become the only place where an action is explained.

When Full-Screen Mode Is Actually Useful

A full-screen background works well for photographs where composition or a large detail matters: interiors, landscapes, high-resolution illustrations, or visual process documentation. It is less useful for small diagrams containing text, because zooming does not make an already unreadable label readable. If an image contains small text, prepare a larger source diagram or move the diagram into an HTML table and leave only visual confirmation in the gallery.

Do not enable the mode automatically on every page. In a long article, visitors may open images between paragraphs and expect a quick return. On a portfolio page, by contrast, full-screen viewing may become the central part of the experience. Base the setting on the page's purpose, not on how impressive it looks in the builder preview.

Practical Example: A Project Photo Series with Detailed Viewing

Consider a specific use case where the plugin's features do not remain a simple list. Imagine an architecture studio page about the completed renovation of a small public space. The goal is to show six photographs so that visitors first understand the overall outcome and can then inspect materials and individual design decisions. The page already contains a project description, so the gallery should not replace the article. Its role is to provide visual evidence for key points while preserving a clear viewing sequence.

For this use case, an image gallery is more appropriate than a post gallery. The set consists of one overall view, two interior angles, a finishing detail, a technical close-up, and a final view. Every photograph connects to a paragraph in the article, but the collection itself should make sense without reading every explanation. The first image should not be the most dramatic shot; it should be the one that explains the project as a whole. This helps visitors stay oriented when they open the next file in enlarged mode.

Goal and Prerequisites

The goal is to create a compact page gallery with sequential browsing, zooming, and brief explanations without creating a separate landing page for every image. You need a draft or test copy of the page, six prepared files in the WordPress Media Library, permission to edit the page, and one chosen insertion method. This example uses Elementor, but the same content principle applies to WPBakery, a widget, or the media gallery.

Before starting, make sure every file has a clear name and does not contain draft markers such as "final-final-2." Open every source image on the screen size most commonly used by site visitors. If texture matters in a photograph, a mobile device should provide at least one obvious way to zoom in. If the meaning depends on small text in a diagram, prepare a separate larger diagram for the article. You cannot expect people to keep zooming an image instead of receiving a clear explanation.

Assembly Sequence

1. Create a draft page or a copy of the existing one. Leave the original publication untouched until you have tested viewing and closing the gallery.
2. Prepare the section. Add a short heading, one explanatory paragraph, and a container whose width suits the photographs.
3. Add Epic Gallery. In Elementor, find the plugin element and place it in the selected section.
4. Select six files in a deliberate order. Start with the overview, lead visitors toward details, and finish with an image that returns to the whole.
5. Fill in concise captions. State what matters in each image without turning the caption into a technical report.
6. Enable descriptions in enlarged view only for this collection. Confirm that a caption does not cover a key area of the image.
7. Save and open the page in a separate window. Go through the complete sequence, not just the first image.

In the page section before the gallery, explain why visitors should open the images. For example: "Below, you can examine the materials and details described in the project." This does not pressure visitors, but it creates a clear expectation. Without it, users may treat the grid as a decorative strip and never realize that zooming and useful comments are available inside.

How to Verify the Finished Result

Verification starts with sequence rather than appearance. Open the page in a standard browser. The first image should be visible without horizontal scrolling and should not press against the container edges. Click it and check whether an enlarged viewer appears. Then move forward to the last image and back to the first. There should be no empty or random image between photographs, and captions should belong to the image currently open. Check closing behavior: the page should return you to the gallery, not to the top of the article.

Next, switch to a narrow viewport or mobile-device emulation. Thumbnail size is not the only concern here. Check whether controls can be used without multiple attempts, whether the page header covers the viewer, and whether horizontal scrolling appears. If a description is too long on mobile, reduce it to the essentials instead of shrinking the type to an unreadable size. Visitors should retain a simple choice: view the image and understand it without effort.

The final check is a private browser window. It helps you see the page without part of the local cache and editor session. If the gallery works in a standard window but does not open in a private one, record the exact symptom: "thumbnails are visible, but clicking does not open the viewer" or "only the first image opens." This is more useful than a general "it does not work." A specific symptom makes it easier to distinguish a script conflict, a cached old file version, or a container-markup issue.

What Can Go Wrong in This Workflow

If images open but visitors cannot see detail, check not only the zoom effect but also the source file. Sometimes the Media Library contains a reduced copy prepared for a card rather than an original suitable for detailed viewing. Do not try to compensate with repeated style changes. Replace the test file with a more suitable one, then open it in the gallery again. If the problem disappears, the cause was the asset rather than the component.

If captions behave inconsistently, return to the Media Library and make sure the editor changed the correct field for the correct file. In WordPress, one image may have a filename, title, caption, description, and alternative text. Different insertion methods may not use the same field. For testing, change one caption to a unique short phrase, save the page, and inspect the result. This shows exactly where the text comes from without putting the whole collection at risk.

If the collection looks correct in Elementor but its width or spacing is unexpected on the public page, do not rush to modify every thumbnail. First open the page structure and find the parent container. The cause may be column width, the theme's maximum width, section padding, or styles from a neighboring block. Fix the nearest level that actually creates the issue. A separate style applied to every image is almost always harder to maintain.

Post Gallery: When Images Should Lead to Site Content

A post gallery differs from a standard image collection because its item is a published post. The product page states that posts can be displayed as a gallery and that dynamic content can be used. This creates a useful option for editorial sites, case-study catalogs, and article collections: visitors see a visual showcase and then move to an individual post. The main advantage is not the zoom effect, but the fact that the cards remain connected to the life of the site.

Do not begin by adding every existing post. Start with a short list of three to five published pieces. Each should have a verified featured image, a clear title, a non-empty URL, and complete content. A draft, a post without an image, or an item with an outdated title undermines trust in the showcase. If the plugin receives an ID list through [eg_post_gallery include_post="ID1,ID2,ID3"], the order in the string should reflect editorial intent rather than a random database sequence.

A useful example is a "Project Stories" section on an agency site. The first item shows the clearest outcome, the second shows the process, and the third covers an unusual challenge. Before publishing, open every destination post in a separate tab and confirm that readers find a continuation rather than a dead end. If one card leads to an archive, another to an image file, and a third to a post, the showcase becomes unpredictable. A consistent destination type matters more than visual uniformity between cards.

How to Avoid Turning a Post Gallery into an Archive Duplicate

A site archive already handles the complete list. A post gallery should be curated: one topic, one funnel stage, one kind of work, or one answer to a visitor question. For example, not "All Articles," but "Three Projects Involving Public-Space Renovation." Before adding each post, ask whether it supports the section's overall idea. If not, leave it in the archive, search results, or category.

Check dynamic data from the reader's perspective. The title should fit within the chosen container, the featured image should not crop out the main detail, and any date or supporting text that appears should not create a misleading impression of freshness for older content. Do not promise that data updates without editorial involvement until you have tested the specific mechanism in your configuration. A safer approach is this: after changing a post title, image, or status, reopen the showcase and confirm that it reflects the expected state.

Checking a Gallery After Editing a Post

On a draft copy of one test post, change the title and featured image, save it, then refresh the page containing the post gallery. If the changes appear, check one additional post and clear the regular page cache according to your site's procedures. If older data remains, do not conclude that the plugin "cannot see" the changes. First rule out page caching, object caching, and a saved builder preview. This sequence prevents unnecessary reinstallation and helps document the real cause.

Brief takeaway: in an image gallery, the selected file is the main asset; in a post gallery, it is the published item with a correct card. Choosing the source changes not only settings but also the editorial workflow.

Page Speed, Accessibility, and Nearby WordPress Mechanisms

A zoomable gallery brings together several page resources: thumbnails, larger images, interface styles, and navigation scripts. That is why performance cannot be reduced to one setting. Visitors first see a page with a grid, then open a specific image. Good configuration does not force every asset to load at maximum size without reason, but it also does not replace enlarged viewing with a blurry copy. You need a deliberate balance between source quality, viewing-image size, and the number of assets in one collection.

Start with the actual visitor path. If the gallery sits near the bottom of a long page and users open only one or two images, there is little reason to make the initial page load depend on dozens of heavy assets. If the gallery is the page's main content, assess it as an independent section: how many thumbnails are visible immediately, how quickly does the first meaningful area appear, and does changing images cause layout shifts? These observations matter more than a generic promise that every gallery will be fast.

Dimensions, Cropping, and Loading Order

First prepare every file for its role. For overview browsing, visitors generally need a compact, crisp version. Enlarged viewing needs enough detail. However, do not blindly upload a camera original measuring dozens of megabytes for one image that may be opened. Image preparation should be part of the editorial workflow: remove unnecessary space around the subject, correct orientation, preserve useful detail, and select a sensible version for publication.

Check whether the thumbnail crops out a key part. In an architecture gallery, that may be the entrance; in a restoration article, a structural joint; in a product series, the detail that distinguishes the model. If the thumbnail hides the meaning, visitors will not open the needed image. Do not try to fix this with a caption saying "click to see." Review the original crop or the item order instead. The image choice should work before visitors read an instruction.

The number of items in one block also affects perception. There is no universally correct number for every site, but every image should earn its place. If a set contains more than ten images, consider whether it can be divided into thematic parts: "Overview," "Materials," and "Work Progress." This helps both visitors and editors. Instead of one endless viewer, you get several understandable stages, and an issue in one set does not affect the entire page.

Captions, Alternative Text, and Clear Actions

Accessibility is not added through a single field, but proper work with text around an image significantly improves the experience. Every photograph should have meaningful context in the main text or in a caption. Alternative text describes the image itself; it does not repeat a company name, a full list of keywords, or a file number. If an image is purely decorative and carries no information, reconsider its role: in a substantial subject-focused gallery, almost every image should demonstrate something.

Zoom viewing needs clear actions. Visitors should understand that they can open an image, move to the next one, close the mode, and return to the page. Do not call this "intuitive" until you have tested it on a real device. Ask someone who did not participate in configuration to find a required detail in the gallery. If that person opens the wrong image or cannot work out how to return, the issue is in the presentation, not the visitor's attention.

Textual explanations are best placed beside the image or within a confirmed description mode, rather than drawn directly onto photographs. Embedded text is hard to read on narrow screens, damages the image, and adapts poorly when the language changes. If an image needs labels, prepare a separate technical diagram with large labels and leave the original photograph clean for detailed viewing.

Caching and Conflicts Between Multiple Viewers

If the gallery no longer opens after optimization is enabled, do not delete the plugin as your first action. Describe the state: are thumbnails visible, does clicking work, does the overlay appear, does only the first file open, and does the problem occur in a private window? Then, on a site copy, temporarily disable one suspected transformation at a time: JavaScript combination, deferred script execution, aggressive image optimization, or an additional lightbox plugin. Repeat the same test after every change.

Do not disable the entire site cache immediately. That hides the cause and introduces another variable. It is much more useful to check whether the optimizer provides an exclusion mode for specific scripts and, only after confirmation, add the smallest possible exclusion according to the optimizer's documentation. File and handler names can change between versions, so do not copy random exclusions from someone else's discussion. First identify the actual conflict on your own site.

Pay particular attention to themes and builders that already provide their own gallery, lightbox, or image-click handler. If two solutions subscribe to the same action, you may see double opening, failure to close, or navigation to a file instead of a viewer. Choose one controlling mechanism for a specific collection. The second one can be disabled for that block in the theme or builder settings if a documented setting exists. Do not modify theme core files or Epic Gallery files to address an isolated conflict.

Safe Improvements Without Editing Plugin Files

With Epic Gallery, there is no need to start customization with code. Begin with confirmed methods: file order, caption content, selected source, the Elementor or WPBakery container, color theme, description enablement, and advertising-area settings only when necessary. These decisions survive updates more reliably than manual changes in the add-on folder. If the appearance still needs adjustment after that, move from the safest option to more specific changes.

A Practical Option Using Additional CSS

A small style adjustment is acceptable when you need to align the outer spacing around a container and your theme or builder provides an additional CSS class for the section. One important limitation applies: do not use invented Epic Gallery internal classes. They are not confirmed by public documentation, may change, and can make the snippet useless. Instead, give your own section class a clear name, such as project-gallery-wrap, and style only its safe outer context.

In Elementor, add such a class at the container level through advanced settings; in WPBakery, use the extra class field for a row or column if it is available in your installation. Then place the style in the theme's built-in Additional CSS area or a child theme. Before publishing, verify that the rule does not affect other galleries. The strength of this approach is its limited scope: you do not touch plugin markup and can roll back one class line or one rule.

/* Apply only to a container assigned the project-gallery-wrap class */
.project-gallery-wrap {
  margin-top: 2rem;
  margin-bottom: 2rem;
}

This example does not change Epic Gallery buttons, scripts, or internal behavior. It only gives one specific section predictable spacing. After adding it, open the page on wide and narrow screens, then temporarily remove the rule and confirm that the visual difference disappears. This verifies that the change affects exactly the intended area. To roll it back, remove the class from the container or remove the CSS snippet itself. Do not place the style in plugin files.

Using Epic Advertisement Together with Epic Gallery

The developer documentation separately confirms Epic Gallery integration with Epic Advertisement. Treat it as a specialized use case, not a required extension. It may make sense for an editorial project where advertising placements are already approved, placement policy exists, and the team verifies that an ad does not worsen viewing. For work showcases, medical illustrations, educational pages, or technical portfolios, this combination is usually excessive.

The safe testing sequence is as follows: first configure a clean gallery and complete the visitor journey. Then, on a copy of the page, add the advertising setup in one location, enable the related viewer setting, and check the first, middle, and last images again. Assess whether the description is covered, whether closing still works, and whether visual clutter increases. If users lose the image or navigation during testing, return to a clean viewer. The rollback should be simple: disable the added area and test again without it.

Updates as a Controlled Procedure

The product changelog mentions fixes related to advertising functionality, navigation, parameters, and the media-gallery layout. This is not a reason to expect identical behavior in every older configuration, but it is enough reason not to update the plugin without a short verification path. Before updating, create a backup, review the available changes, and note the page where the gallery matters most. After updating, test that exact page rather than checking only whether activation succeeded.

The minimum post-update test consists of five actions: open the gallery, select the first image, move forward, zoom the image, and close the viewer. For a collection with captions, check the text as well. For a post collection, open a card and make sure it leads to the correct content. Then clear the browser cache as recommended by the developer and repeat the test in a private window. If something changes, restore the previous working point rather than trying to compensate for a new problem with random styles.

Safe principle: configure first, then make a limited adjustment to the surrounding context, then verify and keep rollback simple. Editing plugin files is not part of this path.

Troubleshooting: Why the Gallery Is Not Producing the Expected Outcome

Photo-gallery issues rarely have one universal cause. A single symptom may result from the content, the selected insertion method, the theme, the builder, caching, or another image-click handler. That is why a random sequence of "reinstall - clear everything - add code" is less useful than a short diagnostic process. First document the visible symptom, then check the simple condition, and then change only one factor. This preserves the working page and creates a clear record for a colleague or support team.

Test the issue with a small collection of three files. A large collection makes comparison harder: it becomes unclear whether one image, the order, the template, or the entire mechanism is broken. If three images work, add the rest gradually. If even the smallest set fails, inspect the insertion method and page environment before blaming the photographs themselves.

The Element Cannot Be Found in Elementor or WPBakery

Symptom: after installing Epic Gallery, it cannot be found in the builder element list, or a block that was already added disappears when the editor is reopened. Likely cause: the plugin is not active, a different editor is open, the page is being edited with the wrong tool, or the builder retains an outdated component-list cache. Check: open Plugins, confirm that Epic Gallery is active, then create a new blank draft page and try to find the element there.

Fix: do not delete the working page. First refresh the builder screen and clear only its internal cache if a built-in command is available. If the element is available on a blank page, the issue belongs to the original layout or its editor. If it is absent everywhere, stop at checking installation and a compatible display method. When to roll back: if the live site edited reliably before activating the add-on but the editor stopped opening afterward, deactivate the latest change on a copy and document the exact conflict.

The Shortcode Appears as Plain Text

Symptom: visitors see a string such as [eg_image_gallery image_gallery="..."] instead of a collection. Likely cause: the code was added to a heading, an HTML field with processing disabled, a caption element, or another block that outputs text literally. The error may also be syntactic: a closing square bracket is missing, quotation marks were replaced by random characters, or extra text appeared between IDs.

Check: copy the code into a new text block on a test page, save it, and open the result. Use only your own IDs, without the sample words ID1. Fix: insert the shortcode through the intended text element or shortcode component of the selected builder. Check that the list contains no extra spaces within the numeric value and that every item actually exists. When to roll back: if shortcode placement breaks the page markup, remove only the test block and return to the last saved version without changing other sections.

Thumbnails Are Visible, but Enlarged Viewing Does Not Open

Symptom: images appear, but clicking does not open the expanded viewer, goes directly to the file, or does nothing at all. Likely cause: the required mode is not enabled in that specific media gallery, the theme or another plugin intercepts the click, or script optimization changed loading order. When using the media gallery, check Enable Epic Slider Gallery separately. Having Epic Gallery in the plugin list does not automatically enable it for an existing standard insertion.

Check: create a new post with three images through Create Gallery, enable the Epic Gallery setting, and open the draft in a private window. If the minimal example works, compare it with the problematic page: builder type, nested containers, enabled theme effects, and JavaScript optimization. Fix: disable one factor at a time only on a copy or in a safe test mode. Pay particular attention to a second lightbox, thumbnail links to media files, and deferred script execution. When to roll back: if changing optimization worsens more than the gallery, restore the previous rule immediately and look for a narrower exclusion in the optimizer documentation.

Only the First Image Opens or Navigation Is Broken

Symptom: the first file opens, but moving to the next one fails, controls disappear, or the sequence is mixed up. Likely cause: the collection contains a damaged file, sorting is unsuitable, scripts conflict, or an outdated cache remains after changing the gallery contents. The developer changelog mentions navigation fixes, so it is especially important to check real behavior after an update rather than only the activation screen.

Check: reduce the collection to three known working files, then add the others one at a time. If the issue appears after a particular image, check that image's availability, orientation, and successful upload to the Media Library. If the issue remains in the smallest collection, compare the result on a blank page and in the original layout. Fix: restore a logical order in the gallery editor, save the post again, clear the browser cache, and check in a private window. When to roll back: if the issue appeared immediately after changing theme or advertising-area settings, return to the last working version and repeat configuration one parameter at a time.

A Caption Is Missing or Covers the Image

Symptom: one image has no description, text from another image appears, or a long caption covers an important detail. Likely cause: a different WordPress field was populated, Use Slider Zoom with Description is disabled, the cache retains an old version, or the text is too large for the viewer. Check: give one test file a unique short caption, save it, and refresh the public page. Then open that same file in enlarged mode.

Fix: identify the field from which the specific insertion takes its description and standardize captions in one format. Reduce long explanations to one sentence and move the detail into the page text. When to roll back: if a description is needed but the current design hides an essential image area, temporarily disable descriptions and leave the context below the gallery until you have tested an acceptable display option on a test page.

The Gallery Looks Fine in the Editor but Breaks on the Site

Symptom: everything looks aligned in Elementor or WPBakery, but the published page shows incorrect width, extra blank areas, header overlap, or an unexpected background. Likely cause: the public-facing site receives theme styles, connected plugins, cache behavior, and real container width that are absent from the editor canvas. Check: open the page without the admin bar, in a new browser, and at two viewport widths. Use the inspector or builder structure to see which parent container determines the width.

Fix: change the nearest container that actually controls the issue: column width, section spacing, or a theme setting. Do not assign random widths to every image separately. If the theme provides its own image-viewing function, disable it only for the required block through a documented method. When to roll back: if a new style adjustment fixes one viewport but creates horizontal scrolling in another, remove it and return to configuring the parent container.

Old Styles or an Empty Area Appear After an Update

Symptom: after updating the plugin or theme, the gallery initially appears unstyled, with an empty area, or retains old behavior that no longer exists in the editor. Likely cause: browser, page, or optimizer cache continues serving old resources. Check: clear the browser cache, open a private window, and compare the page with a test copy. If the issue disappears, do not change plugin settings.

Fix: perform the standard cache-clearing procedure in the system actually used by the site, then repeat the verification path. Keep the restore point until you have checked the first image, navigation, descriptions, and viewer closing. When to roll back: if the update breaks the primary workflow even on a clean page and after controlled cache clearing, restore the previous working version from the prepared copy and record your observations for further investigation.

Page Acceptance: How to Prove the Setup Is Ready

A gallery is not ready when an editor clicks Publish. It is ready when a repeatable visitor journey produces the expected outcome. This is particularly important for Epic Gallery because one block combines WordPress media files, a selected insertion method, interactive viewing, and page styles. Acceptance turns the subjective impression of "it looks fine" into several observable conditions. Complete these checks before publication, after a major theme update, and after changing an important collection.

First open the page as a normal visitor. Do not start from the admin area: its toolbar and authenticated session can affect page height and cache behavior. Check whether a person understands that this is a thematic collection. It should have a heading or clear context in the paragraph above it. Then assess the above-the-fold area: images load where expected, thumbnails are not stretched, columns stay inside the container, and the gallery has a natural rhythm with neighboring blocks.

Visitor Verification Path

1. Open the first image. Confirm that the visitor action leads to the intended viewing mode rather than a random attachment page or direct file.
2. Move to the middle and last images. The sequence should match editorial order, remain unbroken, and not insert unrelated images.
3. Check zooming. The detail should become usefully larger, not merely open in a new decorative container.
4. Read the description. If descriptions are enabled, the text should belong to the current file, avoid covering meaning, and remain brief.
5. Close the viewer. The return should bring visitors back to the same collection, not reset the page to the beginning or leave an overlay over the document.
6. Repeat the path in a narrow window. Check control accessibility, the absence of horizontal scrolling, and caption readability.

Follow this path in a private window as well. It does not include part of the browser cache and extensions used by the editor. If the outcome differs, do not try to guess the cause. Record the difference in observable terms: "the viewer opens in a private window, but a normal window goes to the file" or "the caption updated after clearing the cache." These descriptions help you choose the right action: refresh the cache, inspect optimization, or examine the theme's link handler.

Editor Checks After Handing Off the Page

If another person will maintain the page, add a short internal working note: where the gallery is located, which insertion method is used, which files form the collection, and what must not be changed without testing. This does not need to be published for visitors. The note protects against a common situation in which a colleague edits the wrong text block, replaces an image in the Media Library, and does not understand why the enlarged view changed on an older page.

For a shortcode, save not only its string but also the purpose of every position. For example: first ID - overview, second - material, third - detail. Then replacing one file will not destroy the visual narrative. For Elementor or WPBakery, note the page name, section, and container. For the media gallery, note the post and that Enable Epic Slider Gallery must remain enabled there. This discipline does not require a separate project-management system, but it makes updates much easier.

How to Evaluate Whether an Advertising Area Should Be Used

If the site genuinely needs an advertising use case, approve it only after a separate acceptance check. Open an image on desktop and on a narrow screen, move to the next image, read the caption, and close the viewer. Then ask three questions: is the ad clearly separated from navigation, is it easy to distinguish from gallery content, and does it avoid hiding the subject for which the visitor opened the image? If any answer is uncertain, do not enable the block on the main collection.

This rule is useful for more than aesthetics. In a gallery, visitors act quickly: they see a thumbnail, open it, and try to inspect a detail. Any uncoordinated element at that moment feels like an obstacle. A clean collection with clear captions often provides more value than the maximum possible number of additional components. If an advertising area is required by the project, keep it only where it does not change the core viewing sequence.

Publishing Decision and a Fallback Option

After testing, you do not have to publish the gallery immediately. If concerns involve photograph quality, return to the source material first. If the issue is composition, inspect the builder container. If the viewer behaves unpredictably, temporarily keep a simpler standard WordPress collection on the page and continue troubleshooting in a draft. This is not a failure or a rejection of Epic Gallery. A fallback preserves content availability while the team identifies a specific conflict.

Do not leave two galleries containing the same files on a page as a "temporary safety measure." Visitors will see a duplicate, the page will become heavier, and editors will lose track of which version is primary. One clear temporary option with an explained purpose is better than two competing interfaces. Once Epic Gallery behavior is confirmed, replace the fallback block in one publication and repeat the verification path.

When CodeCanyon Epic Gallery Is a Good Choice

CodeCanyon Epic Gallery is worth using when a page has a specific image-focused purpose: show selected images or posts, let visitors move from overview to detail, and preserve a clear route back to the content. The most natural context is a site that already uses Elementor or WPBakery, or an editorial workflow based on the WordPress media gallery, widgets, and shortcodes. In that environment, the plugin provides several confirmed ways to place the same idea in the appropriate part of a page.

Success does not depend on how many features are enabled. First select the files, establish the order, write concise captions, and choose one insertion method. Then configure viewing, test the light or dark theme in the context of the site theme, enable descriptions only when they help, and use an advertising setup only when it is genuinely justified. After that, follow the verification path on the public-facing site and in a private window. This order protects against duplicate blocks, heavy collections, and accidental cache conflicts.

If you have prepared a test page, you can download CodeCanyon Epic Gallery, install the plugin on a site copy, and repeat the described workflow with a small collection. Once the test confirms opening, navigation, zooming, captions, and return to the page, move this approach into the main layout. The gallery then becomes not just decoration, but a clear tool for presenting visual content.