Skip Navigation

[Resolved] Masonry from posts on a Nested View

This support ticket is created 4 years, 7 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
- 10:00 – 13:00 10:00 – 13:00 10:00 – 13:00 10:00 – 13:00 10: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/Kolkata (GMT+05:30)

This topic contains 7 replies, has 3 voices.

Last updated by Jaime 4 years, 7 months ago.

Assisted by: Minesh.

Author
Posts
#1630899

Hi again Jamal!
Thanks a lot for your answer.
Very appreciated.
🙂

We almost have solved the problem, but still there is a little issue.
As you can see in my screenshot attached, with your code we have solved the problem with the blank spaces, but we still have a problem because the View starts a new Masonry for each "Anecdotas".
Is it possible to make a unique Masonry for all the "Anecdotas", avoiding this blank spaces on the right side of the screen?

#1630931

In order to create a masonry the way you did on the previous ticket, with loading the script and using <div class="masonry-grid"> markup, you will have to use a view that will query the anecdotes directly. Unfortunately, there is no way in Toolset to filter by the grand parent. However, this can be done by custom coding.

You can do it, either by creating a custom shortcode that will return the results or by hooking into the view's query. In both cases, you will need to use the Toolset relationships API, using toolset_get_related_post or toolset_get_related_posts

Passing results to the view:
The idea is to do the query and pass the results to the view, the view will then render the results. You will pass the results this way:

[wpv-view name="my-anecdotes-view" ids="[my-custom-shortcode grandparent="[wpv-post-id]"]"]

The custom shortcode will use the toolset_get_related_posts to get the "Peliculas" and go through each one to get the Anecdotas. This can also be done with two views(nested), similar to the current way, but that return only the ids separated by ",".
Code for the view:

[wpv-view name="my-anecdotes-view" ids="[wpv-view name="my-rutas-peliculas-ids"]"]

The code for the "my-rutas-peliculas-ids" view will be similar to:

[wpv-items-found]<!-- wpv-loop-start --><wpv-loop>[wpv-view name="my-pelicula-anecdotas-ids"],</wpv-loop><!-- wpv-loop-end -->[/wpv-items-found]

Notice the "," after the nested view.

And the code for the "my-pelicula-anecdotas-ids" view will be similar to:

