Load Portfolio Item on Lightbox using Essential Grid

Hi, is it possible to load a portfolio item in a lightbox while using Essential Grid?

Could you also explain how I can customize the Portfolio Item page template to have no header/footer? Just the content and custom fields by ACF Pro.

Thank you.

Hi there,

Thanks for posting in.

I think it’s possible with custom development, it’s a bit complex but yes possible. You may want to consult it to a developer as it may require a complete overhaul of a template and customization of the grid.

We can’t cover complex customization but if it’s a bit easier than maybe I could provide a little help.

Thanks!

I’ve hired a developer to customize it, but they’re struggling with loading a third party lightbox plugin. They said that “X theme is overriding any other lightbox plugin script, so we had to use the one that came with the theme”.

Is there a way to disable/remove the lightbox that came with the theme so that it doesn’t conflict?

Hi again,

I think this is what you’re looking for https://www.youtube.com/watch?v=Qp22VsoCq7c and for the documentation please see https://www.themepunch.com/essgrid-doc/lightbox-options/

Cheers!

We are trying to achieve the following:
https://webcache.googleusercontent.com/search?q=cache:N-t5xEXIMRAJ:https://www.themepunch.com/faq/lightbox-load-post-content-featured-image/+&cd=1&hl=en&ct=clnk&gl=in
(The original link is not working now, so its a google cached content.)

We modified the javascript to call ACF pro field values using Meta References in essential Grid.

We want to achieve a if statement, e.g.

If any field is empty the value should be blank.

This is our PHP code for that.

<?php $value = get_field( "extra_large" ); if( $value ) { echo "Extra Large :"; echo "" . $value . ""; } else { echo ''; } ?>

The custom JavaScript that we are loading is inside the secure notes.

We want it to be if the “titleWrap6” var is empty,
This should be empty as well rightBlock.html(content.html()).append("

Extra Small : ").append(titleWrap6);

Please assist.

Hi There,

Please note that for the get_field(), you have to supply post ID parameter if in case you are using it in a loop our outside the single post page. See this: https://support.advancedcustomfields.com/forums/topic/get_field-not-returning-values/

Not quite what we are looking for.
This is a question from our developer:

How to add an if statement to the JavaScript for Displaying ACF field values using custom Meta Data in essential Grid Items?

If a field is empty, the custom meta data for that field should not be displayed (which is working), but the field label is still being displayed.

If the custom field is empty we want the field label also not to display.

We were able to achieve this in PHP, but we need a JavaScript solution for the same result.

Any clues on how to achieve this?

Hi there,

I don’t think it’s possible with ACF field and EG. Unless you’ll modify the core functionality of EG plugin.

Please check this https://theme.co/apex/forum/t/essential-grid-lightbox-open-meta/4350/4

In that sample, which is also connected to https://webcache.googleusercontent.com/search?q=cache:N-t5xEXIMRAJ:https://www.themepunch.com/faq/lightbox-load-post-content-featured-image/+&cd=1&hl=en&ct=clnk&gl=in that you provided. The lightbox information is being appended to the content and pulled from SKIN element/layer. And that element/layer holds the information that you display.

You can choose the source of that element including custom meta (custom meta added through EG meta, or meta added through custom field, and there is no meta through ACF). Why not use EG’s built-in meta instead of ACF?

Thanks.