-
AuthorPosts
-
February 11, 2018 at 5:37 pm #910766
When i click portfolio image it redirects me to the next page. I want to open a modal box instead.
February 11, 2018 at 7:39 pm #910783Hey farahjanjua,
Please try using the masonry gallery element, and choose lightbox from the Image Link option. The masonry element doesn’t open the images in lightbox.Best regards,
MikeFebruary 11, 2018 at 8:51 pm #910794Thanks Mike !
This works but using this I can not select from portfolio categories. I want to show categories based images and clicking them should open the light box.February 11, 2018 at 9:15 pm #910799Hi,
Try using the Portfolio Grid element, it will give your the sorting and open the images in lightbox.Best regards,
MikeFebruary 11, 2018 at 9:46 pm #910803Then I could not have flexible masonry style that I used to have on other pages. Consistency will affect :/ I want portfolio grid along with flexible masonry .
February 12, 2018 at 11:20 am #911021Hi,
Sorry, The masonry element doesn’t open the images in lightbox.
But Please feel free to request – or vote if already requested – such feature on Enfold feature request form.Best regards,
MikeApril 2, 2022 at 6:43 pm #1347006Here’s a solution I was able to use, with a few small compromises …
Making a portfolio page appear in the lightbox but without a footer and header and no navigation arrows:
This only works if you can accept ALL portfolio pages displaying without a header and footer and you generally want to switch off the Lightbox navigation arrows!
1. Add this CSS to the general style options:
.single-portfolio #footer {
display: none;
}.single-portfolio #header {
display: none;
}#top .avia-post-nav {
display: none;
}.mfp-arrow {
display: none !important;
}2. Then add a masonry gallery to your page. Add the pictures from the media gallery.
You need to configure the Masonry Gallery with specific settings. These are mine that work:CONTENT TAB:
Select Images: (your pictures, preferably of the portfolio item)Captions: Display Neither
STYLING TAB:
Masonry Settings:
Styling: Perfect Grid
Orientation: Portrait
Image Size: Gallery (845×684)
Gap between elements: No GapColumns:
Columns: 4Pagination:
Image Number: 24
Pagination: No option to view additional images
Colors: DefaultADVANCED TAB:
Animation: No effect, Animation deactivated
Link Settings:
Image Link: Use custom link (fallback is no link)
Custom Link destination: Open in a new window3. Within the masonry gallery, open the list of pictures you added and click on one. In the sidebar, add a custom, individual link to the corresponding portfolio page that you want to display in the Lightbox, but in this style: (with an additional /?iframe=true at the end):
https://YOUR-DOMAIN.com/portfolio-item/lammjacke/?iframe=true
4. Order the pictures in the list as required, save everything.
5. Save the page and reload the view of the page.
- This reply was modified 2 years, 7 months ago by coldstreamer. Reason: Added Masonry setup (I discovered this is needed to make it work properly, and I added the Lightbox nav arrow removal possibility)
April 2, 2022 at 7:12 pm #1347008Hi,
Thank you for sharing your solution, hopefully this will help other users.
If you have any further solutions or questions please feel free to create a new thread and we will gladly try to help you. Thank you for using Enfold.Best regards,
Mike -
AuthorPosts
- The topic ‘How to display portfolio items in modal box’ is closed to new replies.