I got this Wordpress site with a slideshow where I get the images from advanced custom fields repeater, but the source keeps on getting undefined. It's a taxonomy page and I use this following code:
<section class="slider">
<?php
$queried_object = get_queried_object();
$taxonomy = $queried_object->taxonomy;
$term_id = $queried_object->term_id;
$slider_images = array();
while (has_sub_field('slider_bilder')):
$image_src = the_sub_field('slider_bild', $taxonomy . '_' . $term_id);
$slider_images [] = $image_src;
endwhile;
// As slider images starts with the last image so we will reverse the images in the array so ordering the images in the admin section could be easier
$rv_slider_images = array_reverse($slider_images);
foreach ($rv_slider_images as $slider_image) {
?>
<img src='<?php echo $slider_image; ?>' alt='' />
<?php
}
?>
</section>
The result I get is this:
<img src="undefined" alt="" style="opacity: 0.775823;">
I really can't get this one right.
My $taxonomy and $term_id generates the correct values and the code for the slideshow works fine on the other pages so for some reason I can't get the values from the ACF. Why and how can I fix this?
look documentation for acf repeater here and try replace the_sub_field('slider_bild', $taxonomy . '_' . $term_id); to this get_sub_field('slider_bild', $taxonomy . '_' . $term_id);
Related
I created custom post type named Emails, and added a custom field using advanced custom fields plugin to one post inside the custom post type called email footer, the field is image field that is supposed to show at the bottom of each automatic email going out of the website.
the current code I'm using
function wpcf7ev_verify_email_address2( $wpcf7_form ){
$email_footer = '<html>
<body style="color:#000000;">
<div style="font-size:16px;font-weight:bold;margin-top:20px;">
Regards,
<br/>
$email_footer .= '<img src="http://mysite.col/footer_image.jpg" width="100%" alt=""/>
</div>';
$email_footer .='<div style="display:none;">'.generateRandomString().
'</div></body>
</html>
';
the code is working, it displays the image with this url at the bottom: http://mysite.col/footer_image.jpg
but I don't want hardcoded, I want to be able to modify it with the custom field I created
I looked at ACF documentation and found this, but I don't know how to use it to still show that exact field on custom post type I created:
<?php
$image = get_field('image');
if( !empty($image) ): ?>
<img src="<?php echo $image['url']; ?>" alt="<?php echo $image['alt']; ?>" />
<?php endif; ?>
The code you've outlined from the ACF documentation tells you how to get the image from an ACF field using Image (with type array).
If we were to implement this into your function, we'd have to reference the image from the page somewhere. Without knowing how you're calling this there are a couple of ways you could embed it.
The first way, we pass it through to the function called on the page, like so...
wpcf7ev_verify_email_address2(get_field('image'));
and then update your function like so...
function wpcf7ev_verify_email_address2($image, $wpcf7_form)
{
$email_footer = '<div style="font-size:16px;font-weight:bold;margin-top:20px;">Regards,<br/>';
// get the image from the passed in image function.
$email_footer .= '<img src="' . $image['url'] . '" width="100%" alt="' . $image['alt'] . '"/></div>';
$email_footer .='<div style="display:none;">' . generateRandomString() . '</div>';
}
Or, the second way, if you are calling the function to modify an action or something, you'd have to get the image from whichever page ID / options page it is assigned to in your ACVF settings. This would make your function look a little like this:
function wpcf7ev_verify_email_address2($wpcf7_form)
{
// get image acf field from page with id 1
$image = get_field('image', 1);
// or get image from acf field on options page
// $image = get_field('image', 'options');
$email_footer = '<div style="font-size:16px;font-weight:bold;margin-top:20px;">Regards,<br/>';
$email_footer .= '<img src="' . $image['url'] . '" width="100%" alt="' . $image['alt'] . '"/></div>';
$email_footer .='<div style="display:none;">' . generateRandomString() . '</div>';
}
All of the above is presuming that your function is working as intended, with you needing help grabbing the ACF field, and the image is uploaded. You can wrap your declarations of get_field in if statements if required.
How can i add to my code
<img src="<?php the_sub_field('img'); ?>" alt="????" />
Te "alt" value of the image in my media, form my wordpress.
Advanced Custom Fields gives you a choice of return values. Given your current code I'd guess you've gone with URL.
In order to display the ALT tag you'll need to choose object instead. ID could work too but it's adding an extra step.
After choosing the new return value replace your code with:
<?php if ( $image = get_sub_field( 'img' ) ) {
printf( '<img src="%s" alt="%s" />', $image['url'], $image['title'] );
} ?>
i am using dynamic featured image and adding multiple product images to a single custom post type name as products for a single product but and i am trying to get those images in my template but the array only return me only two sizes [thumb] [full] but i need medium as well below is my code
<?php
if( class_exists('Dynamic_Featured_Image') ) {
global $dynamic_featured_image;
$featured_images = $dynamic_featured_image->get_featured_images();
foreach($featured_images as $featured_image) {
?>
<img width="60" src="<?php echo $featured_image['full'];?>"/>
<?php }
}
?>
As you guys can see in the anchor tag $featured_image['medium'] this is how i want to echo this anchor tag but unfortunately it don't return me the medium size and i need help in getting the medium size as well. below is the array that i get where you can clearly see only [thumb] and [full]. please help
Array
(
[thumb] => http://www.example.com/wp-content/uploads/2014/07/product-1-120x90.jpg
[full] => http://www.example.com/wp-content/uploads/2014/07/product-1.jpg
[attachment_id] => 254
)
You need to get medium sized image by calling get_image_url function. Try this:
<?php
if( class_exists('Dynamic_Featured_Image') ) {
global $dynamic_featured_image;
$featured_images = $dynamic_featured_image->get_featured_images();
foreach($featured_images as $featured_image) {
$mediumSizedImage = $dynamic_featured_image->get_image_url($featured_image['attachment_id'], 'medium');
echo "<img src = '" . $mediumSizedImage . "' />";
?>
<img width="60" src="<?php echo $featured_image['full'];?>"/>
<?php }
}
?>
All available functions are documented here.
PS: I am author of the plugin.
I am working on a portfolio website. Whenever a portfolio piece is clicked, the user is taken to a page that shows details about that piece (i.e. more photos and information). There will also be previous and next navigation links to get to additional pieces. However, I want the previous and next navigation links to be a thumbnail photo of the next piece (custom field for that is thumbnail_photo). This is what I have so far:
<?php
$previous_post = get_previous_post();
$next_post = get_next_post();
$prev_value = get_post_meta( $previous_post->ID, 'materials', $single = true);
$next_value = get_post_meta( $next_post->ID, 'thumbnail_photo', $single = true);
?>
<p><?php echo $prev_value; ?></p>
<p><?php echo $next_value; ?></p>
I used 'materials' in the call for $prev_value since 'materials' is another custom field. I just wanted to see if it was actually working. It outputs the materials just fine, but it only outputs the ID number of the thumbnail_photo. I can't get it to reference the file name so that I can output the actual image.
I am using the Advanced Custom Fields plugin, so each image is stored as an image object. So this is how I would typically output a thumbnail image:
<?php
$image = get_field('thumbnail_photo);
echo $image[sizes]["thumbnail"]; // thumbnail is a reference to wordpress' thumbnail media size
?>
When you configure the ACF input field, be sure you set the return value to be an image object instead of the image ID after change this, or if you already changed, you have to update the post or posts you're trying to get. Because, if you set the field return value as image ID, created the posts and now you wanna change their values you have to modify all the posts because every post_meta is containing the ID of the image.
In the ACF website has a tutorial how you could get the values an turn into images:
With the ID
<?php
wp_get_attachment_image( $next_value, 'thumbnail' );
?>
Another Example With the ID, but this time you have to create the image HTML, the function returns an array with the url, width and height
<?php
$image = wp_get_attachment_image_src( $next_value, 'thumbnail' );
// url = $image[0];
// width = $image[1];
// height = $image[2];
?>
<img src="<?php echo $image[0]; ?>" />
You could do a check for the returned value and then write the image, example:
<?php
if( is_int( $next_value ) ) {
wp_get_attachment_image( $next_value, 'thumbnail');
} elseif ( is_object( $next_value ) ) {
echo $next_value['sizes']['thumbnail'];
} else { ?>
<img src="<?php the_field('field_name'); ?>" alt="" />
<?php } ?>
I didn't test it, but I think it works fine.
I hope this help and sorry for the bad english
this is what i would like to do...
In my site,each post can have several pictures, but also each post has an attached picture called: thumbnail {name of my post}, this specific picture was attached to the post with the multimedia gallery, and the objective of this picture is to appear in the category list.
<article>
<p class="the-picture"><img src="url-of-the-picture" /></a>
<p class="the-post-title">The post title</p>
<p class="the-post-excerpt">The post excerpt</p>
</article>
So basically that's what i want to do, Maybe using get_post() but i can't figure out how to do it from outside the post.
Thanks for your help
Consider using the defaul post thumbnails functions instead of naming the image after the post.
Add this to your functions.php
add_theme_support( 'post-thumbnails' );
Then on the editor you'll be able to select which image is the default "featured" image. To display the images on the loop you'll use either the_post_thumbnail() or get_the_post_thumbnail() like this:
<p class="the-picture"><?php the_post_thumbnail(); ?></p>
EDIT:
if you can't use the default thumbs functionalilty, maybe you can create another post field with add_meta_box(); and include it in every post save with update_post_meta();.
This way you'll have a permanent value on your DB to tell you which thumb to use on the cat list, and you'll be able to retrieve it with get_post_meta() on category.php like this:
<p class="the-picture"><?php echo get_post_meta($post->ID, $cat_picture, true); ?></p>
Ok... here is what I found so far:
The following code will get me the category i'm on:
global $wp_query;
global $wpdb;
$cat = get_category( get_query_var( 'cat' ) );
So, now with the category i can list all the posts:
$posts = get_posts( array( 'category' => $_GET[ 'cat' ] ) );
And for each post i can do this:
$attachment_id = $wpdb->get_var('
SELECT ID
FROM ' . $wpdb->posts . '
WHERE post_parent = "' . $record->ID . '" AND post_status = "inherit" AND post_type="attachment" AND post_title LIKE "thumb%"
ORDER BY post_date DESC
LIMIT 1');
$thumb = wp_get_attachment_image_src( $attachment_id, array( 90, 117 ) );
$the_icon = '<img src="' . $thumb[0] . '" width="' . $thumb[1] . '" height="' . $thumb[2] . '" />';
So, basically what i'm doing is looking for the ID of the child post which is marked as the thumbnail of the post and retrieving its information into $thumb. The answer that moraleida gave me was a nice start for my research. Thanks a lot.