JUX Portfolio Pro - Joomla Extension
Component JUX Portfolio Pro is a handy tool that allows you to quickly place a ready portfolio section on the pages of any website. The function of this component is to support all types of images, as well as a variety of videos from Vimeo and Youtube.

Extension Description
Due to the versatility and adaptability of this component, it can be used even during the development phase to create an attractive profile, which will be posted examples of finished works or portfolio of products on the site. In addition, JoomlaUX Portfolio Pro component 7 has built-in styles and support for user customization, which can come in handy when you want to add to the finished page portfolio site.
In addition to the standard functions of the portfolio, such as sorting by category or tags, or display a brief description of the "read more" button, as well as support for images and videos, in an extension of Joomla integrated set of advanced animation effects. For example, one of the most attractive effects in this component is the animation when you move your cursor over elements of the portfolio, which smoothly moves from one element to another. In addition, there are many options for personalization, including both automatic layout with 3 predefined styles, and their fine manual adjustment. In addition, the layout of this component of the portfolio is fully adaptive and displayed correctly regardless of the user's screen size.
This Joomla component is able to save a considerable amount of time when adding a page to your website portfolio. It automatically adapts to the size of the site, therefore, does not require a long setup. One needs only to install it, and the site will be a complete portfolio with lots of features and beautiful effects that will surely attract the attention of visitors.
Extension Features
- Creative, clean style user interface
- 100% responsive
- Compatible with tablets and smartphones
- Flexible configuration for display on various devices
- Support for images and videos from YouTube and Vimeo
- Filter by category or tags
- Unlimited number of elements
- Support 7 visual styles for each item details
- Support 3 layout style
- It is easy to select the desired number of columns to be displayed.
- Hover effects - everything is moving so smoothly!
- Support for custom CSS
- Multi-language support
- Supports all major browsers: IE9 +, Firefox, Safari, Chrome, Opera
Guide to Configuring and Using JUX Portfolio Pro
JUX Portfolio Pro is not just for building a nice-looking image grid. It is a Joomla extension where the portfolio is assembled from a component, menu items, a module, categories, tags, cards, galleries, videos, and display settings. That means the main question after installation is not "where do I turn the portfolio on," but how to build a working setup so the editor can add projects easily, visitors can filter and view details, and the administrator can quickly find the cause if the grid, filter, lightbox, or module behaves differently than expected.
This guide walks through practical work with JUX Portfolio Pro: preparing the site, installing the package, creating categories and tags, configuring items, choosing between menu-based and module-based output, understanding the logic of Classic, Masonry, and Packery, setting up the project card, checking the result on the front end, and troubleshooting common issues. The article is written for a Joomla site owner, webmaster, or editor who already has the extension installation archive and wants to safely turn a collection of images or videos into a manageable portfolio.
There are no instructions here about purchasing, licensing, or alternative ways to obtain the product. This guide starts from the point where the archive is already available to the site administrator. If a specific feature depends on the extension version or your template settings, that is stated directly - for portfolios in Joomla, module positions, menu item assignments, cache, image sizes, and careful category management matter a lot.
What the extension solves and where it is genuinely useful
JUX Portfolio Pro belongs to the class of Joomla portfolio and gallery extensions, but it is better understood as a combination of a work catalog, a visual showcase, and a detailed project card. Official sources describe the product as a component and module for displaying images and videos, managing items through categories and tags, filtering, choosing layouts, and showing details. That is an important difference from a simple slider: content here is not just flipped through, it is organized into a structure that can be filtered and opened in a separate view.
A typical use case is a site for a studio, photographer, architect, designer, agency, school, gallery, craft workshop, or company that needs to show completed work. On a site like that, visitors usually have a practical question: "Show me examples in my category." Categories and tags keep all the work from turning into one long, unstructured feed. For example, an architecture firm might use categories like "Interiors," "Public Spaces," and "Private Homes," with tags like "video," "renovation," "3D," and "completed."
The extension also works well for mixed portfolios with both images and videos. The documentation confirms support for Image and Video media types, and for video it references YouTube and Vimeo via a video ID. This article does not include a random YouTube embed because no precise tutorial video for this product was found, but the ability to use video in project cards is still important: you need to account for it when creating items, choosing a detail layout, and testing the lightbox.
JUX Portfolio Pro delivers the most value when you need more than just uploading pictures - you need to manage a large collection of work. If your site only has 6 images and does not need filters, separate cards, tags, a lightbox, varying sizes, or module output, the extension may be more than you need. But if the collection is large and the work varies by type, format, and purpose, the component gives you a much more controllable model than a static gallery inside one article.
Who the extension is a good fit for
JUX Portfolio Pro is worth considering first if you run a Joomla site as a living showcase of your work. A content manager can keep the section updated through portfolio items, a designer can control the visual density of the grid, and a webmaster can publish the portfolio as a separate menu item or as a module in the right template position.
- A studio portfolio where projects need to be grouped by specialty and displayed in a grid.
- A photo gallery with project cards when each piece of work should open in more detail.
- An agency case-study catalog where filters, a short description, and a link to a detail page matter.
- A video portfolio if the media is hosted on YouTube or Vimeo and should appear alongside images.
- A "work" section inside an existing page if it is more convenient to publish a module instead of a separate menu item.
Who may be better off with a different approach
The extension may not be the best choice for a site that needs client albums with front-end uploads, watermarks, complex permissions for individual galleries, photo sales, bulk automated processing of thousands of files, or deep integration with Joomla Smart Search. Some of those requirements are better handled by specialized gallery solutions. JUX Portfolio Pro is stronger at presenting work and managing project cards, not at running a heavy media library.
Before installation, define what the basic content unit is: a single photo, a project, a video, a case study, a property listing, a design mockup, or an event. That determines which categories, tags, images, descriptions, and detail layouts you should create.
Feature map: component, module, categories, tags, and cards
JUX Portfolio Pro has two main output paths. The first is the component, used through a Joomla menu item. The second is the module, which pulls its source from the component and is displayed in a template position. This relationship is essential to understanding the product. If you create only items but do not configure a menu item or module, visitors will not see anything. If you create a module but do not assign it to the right pages and position, it may be technically published but still never appear where you expect it.
In the component, you create categories, tags, and portfolio items. Each item lets you configure the title, category, media type, preview image, description, tags, extra fields, gallery, and publishing settings. In the menu item or module, you choose the source, filtering method, layout, item count, columns, padding, text layer, hover behavior, lightbox, and link behavior. The front end then receives the assembled result: a grid or list of cards, filters, search, navigation to details, and media viewing.
What is stored in the component
The component is responsible for the collection itself. This is where the meaningful structure is created: categories, tags, items, and their data. For an editor, it feels like a small project database. It is important not to confuse a Joomla article category with a portfolio category: JUX Portfolio Pro documentation describes its own category manager inside the component. If the editor creates categories somewhere else, the portfolio filter will not see them.
An item card should be filled out so it works both in the grid and on the detail page. The title and preview image matter for the grid. The description, gallery, extra fields, and media type matter for the detail page. Tags help with filtering and search. If you plan to use Packery, the item gets another practical setting - image size. That is what controls the block size inside the Packery grid, so randomly choosing 2x2 for every item defeats the purpose of a dynamic layout.
What is controlled through the menu item
A menu item in Joomla is the right choice when the portfolio needs to be a full page, for example /portfolio, /projects, or /works. The documentation describes two menu-based output types: List Item and Item Detail. List Item shows a set of items, while Item Detail shows a specific card. Once you choose the type, additional tabs and settings appear: source, filters, display options, hover options, and global settings.
This route is usually more reliable for the main portfolio page. It has its own URL, clear navigation, a stable relationship to the template, and the result is easier to test. One JED review notes that the component worked as a menu item but caused problems as a module. That does not prove a general module defect, but it supports a sensible rule of thumb: if you need a primary section of the site, configure output through a menu item first, and use the module for secondary blocks.
What the module does
The module pulls already created items from the component and displays them in a template position. It is useful for the homepage, a sidebar area, a landing section, a "latest work" block, or a service page. The module also includes source selection, item count, Load More, filter, search, layout, columns, hover, and lightbox. But the module depends on the template position, publish status, page assignments, and sometimes cache. That is why troubleshooting a module is different from troubleshooting a component menu item.
Think of the module as a showcase widget, not as the main storage for the portfolio. If the item does not exist in the component, the module has nothing to display. If the item exists but the module is configured for a different category or ID, the result will still be empty. If the selected position does not exist in the template, the module will not appear even if the source is correct.
What to check before installing on a Joomla site
It is always smart to back up the site before installing any Joomla extension, but with a portfolio there are a few more practical checks to make. JUX Portfolio Pro works with images, videos, a lightbox, responsive grids, JavaScript effects, categories, and module output. That means problems often show up not only during installation, but later as well: the grid does not fit the template, the lightbox conflicts with script optimization, the module is not assigned to the page, images have wildly different proportions, or the filter shows the wrong items.
Start with a staging copy of the site or at least a full backup of both files and the database. A portfolio almost always touches content, media, and menus, so rollback must restore not only the extension files but also the categories, tags, items, and menu items you created. If the site is live and already indexed by search engines, it is better to keep the new section hidden at first through status, a hidden menu, or a test page to avoid accidental publication.
Compatibility and server environment
The official page and JED list JUX Portfolio Pro as compatible with current Joomla branches, including newer versions. At the same time, the product documentation looks historically older and still includes server requirements for Joomla 3. That is normal for extensions that have evolved over many years: the product page and changelog reflect updates, while individual documentation pages may lag behind in wording. So verify exact compatibility against the product page, JED, and the changelog, and use the documentation for step-by-step interface logic while allowing for differences in the updated Joomla interface.
On the server side, the usual Joomla and media-content basics matter: a sufficient file upload limit, correct permissions on image folders, enabled PHP extensions for unpacking and processing the archive, working writes to the temporary directory, proper HTTPS handling, and no overly aggressive security rules that block image uploads. If the Joomla installer says the archive is not in the correct format, check whether the downloaded file is a package archive containing separate ZIP files for the component and module. Joomla documentation specifically notes that sometimes you need to extract the package locally and install the nested archives.
Template, positions, and space for the grid
A portfolio does not work well inside a container that is too narrow if you want Masonry or Packery. Before installation, open the template and decide where the main output will live: a separate full-width page, a homepage section, a sidebar position, a footer area, or a hidden landing page. A component menu item usually needs a wide content container. For a module, check that the position actually exists, is visible in the correct template style, and is assigned to the right menu items.
If the site uses a template builder or a complex framework, test the basic output first without JavaScript optimization or CSS merging. The JUX forum includes topics about distorted images, module issues, missing items, and behavior after updates. That is not a reason to reject the product, but it is a reason not to turn on every effect, cache layer, and minification setting before the initial validation.
Content preparation
Make a worksheet for your future projects before opening the admin panel. At a minimum, include the title, category, tags, preview image, media type, description, link or extra field, gallery images, whether video is needed, and the preferred detail layout. If you skip this step, the administrator will start creating items randomly, and later it becomes obvious that the filter does not reflect real groups, Packery looks chaotic, and video cards are mixed with image cards without any clear logic.
- Prepare images at a consistent quality level and decide in advance which ones should be the large focal blocks in Packery.
- Design categories as major sections, and tags as cross-cutting attributes.
- Select videos only from sources the product supports if you want to display video inside cards.
- Create 6 to 10 test items before migrating the full archive of work.
- Write down the expected URL for the portfolio page and the list of pages where the module should appear.
Do not start with a mass content import. Build a small validation set first: a few categories, several different tags, one image item, one video item, one large Packery item, and one standard item.
Installing the package and the initial validation
JUX Portfolio Pro is installed through Joomla's standard extension installer. In the current admin interface, the exact path may be named differently than it is in older documentation, but the logic is the same: open the extension installer, choose Upload Package File, upload the ZIP package, and wait for the successful installation message. JUX documentation refers to the package as pkg_jux_portfolio_pro, which confirms that it is a bundle of multiple parts. Joomla documentation also explains that a package can install several related extensions together.
After installation, do not jump straight into styling. First, verify that the JUX Portfolio Pro component appears in the admin panel and that the corresponding module type is available in the module manager. If the package installed only partially, the component may be available while the module is not, or vice versa. In that situation, it is better not to create content until you are sure all parts of the product were installed correctly.
Basic installation sequence
- Back up the site and database.
- Open the Joomla admin panel and go to the extension installer.
- Select the package upload tab and choose the JUX Portfolio Pro ZIP archive.
- Wait for the successful installation message.
- Open the list of installed extensions and verify both the component and the module.
- Clear Joomla cache and template cache if it is enabled.
- Create one test portfolio item and confirm that it saves without errors.
If Joomla reports an archive format error, do not blindly rename the file. First extract the archive locally and check whether it contains separate ZIP files inside. If it does, install them through Joomla's built-in installer. If the error is related to upload size, raise the limit in the test environment or use a Joomla-supported install-from-folder method, but do not manually copy files into system directories unless you understand the package structure.
First validation after installation
The initial validation should confirm three things: the component saves data, the menu item outputs a list, and the module can pull its source from the component. Do not try to configure every style option in one pass. First create one category, one tag, and one item with a preview image. Then create a hidden List Item menu item, select the source from that category, enable a simple Classic layout, and open the page on the front end.
If the page shows at least one card, the extension is installed and the basic chain works. If the page is empty, do not start with CSS - check the source first: is the item published, is the category selected, is the filter tied to an empty tag, does the menu item restrict access, is the item unpublished. Only after that should you enable Masonry, Packery, hover, lightbox, and the module.
When it is better to stop and not continue configuration
Stop if the installation completed with warnings, the component does not save items, media cannot be selected from Joomla Media Manager, the module is missing, the page throws a PHP error, or template navigation breaks after installation. In that state, the problem should not be treated as "minor." First return the site to a stable condition, verify compatibility, enable error display on a staging copy, and review the system log. Building a portfolio on top of an unstable installation will only make rollback harder.
Configuring the structure: categories, tags, and portfolio items
A strong portfolio does not start with choosing a beautiful grid. It starts with structure. JUX Portfolio Pro lets you filter items by category or tag, so those entities should reflect real navigation patterns. Categories are best used for major sections that do not overlap. Tags are for attributes that can appear across multiple categories. That gives visitors an intuitive filter and keeps editors from creating dozens of nearly identical sections.
For example, an interior design studio might use categories like "Apartments," "Offices," and "Public Spaces," with tags such as "loft," "minimalist," "before and after," and "video." A video production company might use categories such as "Commercials," "Music Videos," and "Events," with tags like "YouTube," "Vimeo," "filming," and "editing." In an artist portfolio, categories may represent techniques, while tags may represent themes, formats, or exhibitions.
Creating categories
The documentation recommends going into the JUX Portfolio Pro component after installation and creating categories first. Do that before creating items, otherwise cards start out in a temporary, unstructured setup. Each category should have a short name that makes sense both to the editor and the visitor. Do not create a separate category for every project. If a section contains only one item and there is no plan to expand it, it may be better represented as a tag or a standalone card rather than a category.
Categories affect both filtering and source selection in the menu item or module. If you want a separate page for "Restaurant Projects," you can create a menu item that pulls items from a specific category. If you want a single portfolio page with filtering, choose a set of categories and enable the filter output.
Creating tags
Tags help filter by attributes that cut across categories. JUX Portfolio Pro documentation says that tags can be selected or entered manually and also warns about delimiters during input. In practice, it is better to create a predefined list of allowed tags and stick to a single naming style. "Video," "video," "clip," and "video project" will turn filtering into chaos if editors use them inconsistently.
A tag should help the visitor. If a tag is useful only to the administrator and does not affect filtering, do not overload the portfolio with it. From an SEO perspective, it also makes little sense to create dozens of technical tags: the portfolio page benefits more from a clear structure than from cramming similar words into the interface.
Item card: which fields to fill out right away
Several groups of fields matter in an item. The documentation describes Title, Category, Media Type, Style layout, Image Preview, Video ID, Image Size for Packery, Description, Tags, Gallery, Extra Field, and Publishing Options. The visual look of the interface may differ in your version, but the underlying logic still holds.
| Field or group | What to choose | How to validate the result |
|---|---|---|
| Title | A short project name without extra keywords. | The title is clear in the grid, hover state, and detail page. |
| Category | One primary section that the filter genuinely needs. | The category filter keeps the item in the correct group. |
| Media Type | Image for photos or illustrations, Video for YouTube or Vimeo. | The lightbox or detail page opens the correct media type. |
| Image Preview | A large, clean image without tiny text. | The grid does not show cropped faces, logos, or important details. |
| Image Size | Only for Packery when you need an accent size such as 1x1, 1x2, 2x1, or 2x2. | The Packery grid looks intentional rather than random. |
| Description | A short explanation of the project's task, result, or context. | On the detail page, visitors understand what they are looking at. |
| Tags | 2 to 5 meaningful attributes that help with filtering. | Tag filtering does not produce empty or unexpected results. |
After creating your first items, review the item manager. If display order matters, decide right away how you will sort things: manually, by ID, by title, randomly, or by another method available in your version. The JED changelog includes fixes related to order by and item management in Joomla 4, so it is better to validate order on the actual page, not only in the admin panel.
Choosing a layout: Classic, Masonry, and Packery without a random mosaic
JUX Portfolio Pro offers three main list layout approaches: Classic, Masonry, and Packery. These are not just visual skins. Each mode fits a different image structure and a different visitor experience. A common beginner mistake is turning on the flashiest option right away before preparing the images and card sizes. The result may look impressive at one screen width and broken or arbitrary at another.
Classic layout for a predictable showcase
Classic layout is the better choice when every item should look equally neat and consistent. The documentation says that in Classic you can choose the number of columns, and the images adapt to a Landscape, Squared, or Portrait frame. It is a good fit for corporate case studies, service catalogs, agency project lists, or any page where visual discipline matters more than an artistic mosaic.
Classic is also easier to test: you immediately see how many columns fit on desktop, tablet, and mobile, how padding behaves, where the text layer appears, and whether the cards become too small. If the site is launching for the first time or the editor has limited experience, start with Classic. Later you can create a separate Masonry or Packery page for a looser visual presentation.
Masonry layout for work with mixed proportions
Masonry is useful when images have different heights and you do not want to force them into uniform cropped cards. In that mode, the grid packs items more tightly while preserving their natural proportions. It works well for photography, illustration, architectural details, posters, and other visual work where a vertical shot should not be turned into a horizontal crop.
The biggest Masonry risk is uneven visual weight. If one set contains images that are too bright, too dark, and too different in shape, the grid can feel noisy. This is where editorial preparation matters: balance the color temperature, choose preview images carefully, avoid mixing technical screenshots with artistic work, and do not cram too many items into the first screen.
Packery layout for controlled accents
Packery is the most expressive mode because you can assign sizes like 1x1, 1x2, 2x1, or 2x2 to individual items. The documentation explicitly ties image size to Packery layout. That means the editor can make a key project larger than the others, create a vertical accent for a portrait, or a horizontal accent for a panoramic image.
Packery requires discipline. If every item is given a large size, the accents disappear. If large items are placed randomly, visitors will not understand what matters. A good practice is to identify 2 or 3 lead projects for the first page in advance and assign larger sizes only to them, leaving the rest at the default block size. Then open the page at different widths and check whether the visual hierarchy still makes sense.
Mini-check for Packery
- The large block highlights a genuinely important project, not a random image.
- Vertical images do not lose their focal subject in responsive layouts.
- Category filtering does not leave awkward empty gaps because of the selected large blocks.
- The first items on the page give a sense of the portfolio, not just of the visual effect.
Output through a menu item: a dedicated portfolio page
For the main portfolio page, it is better to start with a menu item. Joomla builds front-end navigation around menu items, and many extensions get a stable page context specifically through a menu item. JUX Portfolio Pro documentation describes creating a new menu item, choosing List Item or Item Detail, and then configuring tabs such as source, filter, display option, and hover option.
From the visitor's perspective, the menu item answers the question "Where is the portfolio?" From the administrator's perspective, it controls the URL, access, template style, module assignments around the page, and output settings. That is why you should not hide the main portfolio section only inside a homepage module: both visitors and search engines should have a clear URL for the work page.
List Item as the main page
List Item outputs a list of work. In the source settings, you can choose category or ID of item, specify the number of displayed items, set order by, enable the filter, choose filter by category or tags, and enable search. This is the core of the user experience. If visitors need filtering, do not hide it just because the grid looks cleaner without it. In a large portfolio, filtering is often more important than decorative hover effects.
A good baseline setup for the first launch is source from category, a moderate number of displayed items, order by a meaningful sequence, show filter enabled, filter by category or tags depending on the structure, and search enabled only if the number of items is large enough. If the page only has 8 projects, search may be unnecessary. If it has 80, users will struggle without it.
Display Option and columns
In Display Option, you choose the layout, style for Classic, padding, text layout, pagination, and the column counts for desktop, tablet, and mobile. Column settings are not just cosmetic. If you set too many columns on desktop, the cards become tiny and lightbox becomes the only realistic way to inspect the work. If you keep the grid too dense on mobile, text and hover elements become useless.
For most sites, start with 3 columns on desktop, 2 on tablet, and 1 on mobile. Then evaluate the actual images. If the cards are simple and square, you can increase the desktop column count. If the images are visually busy or include a text layer, it is better to leave more breathing room. Check not just how the grid looks, but also clickability, first-screen height, and whether the filter still works after switching.
Hover Option and lightbox
Hover Option controls the hover effect, overlay style, lightbox style, and target. On desktop, hover can nicely reveal the title or an icon, but behavior differs on touch devices. That means hover should not be the only way for users to understand that a card is clickable. If the overlay shows only an icon, make sure the project title is available either in the text layer or on the detail page.
Lightbox is useful for quickly previewing an image or video. JED also notes that in JUX Portfolio Pro the lightbox displays images or videos, while the description is read through the category or name tag. Editors should understand this: do not try to stuff all information into the lightbox. Use the detail page for full case-study information, and keep the lightbox focused on media viewing.
Output through a module: position, source, Load More, and assignments
The JUX Portfolio Pro module is useful when the portfolio needs to appear inside another page: on the homepage, a service page, in the footer area, in a sidebar, or in a special template position. The documentation emphasizes that the module pulls its source from the component and is configured separately. It also reminds you to choose a position, assign the module, and publish it. In Joomla, that is a basic but frequently overlooked chain.
The module works well for a "latest work" showcase. For example, on the homepage you can display 6 projects from a "featured" category, enable Load More, or leave a link to the full portfolio page. On a service page, you can show work only from the matching category. On an author page, you can display projects by tag if your structure supports it.
Source and number of items
In the module, you can choose source by category or ID of item, display item, show load more, load more item, order by, filter, tags, and search. It is usually not a good idea to use the module as a full catalog when the page already contains complex content. For a module, 4 to 8 items is often enough, especially if it sits in the middle of a landing page. The full catalog is better left to the menu item.
Load More is useful when you want to show a lot of work without forcing a long initial load. But test it together with cache, the template, and JavaScript optimization. The JED changelog includes a fix related to module Load More, so if the button does not load more items, first check the extension version and disable script optimization on a staging copy.
Template position and page assignment
A Joomla module does not appear by itself. It has a position, status, access, language, ordering, and menu assignment. When a user says "the module is not working," the real issue is often not the extension at all, but the assignment: the position does not exist in the current template style, the module is published on the wrong page, the selected access level hides it from visitors, the language does not match, or cache is serving an outdated version of the page.
Check the module step by step. First place it in a clearly visible template position and assign it to one test page. Then choose a source category with published items. Then enable a simple Classic layout. Only after the cards appear should you move the module to its final position and enable hover, Load More, filtering, or Masonry.
When it is better not to use the module
If the portfolio is the main section of the site, if you need stable SEO-friendly output, if each project needs a detail page, or if filtering should be a central feature, use a menu item. The module is great as a showcase, but it depends much more on the template and surrounding content. On a homepage that is already heavy, a module with many images can significantly increase both visual and network load.
Practical example: a work page for a design studio
Let us look at a realistic scenario: a design studio has a portfolio of interiors, brand identity work, and visualizations. The goal is to create a dedicated "Work" page with filtering by specialty, show the first projects in a clean grid, and place a small "Featured Projects" block on the homepage. This is a strong fit for JUX Portfolio Pro because it uses the component, the menu item, and the module together.
Goal
Build a manageable portfolio where visitors see a grid of work, filter projects by category, open an image or video, move into a detail card, and also see a few featured items on the homepage. The editor should be able to add a new project without editing the template or manually copying HTML.
Preparation
Before you start, create a test set: 3 categories, 5 to 7 tags, 8 to 12 images, one YouTube or Vimeo video, and short project descriptions. Prepare the images in advance: for Classic, use similar proportions; for Masonry, use strong vertical and horizontal shots; for Packery, choose 2 or 3 accent projects.
Setup steps
- In the JUX Portfolio Pro component, create the categories "Interiors," "Brand Identity," and "Visualization."
- Create the tags "video," "residential project," "commercial project," "3D," and "featured."
- Add the first item: title, category, media type Image, preview image, description, and 2 to 3 tags.
- For one item, choose media type Video and enter the video ID if the video is hosted on a supported platform.
- Add a gallery of images for the detail page and verify that the additional images do not unnecessarily duplicate the preview image.
- Create a "Work" menu item with the List Item type and a source from the selected categories.
- Enable category filtering, choose Classic or Masonry, and set a sensible number of items for the first page.
- Check the page with cache off and script optimization disabled.
- Create a JUX Portfolio Pro module for the homepage, choose a source by tag or category with featured work, and limit the number of items.
- Assign the module to a template position, publish it, and attach it to the correct page.
Expected result
A project grid should appear on the "Work" page. The filter switches categories without empty results as long as each category contains published items. Clicking media opens a lightbox or goes to the detail page depending on the settings. On the homepage, a compact featured-projects block appears without turning the page into a full catalog.
A nuance that often gets in the way
The most common mistake in this scenario is mixing up categories and tags or choosing a module source that contains no published items. The second mistake is expecting hover text to replace the detail page. If a project needs details, a description, a link, a gallery, and video, configure the detail layout and test it through a direct click-through.
Quick takeaway: get a working menu item output first, then add the module. That makes it much easier to separate a data problem from a template-position problem.
How to configure the detail card, lightbox, and video
The detail card is where the portfolio stops being just a gallery. JUX Portfolio Pro documentation describes seven item detail layout options: Vertical Gallery, Gallery Half Width, Gallery Full Width, Slider Image, Vertical Slider, Full-Width Slider, and Video Layout. That gives you flexibility, but it also requires a deliberate choice: not every project should open the same way.
A visual case study with multiple images works well with a gallery. A project centered around a primary video is a good fit for video layout. A series of images that should be browsed in sequence belongs in a slider. A large image with text beside it fits a half-width layout. If you use one layout for all items, check whether projects of another type are suffering. A video and a static photograph rarely look equally good in the same detail template.
Gallery inside the item
The Gallery tab lets you add or remove images for the card. Do not upload every original from the project. Choose a sequence that explains the work: overall view, detail, process, result. If there are many images, it may be better to split the project into several items or use a specialized gallery solution. Otherwise the detail page becomes too heavy and visitors may never reach the description.
Check the gallery at different widths. Some issues users describe as "the image is distorted" are in practice caused by the interaction between the original proportion, the chosen layout, the image height, and the template CSS. If important images are vertical, do not force them into a wide-banner presentation.
Video in the card
The documentation specifies Media Type Video and a Video ID field, and it includes an example where the ID is taken from a YouTube URL. That means it is better for editors to keep not a random pile of links, but a clear list: service, original URL, ID, and project title. If the video is not on YouTube or Vimeo, do not assume it will work without additional validation. The forum includes a topic about adding video from a local server, which by itself shows that this scenario requires caution and should not be treated as a standard capability unless confirmed by the documentation.
After saving a video item, check three things: does the preview image appear in the list, does the video open in the lightbox or detail layout, and is the browser blocking external content because of privacy settings, mixed content, or cookie policy. If the video does not open, check the ID and the video's availability on the platform first.
Related Project and extra fields
In the detail settings, the documentation mentions Related Project and extra field. Related Project is useful if you want to keep visitors inside the portfolio after they view one case study. But do not enable it automatically - test it first: related projects should actually be related, images in the slider should not be cropped awkwardly, and hover or overlay elements should not cover an important subject.
Extra field can be useful for a client-site link, a "View Project" button, or information about the type of work or the client. Do not turn extra fields into a mini CRM. In a portfolio, visitors usually need 2 or 3 clear facts: what was done, for whom or for what purpose, and where they can see the result. Everything else is better left in the description or in a separate case-study page.
Filters, search, and item order: how not to confuse visitors
Filtering by category and tag is one of the main reasons to use JUX Portfolio Pro. But filtering can either improve navigation or confuse visitors. If the page includes categories, tags, search, pagination, and Load More at the same time, users need to understand what exactly they are changing. That is why filter settings should be designed around audience behavior, not around the temptation to enable every feature.
Categories or tags
If the work has one main section, filter by category. If visitors are looking for overlapping attributes, use tags. In an agency portfolio, categories usually reflect the service type, while tags reflect the industry, format, technology, or status. It is usually a mistake to show too many filters at once if they lead to similar result sets. Fewer filters are better, as long as each one produces a clear and meaningful result.
The JED changelog includes fixes related to tag display, category filter, multi-filter, and dropdown filter. That shows that filtering has evolved and been refined actively. If the filter behaves strangely, compare your version against the changelog, check whether any older template overrides remain, and clear the cache.
Search across items
Search makes sense when there are many items and they have meaningful names. If you have 12 projects with short, highly visual titles, search may be unnecessary. If you have 100 projects with client names, cities, styles, or specialties, search helps users find what they need faster. But search only works well when titles and descriptions are maintained consistently.
Order By and random sorting
Order By is available in both menu item and module settings. Random sorting can make a showcase feel fresh, but it is a poor choice for a main portfolio page where the editor is shaping a narrative. On a homepage block with featured work, Random can sometimes make sense. On the main page, a stable order is better so that both visitors and administrators see the expected sequence.
If the site still shows the old order after you change it, check cache, menu item settings, module cache, the order in the item manager, and the selected source. Do not try to fix ordering by reuploading images or creating duplicates. That will create more problems than it solves.
Validating the result: what should be visible on the site
Result validation should be a separate stage, not just a final glance at the page. JUX Portfolio Pro affects content, media, filters, JavaScript, the template, and responsive behavior. So "it looks fine on my screen" is not enough. You need to validate the chain: the item is created, the source is selected, the filter works, the lightbox opens media, the detail page shows the data, the module is visible in the right position, and the mobile version does not break the grid.
List validation
Open the portfolio page as a guest, not only as an administrator. Check how many items appear on the first screen, whether titles are visible, whether the filter works, whether there is pagination or Load More, and whether the lightbox opens. Then try each category and tag filter. An empty result is acceptable only if that group is expected to have no items. In every other case, it points to a structure or source problem.
Detail page validation
Open several cards: one with an image, one with a gallery, one with a video, and one with an extra field if you use them. Make sure the description is readable, the gallery does not duplicate a single image, the video opens, related projects are not cropped poorly, and the link works without sending users somewhere unexpected. If the target is set to _blank, make sure that is actually what you want.
Module validation
For the module, open a page where it is assigned and a page where it should not appear. This helps catch menu assignment errors. Check the position on desktop and mobile, the number of items, Load More, filtering, ordering, and interactions with neighboring modules. If the module is on the homepage, evaluate visual load speed: too many large images in the first screen can hurt the overall impression.
Responsive behavior and cache validation
Check desktop, tablet, and mobile widths. The settings allow different column values, and you need to see them in a real browser. After that, turn cache and optimization back on gradually. Start with Joomla system cache, then template cache, then script merging and deferred loading if you use them. After each change, repeat a quick test: filter, lightbox, Load More, detail page.
A good result for JUX Portfolio Pro is not just a nice-looking grid, but a predictable path: visitors filter the work, open the right project, see quality media, and can return to the list without breaking navigation.
Safe improvements: CSS, cache, and language adjustments
JUX Portfolio Pro officially mentions Custom CSS, and the documentation says the module can be styled through a Custom CSS field in the advanced tab. That gives you a safe way to make small appearance adjustments without editing extension files. Joomla also provides built-in language overrides, and your template may offer a custom CSS file or custom code setting if your template framework supports it.
Do not modify Joomla core files or extension files. Those changes will be lost during updates and can make troubleshooting harder. If you need to change spacing, hover behavior, card width, title readability, or overlay contrast, use CSS through the extension field, the template's custom stylesheet, or a module class suffix. If you need to change interface text, use Joomla language overrides instead of search-and-replace in PHP files.
A small CSS tweak for card readability
The example below is safe as a principle because it works through your own wrapper class. Add the CSS class portfolio-clean-card to the page or module, then paste the CSS into the extension's Custom CSS field or your template's custom CSS file. The selectors may differ in your version, so before publishing, inspect the actual HTML in the browser and narrow the selector if necessary.
.portfolio-clean-card .jux-portfolio-item {
border-radius: 6px;
overflow: hidden;
}
.portfolio-clean-card .jux-portfolio-item img {
display: block;
width: 100%;
height: auto;
}
.portfolio-clean-card .jux-portfolio-item .title,
.portfolio-clean-card .jux-portfolio-item .item-title {
font-weight: 600;
line-height: 1.35;
}
Validation is simple: open the portfolio page, make sure only the cards inside the intended block changed, confirm that the filter and lightbox still work, and check that the title does not overlap the image on mobile width. Rollback is just as simple - remove the CSS or remove portfolio-clean-card from the page or module class.
Cache and script optimization
Filter, hover, lightbox, Masonry, Packery, and Load More all depend on JavaScript and CSS. If filters stop working or the lightbox no longer opens after you turn on optimization, do not immediately reconfigure the portfolio. First disable script merging and deferred loading, clear cache, and test again. If the problem disappears, add exclusions for the extension scripts or leave part of the optimization disabled on the portfolio page.
Joomla system cache also needs to be tested carefully. On a page with filters and dynamic loading, you do not want users seeing outdated HTML after items have changed. After a large portfolio update, clear the cache and test the page in guest mode.
Language overrides
If an English label appears on the front end and needs to be replaced, use Joomla's built-in language overrides. That is safer than editing extension files. Find the language constant through the override interface, create the localized version you need, and check the page. If you cannot identify the exact constant, log it as a task for the developer or support team - do not edit the product's PHP files just to change one word.
Practical ways to use it on different site types
The same feature set can be applied in different ways. The key is not to invent features, but to combine the confirmed capabilities correctly: categories, tags, image/video, list item, item detail, module, layout, filter, lightbox, gallery, and custom CSS. Below are a few scenarios where JUX Portfolio Pro can provide real value.
Studio or agency
For a studio, use categories for service lines and tags for industries or formats. The homepage gets a module with featured projects, while a dedicated page gets a full List Item with filtering. In the detail page, add a description of the task, a process gallery, and a link to the result through an extra field if appropriate.
Photographer or artist
For a visual creator, image quality and proportions matter most. Masonry helps avoid cropping mixed image shapes, Packery highlights key work, and lightbox enables quick viewing. But do not overload the detail page: visitors should feel they are browsing a curated collection, not a folder containing every file from the shoot.
Video portfolio
For video, use media type Video and supported services. The preview image must stand on its own because that is what appears in the grid. Tags help separate video type, topic, client, or format. After configuration, always confirm that the video opens on the front end and that the fallback image does not look empty.
Case-study catalog without e-commerce
Sometimes a portfolio acts as a lightweight catalog: properties, completed projects, educational programs, exhibitions, or events. In that case, item detail becomes a mini case-study page. Do not treat it as a store and do not expect shopping-cart features. In this role, JUX Portfolio Pro is useful as a visual catalog, not as a sales system.
What not to expect from JUX Portfolio Pro
A good guide should explain not only the product's strengths, but also its boundaries. JUX Portfolio Pro is not a universal media platform. It should not replace a DAM system, a client photo gallery with private albums, a photo-print store, a complex per-gallery permissions system, or a page builder. Its job is to provide a manageable visual showcase of work in Joomla.
You also should not expect the extension to fix unprepared images on its own. If the originals are too large, blurry, inconsistent in color profile, and chaotic in proportion, any grid will look worse. The extension gives you layouts and filters, but the editorial preparation of content is still your responsibility.
Documentation and interface limitations
The official JUX Portfolio Pro documentation contains many screenshots and step-by-step hints, but some of the wording looks old and some menu names are outdated. That does not make it useless: the product structure, categories, tags, items, menu item, module, layout, and Packery are all explained there. But for exact paths in current Joomla versions, cross-check against the current admin panel and official Joomla documentation.
Use caution with reviews
JED includes both positive reviews about support, speed, and flexibility, and a critical review about module issues and minimal documentation. Use reviews as a testing signal, not as a final verdict. If your main scenario is module output inside a complex template, test exactly that before migrating the full portfolio. If your scenario is a standalone page through a menu item, start there and connect the module only afterward.
If the portfolio does not display or works incorrectly
Troubleshooting JUX Portfolio Pro should move from data to output, not the other way around. First check whether there are published items in the selected source. Then verify whether the menu item or module is configured correctly. After that, look at the template, cache, JavaScript, and CSS. The JUX forum shows typical topics: the module does not display images, proportions are distorted, items disappear after an update, the lightbox does not work, extra fields vanish, or users cannot move past the first gallery page. These symptoms are useful when turned into a clear troubleshooting path.
Blank page or no items
Symptom: the menu item opens, but the grid is empty, the filter shows nothing, or items disappear after an update.
Possible cause: the wrong source is selected, items are unpublished, the category is empty, the filter is limited to a tag with no items, the order or display item count hides the expected cards, or cache is showing an old state.
What to check
- Whether there are published items in the JUX Portfolio Pro component.
- Whether the correct category is assigned to the item.
- Whether source by ID is selected with different items specified.
- Whether the item is hidden by publish status, access, or language.
- Whether Joomla cache and template cache were cleared after the change.
How to fix it: temporarily choose a simple category with one test item, disable filtering, set Classic layout, and make sure display item is greater than zero. Once the card appears, bring back the filter, search, and sorting one setting at a time. If the problem started after an extension update, compare your version with the changelog and check whether the product needs to be updated to a newer release.
The module is published but not visible
Symptom: the component menu item works, but the module does not appear on the homepage or internal page.
Possible cause: the position does not exist in the current template style, the module is assigned to the wrong menu items, access hides it from guests, the selected source is empty, or a template override or cache has not been refreshed.
How to fix it: place the module in a known working position, assign it to one test page, temporarily enable the title display, choose a category with one published item, and disable advanced effects. If the module appears, the problem was not in the data. Restore the final position and assignments gradually.
Images are distorted or cropped badly
Symptom: cards look stretched, vertical images look wrong, or the detail gallery shows the wrong proportion.
Possible cause: an unsuitable layout, incorrect image size for Packery, template CSS overriding image dimensions, a selected frame that does not match the original, or images that vary too much in proportion.
How to fix it: test the same set in Classic layout first, then in Masonry. For Packery, make sure image size is used only where an accent is needed. Temporarily disable custom CSS and the template's image optimization. If the problem disappears, restore your changes gradually. For vertical work, choose a layout that does not force it into wide banners.
Lightbox or hover does not work
Symptom: clicking a card does not open the lightbox, hover does not show the overlay, or the video does not start.
Possible cause: a JavaScript conflict, aggressive optimization, an incorrect Video ID, an overlay hidden by CSS, or the required hover or lightbox style setting is disabled.
How to fix it: disable JavaScript merging and deferred loading on a staging copy, clear cache, and check the browser console. Then review Hover Option settings and Style Show Lightbox. For video, make sure the correct ID is entered and the video is available on the original platform. If everything works after optimization is disabled, add exclusions for the portfolio scripts.
The filter shows unexpected results
Symptom: a category or tag does not leave the expected items, search does not find what it should, or the filter looks wrong after clearing.
Possible cause: duplicate tags with different spelling, items attached to a different category, the wrong filter by mode enabled, or your extension version missing filter-related fixes present in a newer changelog.
How to fix it: make a list of current tags, merge duplicates, check the category on each item, and temporarily keep only one filter type active. If the problem affects the appearance of clear/filter controls, check for an extension update and review the template CSS. Do not create duplicate categories as a quick workaround - that will make the portfolio harder to maintain.
When it is better to roll back a configuration change
Roll back a change if enabling a new layout, cache setting, custom CSS, Load More, or optimization breaks the core chain: items stop displaying, the lightbox no longer opens, the filter returns a blank page, or the module disappears. Go back to the last working configuration and note which setting caused the issue. That kind of log saves more time than trying to change everything at once.
Questions that usually come up during setup
Can JUX Portfolio Pro be used only through a module?
Yes, but for the main portfolio section it is better to configure output through a menu item first. A module depends on template position and page assignments, so it is easier to use as a secondary block. If the menu works but the module does not, troubleshoot the position, source, access, and menu assignment.
What should I choose for the first page: Classic, Masonry, or Packery?
For the first launch, choose Classic. It is more predictable and helps validate the data. Enable Masonry for images with mixed proportions, and use Packery only when the editor is ready to control accent sizes like 1x1, 1x2, 2x1, and 2x2. Do not start with Packery if the images are not prepared yet.
Why is the video not appearing in the card?
Check the media type, the accuracy of the Video ID, and the availability of the video on YouTube or Vimeo. The documentation specifically demonstrates those services. If the video is hosted locally or on another service, do not treat that as a standard supported scenario without confirmation.
Can I style the cards without editing extension files?
Yes. Official sources mention Custom CSS, and the documentation references a CSS field in the advanced tab. Use Custom CSS, the template's custom stylesheet, or a class suffix. Do not edit extension files, because an update may remove your changes.
What should I do if filters stop working after cache is enabled?
Disable JavaScript optimization and clear cache on a staging copy. Then re-enable optimization one layer at a time. Filter, lightbox, Packery, and Load More depend on scripts, so the conflict often comes not from portfolio data, but from script merging, script relocation, or deferred loading.
Is the extension suitable for a huge photo archive?
If you are dealing with thousands of images, bulk uploads, front-end user management, watermarks, and complex gallery permissions, it is better to compare specialized gallery solutions. JUX Portfolio Pro is more useful for a manageable work portfolio where each card has a purpose, a category, tags, and a visual presentation.
Do I need a separate page for every project?
If a project needs a description, gallery, video, extra field, or related projects, a detail page is useful. If the item only needs to function as an image inside the grid, the lightbox is enough. A good rule is to treat important case studies as full detail cards and leave secondary work in the list view.
When JUX Portfolio Pro is the right choice
JUX Portfolio Pro is worth using if you need a Joomla showcase for work with manageable categories, tags, item detail, lightbox support, images and video, multiple layouts, and the ability to publish content both as a standalone page and as a module. The extension is especially appropriate when the portfolio is growing and should be maintained by an editor rather than a developer hand-editing HTML.
Before final rollout, validate three checkpoints: the menu item displays the list, the detail page opens different project types correctly, and the module renders properly in the required position. After that, you can carefully enable Masonry or Packery, configure hover behavior, add Custom CSS, and expand the set of items. If your needs are closer to a large media gallery or client albums, compare the alternatives from the previous section before migrating all content.
Once the basic test is complete and the portfolio structure is clear, you can download the JUX Portfolio Pro archive and test it on a site copy or a staging page. That order is safer than changing a live section right away: first a small data set, then a stable page, then the module, filters, effects, and full content migration.
Nearby Materials | ||||
|
CW Article Gallery Pro - Joomla Extension | TZ Plus Gallery Pro - Joomla Extension |
|
|


