Hello,
I am using visual composer and ACF and the Jupiter theme. The acc shortcode orin visual composer works for normal ACF fields but if I assign a repeater field to it, it displays the word "array" on the frontend.
I'm assuming I need to loop through the ACF repeater in the template, but I don't want to create a seperate template for the page.
I've read that you can add it to the functions.php file, and am thinking that I can add to after the $content (this will work for the pga layout I need)
I don't have a specific repeater field set up but need the generic code to make this happen.
If there's a better way of making this work, like making the repeater field actually work through the ACF shortcode in VC that would be great.
Cheers,
Chris.
Rempty answers:
Hi,
function acf_locations_shortcode($atts){
extract(shortcode_atts(array(
"postid" => '1'
), $atts));
$ret="";
$rows = get_field('locations',$postid);
if($rows){
foreach($rows as $row){
$image = wp_get_attachment_image_src( $row['image'], 'full' );
$ret.='<div class="left">
<img src="'.$image.'" />
</div>
<div class="right">
<h2>'.$row['title'].'</h2>
<p>'.$row['location'].'</p>
<p>'.$row['description'].'</p>
<div class="table-wrapper">'.$row['table'].'</div>
</div>';
}
}
return $ret;
}
add_shortcode('acf_locations_shortcode','acf_locations_shortcode');
How use:
You must write:
[acf_locations_shortcode postid="123"] Where 123 is the id of the post.
crc comments:
Hi,
This is the repeater: https://www.advancedcustomfields.com/resources/repeater/
Based on the template usage in the above url I don't think the shortcode you suggested will work for the repeater.
Rempty comments:
Add this code to your functions.php
function acf_repeater_shortcode($atts){
extract(shortcode_atts(array(
"postid" => '1',
"field_name" => 'blog',
"subfields"=>'subfield_1,subfield_2'
), $atts));
$ret="";
$rows = get_field($field_name,$postid);
$sfields=explode(",",$subfields);
if($rows){
$ret='<ul>';
foreach($rows as $row){
$ret.='<li>';
foreach($sfields as $subfield){
$ret.=$row[$subfield].' ';
}
$ret.='</li>';
}
$ret.='</ul>';
}
return $ret;
}
add_shortcode('acf_repeater_shortcode','acf_repeater_shortcode');
How works
[acf_repeater_shortcode postid="123" field_name="repater_field_name" subfields="sub_field_1,sub_field_2" /]
You need the postid, the name of the repeater field, and the name of the subfields of your repeater separate by comas.
crc comments:
Hi Rempty,
Thanks for this. How do I now add this to the page?
Rempty comments:
You can write the shortcode inside a content text box, i think VC have a text content box where you can write your content
Example you have a repeater called "teams" and have subfields "team_name" and "team_totals", and the id of the post is 345
[acf_repeater_shortcode postid="345" field_name="teams" subfields="team_name,team_totals" /]
crc comments:
Hi,
That's almost working!
My example repeater has subfields of subfields, how would this work? My example set up is a menu and I currently have two subfields:
Appetizers & Main course. These each then have subfields
Thesis what is displaying on the font end after using the following shortcode:
[acf_repeater_shortcode postid="193" field_name="menu_sections" subfields="section_title,section_items" /]
• Appetizers Array
• Main course Array
This is the site I was sort of following when setting this up:
http://www.wpbasics.org/2016/03/14/advanced-custom-fields-restaurant-menu/
Rempty comments:
Do you want the menu loop as a shortcode??
crc comments:
Hi Rempty,
Never mind about the subfields of subfields - that was just an example I was working with and it won't apply for my real life example I'm working towards.
I need the code that is generated to look something like this:
<div class="">THUMBNAIL IMAGE</div>
<div class="right">
<div class="">TITLE</div>
<div class="">DESCRIPTION</div>
</div>
THUMBNAIL IMAGE, TITLE, & DESCRIPTION are the subfields.
Thanks.
Rempty comments:
Hi crc
I need the name of the subfields (thumbail image, title, description)
crc comments:
Hi,
field name is "Locations"
subfield names are "image,title,location,description"
cheers
crc comments:
Hi Rempty,
I believe you have answered my original question, so thank you!
As I now need the code expanding as I've noted, I've increased the prize from $10 to $20! Would be great if you can help.
Cheers,
Chris.
crc comments:
Hi Rempty,
I believe you have answered my original question, so thank you!
As I now need the code expanding as I've noted, I've increased the prize from $10 to $20! Would be great if you can help.
Cheers,
Chris.
Rempty comments:
Hi crc
Sorry for late response:
I need the structure of your repeater
Example
Repeater name: repeater_works
-Repeater field: work_atributes
Subfield: work_name
Subfield: work_desc
Subfield: work_image
I think this will not be reutilizable for other repeaters, because each repeater have their own fields and field types
But i will create a shortcode to show the results with the html structure you show me.
crc comments:
Thanks Remty,
Sorry for my late response! Thanks for your help on this.
I hope this outlines what you need, however I have included a screenshot of the Custom Field Group page.
Field Group name: Leasing Opportunities
Repeater field: locations
Sub fields:
1. Label: Image
Name: image
Type: Image
Q: What should I set this to - Image Array, Image URL or Image ID ?
2. Label: Title
Name: title
Type: Text
3. Label: Location
Name: location
Type: Text
4. Label: Description
Name: description
Type: Text
5. Label: Table
Name: table
Type: Wysiwyg Editor
This is what I need printed:
<div class=“left”>
<img scr=“image”>
</div>
<div class=“right”>
<h2>Title</h2>
<p>Location</p>
<p>Description</p>
<div class=“table-wrapper”>Table from Wysiwyg editor</div>
</div>