Skip Navigation

[Resolved] Fill pad and last-pad items with loop-items instead of empty content

This support ticket is created 4 years, 2 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
- 9:00 – 13:00 9:00 – 13:00 9:00 – 13:00 9:00 – 13:00 9:00 – 13:00 -
- 14:00 – 18:00 14:00 – 18:00 14:00 – 18:00 14:00 – 18:00 14:00 – 18:00 -

Supporter timezone: Asia/Karachi (GMT+05:00)

This topic contains 2 replies, has 2 voices.

Last updated by peterV-10 4 years, 2 months ago.

Assisted by: Waqar.

Author
Posts
#1496961
Toolset-fill-pad-with-loop-items.jpg

Tell us what you are trying to do?
I have a view with Bootstrap 4 : <wpv-loop wrap="4" pad="true">
In my query results I have 6 records.
Now, displaying the results gives two rows: first row with 4 records, and second row with 2 records, plus a "pad" and "last-pad" item.
I want to fill those two last columns with loop-records 1 and 2, so the view will always display "complete" rows with 4 columns (so without filling the pads with fixed content).

Is there any documentation that you are following?
I searched the Toolset documentation and forums... No results there.

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

#1497923

Waqar
Supporter

Languages: English (English )

Timezone: Asia/Karachi (GMT+05:00)

Hi Peter,

Thank you for contacting us and I'd be happy to assist.

There is no direct built-in feature available to achieve this, so you'll need to use a workaround.

You can create a new post view for showing the same post type as your existing view for the slider and with the exact same post order settings.

Additionally, in the "Limit and Offset" you'll select 1, because this new view will be needed to show exactly one result/post.

As for the content for the loop item, you can choose the "Unformatted" layout in the Loop Wizard and only include the HTML for the single slide in the loop.

Note: Also check the "Disable the wrapping DIV around the View" option below the "Loop Editor" so that the new view is not wrapped inside its own container div.

Now that this new view is ready, you'll need to include it in the main view, for the padded grid items. But before that, you'll need a custom shortcode, which can get the current loop item's position and the number of total results available on-page and then calculate the offset value for the new/child view:


add_shortcode( 'show_output_pad_item', 'show_output_pad_item_func');
function show_output_pad_item_func($atts) {

$a = shortcode_atts( array(
		'index' => '',
		'items' => ''
	), $atts );

$offset = ($a['index'] - $a['items']) - 1;

$output = do_shortcode('[wpv-view name="slug-of-the-child-view" offset="'.$offset.'"]');
	
return $output;

}

The above code snippet can be included through either Toolset's custom code feature ( ref: https://toolset.com/documentation/adding-custom-code/using-toolset-to-add-custom-code/ ) or through active theme's "functions.php" file.

This shortcode accepts two attributes:
index: current item's position in the loop
items: total number of available results on the page

Please also replace "slug-of-the-child-view" with the actual slug of your newly created view.

The shortcode [wpv-loop-index accumulate='false' offset='0'] will give you the current item's position:
https://toolset.com/documentation/user-guides/views/views-shortcodes/#wpv-loop-index

And the shortcode [wpv-items-count] will give you the total number of available results on the page:
https://toolset.com/documentation/user-guides/views/views-shortcodes/#wpv-items-count

The new custom shortcode can be called inside the padded loop items ("pad" and "last-pad") as:
( screenshot: hidden link )


[show_output_pad_item index="[wpv-loop-index accumulate='false' offset='0']" items="[wpv-items-count]"]

As a result, whenever your main slider view will have 1, 2 or 3 empty grid blocks, they'll be filled automatically with first, second and third results/posts, accordingly.

I hope this helps and for more personalized assistance around custom code, you can also consider hiring a professional from our list of recommended contractors:
https://toolset.com/contractors/

regards,
Waqar

#1498333

My issue is resolved now. Thank you!

This ticket is now closed. If you're a WPML client and need related help, please open a new support ticket.