Skip Navigation

[Resolved] Conditional Display of Row for Gallery if More than Just Featured Image?

This support ticket is created 6 years, 5 months ago. There's a good chance that you are reading advice that it now obsolete.

This is the technical support forum for Toolset - a suite of plugins for developing WordPress sites without writing PHP.

Everyone can read this forum, but only Toolset clients can post in it. Toolset support works 6 days per week, 19 hours per day.

Sun Mon Tue Wed Thu Fri Sat
- - 14:00 – 20:00 14:00 – 20:00 14:00 – 20:00 14:00 – 20:00 14:00 – 20:00
- - - - - - -

Supporter timezone: Asia/Ho_Chi_Minh (GMT+07:00)

This topic contains 3 replies, has 2 voices.

Last updated by J S 6 years, 5 months ago.

Assisted by: Beda.

Author
Posts
#923208

J S
Screen Shot 2018-07-10 at 5.50.26 PM.png
Screen Shot 2018-07-10 at 5.50.54 PM.png
Screen Shot 2018-07-10 at 5.49.58 PM.png

How do I conditionally display a row for a gallery, only if there is more than 1 image for the post?

In other words, my posted require at least 1 image and this is the featured image. I have a gallery that displays via a row in a layout but when there are no images in the gallery, there is too much space below the featured image and I would like to tighten up this space when the gallery is empty. See screenshot and my code for the gallery row.... and BTW, I've already disabled Automatic Paragraphs for this row.

<br>[wpv-for-each field='wpcf-image']
[wpv-conditional if="( $(wpcf-image) ne '' )"]
<a class="gallery-image" href="[wpv-post-field name='wpcf-image']" data-rel="prettyPhoto[product-gallery]">
[types field='image' size='thumbnail' align='none' resize='proportional'][/types]
</a>
[/wpv-conditional]
[/wpv-for-each]
#923360

As I unterstand the issue you already successfully hide your HTML when there is no such gallery/image:

[wpv-conditional if="( $(wpcf-image) ne '' )"]

But, since you do that in Toolset Layouts, the row, where the Visual Editor Cell is inserted, "displays" wether or not the content is empty.
There is no setting to display a row conditionally in the Layouts Guided User Interface (GUI)

However, you can remove what Toolset Layouts natively outputs, or wrap it in your custom HTML, if for example a Visual Editor Cell is empty.
Let me give you an example of the basics how you can create such a filter that then is added to your Themes functions PHP:

We use the Layouts filter "ddl_render_row_start", which allows to override the markup structure that is rendered for the row element in the grid.
https://toolset.com/documentation/programmer-reference/layouts-framework-api/#ddl-render-row-start

add_filter( 'ddl_render_row_start', function( $markup, $args, $row, $renderer ){

$is_empty = false;//We assume first you have some content in the Visual Editors and want to render them

$cells = $row->find_cells_of_type( 'cell-text' ); //We find all cells, that are of type "cell-text" (Visual Editor)
 
        if ( is_array( $cells ) && count( $cells ) > 0 ) { //IF there are such cells
            foreach ( $cells as $cell ) { //For each Visual Editor Cell (no matter if on differnt rows)
                $content = $cell->get('content'); //Get the content of those Visual Editors
                if( '' === $content ){ //If that content is empty
                    $is_empty = true; //Set the $is_empty to true (Visual Editor is empty, has no content)
                    break; //Stop iteration
                }
            }
        }

        if( $is_empty ){ //If we had a empty Visual Editor we modify the outout html and add a class "hidden". Additional HTMNL classes/id are still used as set in the Layouts settings.
        //you can modify this as you like

            ob_start();?> 

    		<<?php echo $args['tag']; ?> class="hidden <?php if ($args['additionalCssClasses']) { echo $args['additionalCssClasses']; } ?>"<?php if ($args['cssId']) { echo ' id="' . $args['cssId'] . '"'; } ?>><div class="<?php printf('%s', $args['container_class']) ?>"><div class="<?php echo $args['row_class'] . $args['type']; ?>"><?php
        
        $markup = ob_get_clean(); //Populate the new HTML markup with what we set above in the ob_cache
            
        }

        return $markup; //return it to the layotu to apply
        
}, 99, 4 );

I suggest to have only ONE Visual Editor in the layout, so you can make sure that all the other content is still rendered (see in the code sample we apply this only for Visual editor Cells).

If you require help with this customization, I suggest to consult the list of external developers here:
https://toolset.com/contractors/

#923648

J S

Thanks for this. So do I understand correctly that by inserting this code in my functions.php file, the empty rows will be hidden? I've copied and pasted the above code exactly as a Code Snippet (Code Snippet Plugin) and activated the snippet but it doesn't seem to have the desried affect.

Is there something I need to do besides add this to functions.php (or snippets) ?

See white space here: hidden link

#923650

J S

Nevermind, I changed my columns around to acheive the desired affect....thanks!!