[Resolved] display posts conditionally

[Author]

Posts

[bryan]

Tell us what you are trying to do?
Conditionally output to a bootstrap post grid

Is there any documentation that you are following?
https://toolset.com/documentation/user-guides/conditional-html-output-in-views/debugging/

Is there a similar example that we can see?
hidden link

What is the link to your site?
hidden link

I wonder if this is normal ? its displays fine on a mobile phone but leaves holes in the grid... perhaps my conditional shorcodes should be elsewhere ?

[wpv-filter-start hide="false"]
[wpv-filter-controls]
[wpv-control-post-relationship ancestors="country@country-tour-guide.parent" url_param="wpv-relationship-filter"]
<div class="form-group">
	<label>[wpml-string context="wpv-views"]Countries[/wpml-string]</label>
	[wpv-control-post-ancestor type="select" ancestor_type="country@country-tour-guide.parent"]
</div>
[/wpv-control-post-relationship]
[wpv-filter-submit output="bootstrap"][/wpv-filter-controls]
[wpv-filter-end]

[wpv-layout-start]
	[wpv-items-found]
	<!-- wpv-loop-start -->
	<div class="container wpv-loop js-wpv-loop">
	<wpv-loop wrap="3" pad="true">
		[wpv-item index=1]
		<div class="row ">
			<div class="col-sm-4">[wpv-post-body view_template="loop-item-in-tour-guide-something"]</div>
		[wpv-item index=2]
			<div class="col-sm-4">[wpv-post-body view_template="loop-item-in-tour-guide-something"]</div>
		[wpv-item index=3]
			<div class="col-sm-4">[wpv-post-body view_template="loop-item-in-tour-guide-something"]</div>
		</div>
		[wpv-item index=pad]
			<div class="col-sm-4"></div>
		[wpv-item index=pad-last]
			<div class="col-sm-4"></div>
		</div>
	</wpv-loop>
	</div>
	<!-- wpv-loop-end -->
	[/wpv-items-found]
	[wpv-no-items-found]
		<strong>[wpml-string context="wpv-views"]No items found[/wpml-string]</strong>
	[/wpv-no-items-found]
[wpv-layout-end]

[wpv-post-author]
[wpv-conditional if="( $(wpcf-test-string-of-text) eq 'available' )" evaluate="false" debug="true"]  
[wpv-post-link]<br>
[wpv-post-body view_template="None"]<br>
[types field='main-photo' title='%%TITLE%%' alt='%%ALT%%' align='center' size='thumbnail' resize='proportional'][/types]
[types field="test-string-of-text"][/types]
[/wpv-conditional]
<br>

[Nigel]

Hi Bryan

When you create a View it queries the database depending on the settings and returns an array of posts.

The output section then loops over those posts and outputs the fields you specified.

When you wrap the fields in a conditional shortcode the posts are still looped over, you just don't output the fields when the condition fails.

If you add a grid to the mix, then you still get the grid scaffolding, whether or not you output the fields for a given post.

Hence the gaps in the grid.

Because of how the Bootstrap grid works, it needs a fixed number of items per row, so you can't simply omit the output of one of the posts and everything shuffle into place to fill the gap.

The solution is to either roll-your-own CSS grid that doesn't involve a fixed number of elements per row (should be easy enough to produce a flexbox alternative and edit the View markup as required), or to modify the results returned by the View so that the unwanted posts are not included in the first place.

If the test is for a custom field or taxonomy value, you can add a Query Filter to exclude posts based upon that.

(If you can't see the Query Filter section, go to Screen Options at the very top of the page and make sure it is checked.)

[bryan]

Gidday Nigel,

How is 2019 treating you ?

I love the scaffolding analogy - sometimes I think I should go back to real scaffolding rather than the non persistent kind. Anyway as usual a great explanation.

The intended use is to deal with a blob of html generated by a shortcode, which comes only after running through the loop - I need to rethink my approach now you have made everything clear with this excellent analogy.

cheers again to toolset's excellent support