[Resolved] Display Custom Media Field(Multi. instances) in a Specific Format with View

[Author]

Posts

[aprilA]

Tell us what you are trying to do? I am trying to display a custom media field with multiple instances in a custom post type in a certain structure. Is this something I can use a view for?

My original though was trying to let a view load that field and it would loop through each instance with the format I would want it to display, but that doesn't work as its trying to loop through all posts of my custom post type, not each instance of the media field. I want to use the view shortcode that would only use the current post's info. I also can not use a repeatable field group for this because I have over 200 posts I need to import and I can not properly use an import with repeatable fields in Toolset.

Am I making this more complicated than I need to?

The custom format is because I am wanting to load these images into a lightslider that requires a certain format to load properly.

Loop Editor

[wpv-layout-start]
	[wpv-items-found]
<ul id="imageGallery">
	<!-- wpv-loop-start -->
	<wpv-loop>
		[wpv-post-body view_template="loop-item-in-weed-images-lightslider"]
	</wpv-loop>
  </ul>
	<!-- 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]

Template for View

<li data-thumb="[types field='weed-images' size='thumbnail' url='true'][/types]" data-src="[types field='weed-images' size='full' url='true'][/types]">
[types field='weed-images' title='%%TITLE%%' alt='%%ALT%%' size='full'][/types]
</li>

[Minesh]

Hello. Thank you for contacting the Toolset support.

To display the repeating field, Toolset offers the Repeating field block.

But as I can see you are using the view to display the repeating field. To loop through the repeating field, you will require to use the shortcode [wpv-for-each].

More info:
=> https://toolset.com/documentation/programmer-reference/views/views-shortcodes/#vf-153482

Also, if you are displaying this view on single post of your post type, then you will require to filter your view for your post where you are displaying this view.

If you do not able to figure this out, please share problem URL and access details with all required information about where you want to display the repeating field.

*** 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.

[aprilA]

Hi Minesh,

So I understand what you are saying, but the issue is that I am using Divi Builder to create a template for these custom post types. The reason I am using Divi is that it allows me to manage everything directly with the builder.

I have used the wpv-for-each, but I ran into issues. When I try to use the [wpv-for-each] shortcode, the Divi builder doesn't like having a shortcode within a shortcode. What I mean is if I try to use [wpv-for-each] and then within that for-each if I try to call the custom field like this

[wpv-for-each field="wpcf-weed-images"]
  <li>[types field="weed-images"][/types]</li>
[/wpv-for-each]

Divi creates the HTML out as

<div class="et_pb_text_inner"><p></p>
<li>[types index="0" field="weed-images"][/types]</li>
<p></p>
<li>[types index="1" field="weed-images"][/types]</li>
<p></p>
<li>[types index="2" field="weed-images"][/types]</li>
<p></p>
<li>[types index="3" field="weed-images"][/types]</li>
<p></p></div>

So Divi is understanding the first shortcode of for each, but it doesn't like that I am then trying to call the custom field value again within that for-each. If I am unable to use Divi builder for this page template, I am willing to look into the using Toolset's Content Template, I just was trying to have all templates being used to be within Divi vs having 1 outside of it.

If you have never used Divi Builder you can find all of the templates under Divi > Theme Builder. Then you will see a Template named All Weeds.

I am fine setting up a temp. account with access. This is already in a testing environment.

Website URL: hidden link
Username: toolset-support
Pass: BYxpcBd86yPAJUngxcP#%HjF

[Minesh]

I've added the repeating field as given under to your Divi Text module:

<ul>
	<li>[types field="weed-images" separator="</li><li>"][/types]</li>
</ul>

Can you please confirm this way it will work?

[aprilA]

Oh that is getting closer. I had considered trying to use the separator like that, but this is the format I am needing each to fit. The custom slider I am using needs the data-thumb and data-src attributes to load correctly.

<ul id="imageGallery">
<li data-thumb="[types field='weed-image' size='thumbnail' url='true'][/types]" data-src="[types field='weed-image' size='full' url='true'][/types]">
[types field='weed-image' title='%%TITLE%%' alt='%%ALT%%' size='full'][/types]
</li>
</ul>

[aprilA]

I already have this loop/format working with a repeatable field group with the toolset view: weed-images-lightslider

But as I said before I am unable to use a repeatable field group as I will not be able to import all of my images for all 190+ weeds easily, since most importing tools do not support Toolset's Repeatable Custom Field Groups, if that makes sense. That is why I was trying to utilize the multiple instances of just the image field above with multiple instances.

[aprilA]

For some reason I am unable to edit my reply above, but I wanted to make sure I shared my other view correctly. But I can't use this view because it uses a repeatable field group. If only I could create the for-each format to match this loop output.

<ul id="imageGallery">
	<!-- wpv-loop-start -->
	<wpv-loop>
		[wpv-post-body view_template="loop-item-in-weed-images-lightslider"]
	</wpv-loop>
  </ul>
	<!-- wpv-loop-end -->

Loop

<li data-thumb="[types field='weed-image' size='thumbnail' url='true'][/types]" data-src="[types field='weed-image' size='full' url='true'][/types]">
[types field='weed-image' title='%%TITLE%%' alt='%%ALT%%' size='full'][/types]
</li>

Thank you for looking for other methods of getting what I need. Hopefully, you are able to find something.

[Minesh]

Can you please check now: hidden link

I've created the following content template and added the [wpv-for-each] shortcode as given under:
=> hidden link

<ul id="imageGallery1">
[wpv-for-each field="wpcf-weed-images"]
  <li data-thumb="[types field='weed-images' size='thumbnail' url='true'][/types]" data-src="[types field='weed-images' size='full' url='true'][/types]">
	[types field='weed-images' title='%%TITLE%%' alt='%%ALT%%' size='full'][/types]
</li>
[/wpv-for-each]
 </ul>

To this content templatee's JS box, i've added the following JS:

(function($) {
  $(document).ready(function() {
    $('#imageGallery1').lightSlider({
        gallery:true,
        item:1,
        loop:true,
        thumbItem:9,
        slideMargin:0,
        enableDrag: false,
        currentPagerPosition:'left',
        onSliderLoad: function(el) {
            el.lightGallery({
                selector: '#imageGallery1 .lslide'
            });
        }   
    });  
  });
     
})( jQuery );

And within your Divi themer's layout - within the Text Module you added, I've called this content template as given under:

[wpv-post-body view_template="ct-to-display-weed-images"]

Can you please confirm it works as expected with your repeating field now.

[aprilA]

Hey Minesh!

My issue is resolved now. Thank you so much. This is what I was needing, but I just didn't understand the correct setup for using the content template with my divi builder template.