How to get a working wishlist icon in the divi blog module (loop)

See more:

modules

Button

I use the Divi Blog module (loop), but it lacks some functions. So with a childtheme and code I retrieve post meta in the Divi Blog Module, thats all working fine. But, I also want a working wishlist icon in the loop per post.

I use the plugin Divi Machine for multiple things, like a memberarea. They also have a module Wishlist (add_wishlist). I use this module on single post, where it works great. But I also want to use this module in the Divi Blog Module.

I used inspector to find the code that is used for the add to wishlist heart in a single post and it's like this, but how can I use this to als make it work as php code for the divi blog module.

<a href="#" class="add_wishlist  " data-post_id="5921" data-saved_or_dislike="saved" data-post_type="activiteit" data-saved_type_single="wishlist" data-saved_type="wishlist" data-adding_text="Adding to your list" data-success_text="Added to your list" data-remove_adding_text="Removing from your list" data-remove_success_text="Removed from your list" data-account_url="https://www.hulpbijhb.nl/account" data-timer_delay="1500" data-use_popup="off" data-relation="none" data-loggedin="yes">
  </a>

What I have tried:

So far I got this.

I used this code

$add_wishlist = add_action($post->ID, 'add_wishlist', true) ? add_action($post->ID, 'add_wishlist', true) : "";
if($add_wishlist != "") { 
echo '<div class="add_wishlist">'. $add_wishlist . '</div>'; 
}

1. There is a heart and it's clickable and it changes when you click it, but it doesn't save the post in the wishlist page. How can I make this work?

2. A number 1 appears before the heart, why is that? And how can I remove that?

3. I would like to place the heart on top of the image in the right corner above of that post? I can move the heart to the image container, but then it appears above the image. What is the best way to make it possible?



I hope somebody can help me with this.

Thank you very much!