Skip Navigation

[Closed] How to: Image Gallery from repeating fields?

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.

This topic contains 1 reply, has 2 voices.

Last updated by Luo Yang 7 years, 3 months ago.

Assigned support staff: Luo Yang.

Author
Posts
#99857

Hi,

I have crated a custom post type that uses an image repeater. It is for a portfolio where the admin can upload photos (via the toolset repeater function) to a page. At issue is how can I use this to display thumbnails that then link to the larger size of the photo.

This is what I have so far:

<style>
#outer { overflow: hidden; }
#outer div { float: left; }
</style>


[wpv-layout-start]
[wpv-posts-found]
<div id="outer">
<!-- wpv-loop-start -->
   <wpv-loop> 
     <div>[types field="photograph" width="150" height="150" proportional="false" align="center" separator="</div><div>"][/types]</div>
   </wpv-loop> 
<!-- wpv-loop-end -->
</div>
[/wpv-posts-found]
[wpv-no-posts-found][wpml-string context="wpv-views"]<strong>No posts found</strong>[/wpml-string][/wpv-no-posts-found]
[wpv-layout-end]

It is very basic. My goal is ideally to list out the thumbnails and when the user clicks on one a lightbox opens also displaying the image title and description. can you point me in a direct to accomplish this.

Thank you!

#100020

Luo Yang
Supporter

Languages: English (English ) Chinese (Simplified) (简体中文 )

Timezone: Asia/Hong_Kong (GMT+08:00)

Hi Sammut,

To display thumbnails that then link to the larger size of the photo, Please try Views shortcode wpv-for-each, like this:

<wpv-loop> 
[wpv-for-each field="wpcf-photograph"]
<div><a href="[types field="photograph" size="large" url="true"][/types]">[types field="photograph" width="150" height="150" proportional="false" align="center"][/types]</a></div>
[/wpv-for-each]
</wpv-loop>

More help: https://toolset.com/documentation/views-shortcodes/#wpv-for-each

To clicks on one a lightbox opens also displaying the image title and description, you need create custom JS for it.

The topic ‘[Closed] How to: Image Gallery from repeating fields?’ is closed to new replies.