[wpv-items-found]<!-- wpv-loop-start --><wpv-loop>[wpv-post-id"],</wpv-loop><!-- wpv-loop-end -->[/wpv-items-found]

Filtering the view
The idea is to use the Views filter to modify the view's query and use the post__in parameter to pass the results of the grandchildren ids.

I hope this helps. Let me know if you have any questions.

#1631713

Hi Jamal.
Thanks again for your answer.
You're great!
🙂

Unfortunately, I'm not very used to work with custom shortcodes...
So, please let me some days to have a look and try to better understand your answer.

I'll leave this ticket open, if yo don't mind, while I investigate.
(anyway, if you have any other suggestions or guidelines, it will be more than welcomed...!)
Thanks again.
See you again on a couple of days.

🙂

#1632057

Hello and thank you for your kind words.

As I have never tried to generate the ids with nested views and pass them to a view, I made a test and it was successful. I did not create a masonry, but I did generate all the grandchildren on the grandparent post on a view, which can help you do the same for your masonry grid. You can check it on this page hidden link

I have the following custom post types and relationships:
- Custom post types: Grandpas, Fathers, Kids.
- Relationships:
-- Grandpa - Fathers: One-to-many relationship.
-- Father - Kids: One-to-many relationship.

I created the following views and content template:
- "Father - Kids - IDs": Returns the IDs of kids related to the current post in the loop.
- "Grandpa - Fathers - IDs": Returns the IDs of fathers related to the Post where this view is shown. We will update this view to use the "Father - Kids - IDs" view. This way, each father will return the IDs of his kids instead of just his ID.
- "Grandpa - Kids": Displays the kids. By default, this view should return all the posts(Kids). But we will pass a set of post IDs to it.
- "Grandpa CT": A content template that will display a Grandpa post. This content template will use, both, the "Grandpa - Kids" and the "Grandpa - Fathers - IDs" views.

There are also some considerations to take while creating the "Father - Kids - IDs" and "Grandpa - Fathers - IDs" views:
- The views should not be wrapped in a div
- The view loop code should be on one line.
- The view should not have the [wpv-no-items-found] shortcode.
- The loop should contain a "," except for the last item. This can be leveraged with the index attribute of [wpv-item] shortcode.
Check this screenshot hidden link

You can log in to this test server and check that by using the user/password: admin / admin123
Please let me know when you check it, or export the views and let me know, so I can destroy that test server from our platform.

Here are some docs that will help you go through this:
- Views shortcodes: https://toolset.com/documentation/user-guides/views/views-shortcodes/

I hope this helps. Let me know if you have any questions. In the meantime, I'll set this ticket as waiting for your feedback, which should keep it open for 3 weeks. If that example helps you to implement your masonry grid, please mark this ticket as resolved.

#1637337

Hi again Jamal!
Thanks A LOT for your patience and absolutely clear information.
You're great.
🙂

I've been trying to reproduce your step by step guide and I've reach to show the list of child into the grandparent Layout. But I'm not able to make the filtering. It shows me all the childs.

I've reproduce your same Views and Content Template (with the same names, and copying - pasting the codes) into my website.
The only difference is the CPT names are: Grandparents -> Rutas / Parents -> Peliculas / Child -> Anecdotas
The rest is all the same.

So, in order to continue my investigation to solve my problem, some doubts:
1) I'm using a Layout to display my Grandparents, and you are not, right? This could be some part of my problem?
1.1 ) I've inserted both on my Layout ('Grandpa - Kids' View and 'Grandpa CT' Content Template) just to try. Both shows the same results to me. (You can see the results here, on the bottom of the page. I've put a big red font to mark them hidden link)
2) You said that "The view should not have the [wpv-no-items-found] shortcode." but on your 'Grandpa - Kids' View there is a [wpv-no-items-found] shortcode. Maybe this could be the problem with my filtering?
3) And the big question...
Maybe I'm not should copy /paste your code but try to add some filtering o the views with your first post information where you where talking about the custom shortcodes?

Anyway, Jamal, I really appreciate your time and effort.
Truly thankful.
شكرا
🙂

#1637377

Minesh
Supporter

Languages: English (English )

Timezone: Asia/Kolkata (GMT+05:30)

Jamal is on Vacation. This is Minesh here and I'll take care of this ticket. I hope this is OK.

Is it possible for you to send me access details and tell me when you say you do not able to filter the results. Can you please share for which post you want to filter the results. This is your problem URL hidden link - correct?

*** Please make a FULL BACKUP of your database and website.***
I would also eventually need to request temporary access (WP-Admin and FTP) to your site. Preferably to a test site where the problem has been replicated if possible in order to be of better help and check if some configurations might need to be changed.

I have set the next reply to private which means only you and I have access to it.

#1638133

Minesh
Supporter

Languages: English (English )

Timezone: Asia/Kolkata (GMT+05:30)

Can you please check now: hidden link
(I'v added the section "Changes Added by Minesh" at bottom of the page)

I've created the following view "list-related-Pelicula" that query the related Pelicula posts for the current Ruta:
=> hidden link

Then, I've created the following view "list-related-Anecdota" that query the related post of post type Anecdota belongs to Pelicula.
=> hidden link

Then, I've added the "list-related-Anecdota" to the Loop editor of "list-related-Pelicula" view as you can see with the Loop editor section of the view "list-related-Pelicula":
=> hidden link

<ul>
		<wpv-loop>
           <li>  [wpv-post-link] </li>
           <ol>  [wpv-view name="list-related-anecdota"]</ol>
		</wpv-loop>
</ul>

As you can see now at bottom of the pate: hidden link
- It displays first the post title link for the related Pelicula and within the Pelicula title it displays the related Anecdota.

You can format the Loop Editor section as per your need. I hope this will help you to resolve your issue and please let me know if you need further assistance 🙂

#1638375

My issue is resolved now. Thank you!