How to show x number image random in acf
i have add code number number image random in acf don't show image
<?php
$images = get_field('khach_hang', 'option');
$rand = array_rand($images, 1);
if( $images ): ?>
<?php
$i = 0;
foreach( $images as $image ):
if ($i <= 19 ) { ?>
<img class="khac_hang_item" src="<?php echo $image[$rand]['url']; ?>" alt="<?php echo $image[$rand]['alt']; ?>" />
<?php $i++; } endforeach; ?>
<?php endif; ?>
I have 20 url image : <img class="khac_hang_item" src="" alt="" />
Any help greatly, Thanks
$rand will be an array of keys from $images..
I guess you should rewrite your code to something like this:
<?php
$images = get_field('khach_hang', 'option');
if( $images ):
$rand_keys = array_rand($images, 10);
foreach( $rand_keys as $key ): ?>
<img class="khac_hang_item" src="<?php echo $images[$key]['url']; ?>" alt="<?php echo $images[$key]['alt']; ?>" />
<?php endforeach; ?>
<?php endif; ?>
you should loop $rand_keys instead of $images...
Related
My code
<?php if( have_rows('mir_global_header') ): ?>
<div id="mid-bg1">
<div id="top-container1">
<?php while( have_rows('mir_global_header') ): the_row();
$count = get_row_index();
$header_image = get_sub_field('header_image');
$header_image_text = get_sub_field('header_image_text');
?>
<img src="<?php echo $header_image; ?>" id="<?php echo $count; ?>" alt="<?php echo $header_image_text; ?>" />
<?php endwhile; ?>
</div>
</div>
<?php endif; ?>
I've done everything as mentioned in the documentation. It's not working. Is it because ACF pro is not activated? Is there any other way to do this? Thanks in advance
If you're using ACF options page. You have to specify that in the have_rows. https://www.advancedcustomfields.com/resources/get-values-from-an-options-page/
<?php if( have_rows('mir_global_header', 'option') ): ?>
<div id="mid-bg1">
<div id="top-container1">
<?php while( have_rows('mir_global_header', 'option') ): the_row();
$count = get_row_index();
$header_image = get_sub_field('header_image');
$header_image_text = get_sub_field('header_image_text');
?>
<img src="<?php echo $header_image; ?>" id="<?php echo $count; ?>" alt="<?php echo $header_image_text; ?>" />
<?php endwhile; ?>
</div>
</div>
<?php endif; ?>
Are your fields in an options page or a classic post_type?
Test this for print a result
$mir_global_header = get_field('mir_global_header');
echo '<pre>';
print_r($mir_global_header );
echo '</pre>';die();
PS : ACF Gallery gives the same result ;)
https://www.advancedcustomfields.com/resources/gallery/
I try to implant this
- Page A0 (images + texts)
-- Page A1
-- Page A1
---Page A2
In page A1 & A2, I need to retrieves galerie and texts from a group of field.
If I use a normal field, not in a goup, I achieve this... But I need to stay in a group field.
<?php
$post_ID = get_the_ID();
$parentpost_id = wp_get_post_parent_id( $post_ID );
$images_images = get_sub_field( "images", $parentpost_id ); //use parents-post field: "broschuren-download"
?>
<div class="hero__image-wrapper <?php if (count ($images_images) > 1) { echo "heroslide" ;} ?> ">
<?php if ( $images_images ) : ?>
<?php foreach ( $images_images as $images_image ): ?>
<img class="hero__image fit-cover" src="<?php echo $images_image['sizes']['large']; ?>" alt="<?php echo $images_image['alt']; ?>" />
<?php endforeach; ?>
<?php endif; ?>
</div>
The get_sub_field() function only works within a have_rows() loop that you run on the parent field. If you still want to use get_sub_field(), you would have to do something like this:
<?php
$post_ID = get_the_ID();
$parentpost_id = wp_get_post_parent_id( $post_ID );
if( have_rows('broschuren-download', $parentpost_id) ): while( have_rows('broschuren-download', $parentpost_id) ): the_row();
$images_images = get_sub_field('images');
if ( $images_images ):
?>
<div class="hero__image-wrapper <?php if (count ($images_images) > 1) { echo 'heroslide'; } ?>">
<?php foreach( $images_images as $images_image ): ?>
<img class="hero__image fit-cover" src="<?php echo $images_image['sizes']['large']; ?>" alt="<?php echo $images_image['alt']; ?>" />
<?php endforeach; ?>
</div>
<?php
endif;
endwhile; endif;
?>
I'm trying to use a gallery field add-on to Wordpress' ACF plugin. The add-on is Navz Photo Gallery. All it does is to give you a way to get the gallery photos' IDs. Now I want to actually display the images.
By calling the following code
<?php if ( get_field( 'field_name') ) { ?>
<img src="<?php the_field( 'field_name' ); ?>" />
<?php } ?>
all I get are the actual IDs, like this:
<img src="21,22,23">
Does anybody know how to loop thru this group of images and display them individually, not just the ID, but the actual image?
For reference, ACF has an official (paid) gallery add-on, and it displays the attached images like this:
<?php $images = get_field('gallery'); if( $images ): ?>
<?php foreach( $images as $image ): ?>
<img src="<?php echo $image['url']; ?>" alt="<?php echo $image['alt']; ?>" />
<?php endforeach; ?>
<?php endif; ?>
Navz has helped me with this:
<?php
$images = get_field('fotos_do_projeto'); if( $images ): $images = explode(',', $images); $images = array_filter($images); if( count($images)):
?>
<ul>
<?php foreach( $images as $image ): $alt = get_the_title($image); $url = get_post_meta($image, 'field_5802bd6e39e9b_url', true); ?>
<li>
<a href="<?php echo $url; ?>" title="<?php echo $alt; ?>">
<?php echo wp_get_attachment_image($image, "thumbnail", false, ['alt' => $alt]); ?>
</a>
</li>
<?php endforeach; endif; ?>
</ul>
<?php endif; ?>
You can try this,
$attachment_id = get_field( 'field_name');
$image_attributes = wp_get_attachment_image_src( $attachment_id );
if ( $image_attributes ) : ?>
<img src="<?php echo $image_attributes[0]; ?>" width="<?php echo $image_attributes[1]; ?>" height="<?php echo $image_attributes[2]; ?>" />
<?php endif; ?>
I need to show the loop inside Advanced custom field. This code return only the first image.
<?php if( have_rows('colors') ): ?>
<ul>
<?php while( have_rows('colors') ): the_row(); ?>
<?php $image = wp_get_attachment_image_src(get_field('colori'), 'full'); ?>
<img src="<?php echo $image; ?>" alt="<?php echo get_the_title(get_field('colors')) ?>" />
<?php endwhile; ?>
</ul>
<?php endif; ?>
Inside a ACF Repeater Field you must use get_sub_field(), not get_field(). So your code should look like this:
<?php if( have_rows('colors') ): ?>
<ul>
<?php while( have_rows('colors') ): the_row(); ?>
<?php $image = wp_get_attachment_image_src(get_sub_field('colori'), 'full'); ?>
<img src="<?php echo $image[0]; ?>" alt="<?php echo get_the_title(get_sub_field('colors')) ?>" />
<?php endwhile; ?>
</ul>
<?php endif; ?>
It is possible that it returns false values again because I don't know how you named your ACF (repeater) sub fields.
The sub field 'colori' must be an ACF image field that outputs an ID. Not an array or something else.
wp_get_attachment_image_src() returns an array. [0] => url , [1] => width, [2] => height
Read the doc for a repeater field here.
I'm trying to integrate the Simple Lightbox plugin into Advanced Custom Fields image fields.
Basically I want any images on a page (populated via acf image fields) to open in the lightbox when clicked, and also be grouped together with all other images within the lightbox so they can be navigated through like a slideshow. This is built-in functionality for the Simple Lightbox plugin, but I don't know how to integrate it with my template code for image fields.
For acf WYSIWYG fields I'm using this...
<?php
$content = get_field('wysiwyg');
if ( function_exists('slb_activate') )
$content = slb_activate($content);
echo $content;
?>
...which works great, but adapting that to image fields is eluding me.
Here's my template code for image fields (without any attempts at integrating Simple Lightbox):
<?php
$image = get_field( 'img' );
if( ! empty( $image ) ) {
$url = $image['url'];
$alt = $image['alt'];
$caption = $image['caption'];
$size = 'large';
$thumb = $image['sizes'][ $size ];
$width = $image['sizes'][ $size . '-width' ];
?>
<?php if( $caption ): ?>
<div class="wp-caption" style="width: <?php echo $width; ?>px">
<?php endif; ?>
<a href="<?php echo $url; ?>">
<img src="<?php echo $thumb; ?>" alt="<?php echo $alt; ?>" />
</a>
<?php if( $caption ): ?>
<p class="wp-caption-text"><?php echo $caption; ?></p>
</div>
<?php endif; ?>
<?php } ?>
Any suggestions for how to integrate Simple Lightbox into this? Thanks in advance!
Use php output buffering to store your template in a variable. Put ob_start() at the top, then at the bottom ob_get_clean() will stop the output buffering, and you can save the return value to a variable. Then pass that to slb_activate.
<?php
ob_start();
$image = get_field( 'img' );
if( ! empty( $image ) ) {
$url = $image['url'];
$alt = $image['alt'];
$caption = $image['caption'];
$size = 'large';
$thumb = $image['sizes'][ $size ];
$width = $image['sizes'][ $size . '-width' ];
?>
<?php if( $caption ): ?>
<div class="wp-caption" style="width: <?php echo $width; ?>px">
<?php endif; ?>
<a href="<?php echo $url; ?>">
<img src="<?php echo $thumb; ?>" alt="<?php echo $alt; ?>" />
</a>
<?php if( $caption ): ?>
<p class="wp-caption-text"><?php echo $caption; ?></p>
</div>
<?php endif; ?>
<?php } ?>
<?php $content = ob_get_clean(); ?>
<?php echo slb_activate($content); ?>