I'm trying to get an image asset shown on the front-end using the wp_get_attachment_image WordPress function, but it doesn't seem to work with my options page on ACF.
Here is my code:
<?php
$image = get_field('logo', 'option');
$size = 'full'; // (thumbnail, medium, large, full or custom size)
if( $image ) {
echo wp_get_attachment_image( $image, $size );
}
?>
Which looks like this on the back-end:
The picture you see above is an options page in ACF and when I try to query that image into the wp_get_attachment_image function, it doesn't work. However, when I run this code:
<img data-src="<?php the_field('logo', 'option'); ?>" alt="footer logo" class="lazyload" />
which is within an image tag, it works just fine.
I copied and pasted what was shows on the ACF docs located here (Basic Display ID), but it's not showing the image on the front-end.
Anything I'm missing guys?
Thanks a lot!
Return value in field should be Image ID. See Screenshot
What is the return value type you used? Image Array, Image URL, Image ID
And you need to get a field like this:
get_field('logo'); why do you add option?
More info here:
https://www.advancedcustomfields.com/resources/image/
wp_get_attachment_image requires the first parameter to be an image ID. In your case, if you are seeing the image using the code <img data-src="<?php the_field('logo', 'option'); ?>" alt="footer logo" class="lazyload" /> then get_field('logo', 'option') is returning the url of the image.. not the ID which is what you need if you are using wp_get_attachment_image.
What you need to do is change the Return Value of your logo field to Image ID.
Then you might have to re upload the image.
And also change this code <img data-src="<?php the_field('logo', 'option'); ?>" alt="footer logo" class="lazyload" /> to <img data-src="<?php echo wp_get_attachment_url(get_field('logo', 'option')); ?>" alt="footer logo" class="lazyload" />
ACf plugin returns value as you have set the return type.
If you have sent the return type as Image array then :
$image[0] -> full or $image[0][$full] or $image[$full] depending on the number of image uploaded.
If you have set return type as Image url:
<img src="<?php $image; ?>"> would do the work.
If you are setting return type as Image Id:
$img2 = wp_get_attachment_image_src(get_post_thumbnail_id($image),
$full); echo $img2[0];
I guess above methods will surely help you out.
Thanks
Related
So my code is pretty straightforward. I am just getting a field value from the global fields (Options). So this field is on Dashboard -> Options (I have ACFpro) and I am trying to echo out a logo which is an image array.
This is how my code looks like
<ul class="text-white p-0">
<a class="brand " href="/">
<?php
$image = get_field('logo');
echo '<p id="debug">'.($image ['url']).'</p>';
?>
</a>
</ul>
al i am trying to do is pull the url value and insert it to a <p> tag just to make sure it pulls the right value. but instead I am getting this error.
error when trying to echo $image
Any idea on what am I doing wrong?
It is one of two things. You need to add the ID or options to the get_field() as a parameter or you need to adjust the return format. By default it tries to pull the ID of the page get_field() is on.
I would change it to
get_field( 'logo', 'options' );
Or change options to whatever you called your options page.
https://www.advancedcustomfields.com/add-ons/options-page/
I have beginner with ACF and WordPress as developer.
So, I want to select which title post has to be displayed in div from WordPress panel. I have got some ACF file called "hot_news" which is post object. Returned content is post object, not ID.
I have got also "Show if post is equal to (some post title)".
This is my code:
<div class="bp1-col-1-1 news-line">
<a class="button button-hot-news" href="#">Aktualności</a>
<img class="hot-icon hot-icon-left" src="<?php echo get_bloginfo('template_url') ?>/images/warning-icon.png" alt="Hot news!">
<div class="morquee-efect">
<a class="hot-news-title" href="#"><?php the_field('hot_news'); ?></a>
</div>
<img class="hot-icon hot-icon-right" src="<?php echo get_bloginfo('template_url') ?>/images/warning-icon.png" alt="Hot news!">
</div>
When I make it is displayed, but does not display post title. What is wrong?
to retrieve a field from ACF you should use get_field so
<?php echo get_field('hot_news'); ?>
prints the current post custom field named "hot_news".
If you want you can specify a post ID :
<?php echo get_field('hot_news'[,post_ID]); ?>
You said in your question that hot_news is a post object. Therefore, if you try to echo an object, you're not going to get what you want.
Instead, you'll have to do something like:
<div class="bp1-col-1-1 news-line">
<a class="button button-hot-news" href="#">Aktualności</a>
<img class="hot-icon hot-icon-left" src="<?php echo get_bloginfo('template_url') ?>/images/warning-icon.png" alt="Hot news!">
<div class="morquee-efect">
<a class="hot-news-title" href="#"><?php
$hotnews = get_field('hot_news');
if($hotnews) echo $hotnews->post_title;
?></a>
</div>
<img class="hot-icon hot-icon-right" src="<?php echo get_bloginfo('template_url') ?>/images/warning-icon.png" alt="Hot news!">
</div>
You can get more info on how to work with an ACF post object here: https://www.advancedcustomfields.com/resources/post-object/
My method should work if you just need the simple post title, but if you start needing permalinks to the post and stuff like that, it may make sense to use the setup_postdata($post) code that the ACF docs use.
I have two code blogs
I want it to look like this:
How should the code blog be
Missing alt text
And width height value
remove url and wordpress url
Sample:
<img class="alignnone" title="Women" src="https://3.bp.blogspot.com/-cR_7KLccvBM/WJ7h-yanzRI/AAAAAAAA6ps/hIk6C6Ha0eQzwIUaFpgYEkA6sY1bheTnwCLcB/s1600/women.jpg" alt="beatiful women" width="650" height="350"
<meta itemprop="url" content="<?php if (function_exists('catch_that_image')) {echo catch_that_image(); }?>" />
If you want to display your image like the sample then wordpress has two function to use:
If you are wanting to get outside the loop then,
wp_get_attachment_image(get_post_thumbnail_id( $post->ID), 'thumbnail');
inside the loop
if ( has_post_thumbnail( 'thumbnail' ) ) {
the_post_thumbnail();
}
This will directly create as you sample code. Hope this will work for you
Thank You
I apologize if this is answered elsewhere, but I'm having an issue with this ACF code here: http://goo.gl/9onrFN I want the client to be able to add a portfolio site link (if applicable) to the artist page and the link would say "View Artist's Website" and the link would take the user to the artist's site in a new window. How would I go about not making this text not visible, unless there was a url entered into the custom field on the post? Here's the code:
<p><?php the_field('contact_phone_number'); ?><br />
or <?php the_field('contact_email'); ?><br />
View Artist's Website</p>
Thanks in advance!
You can check if a ACF field is set with:
if(get_field('artist_website')) {
the_field('artist_website');
}
Using the_field will simple echo the contents of your field, whereas get_field will return the value which is a lot more helpful. For example you could write the above code as:
Note: get_field simple returns the value of the field, if you want to check if a valid url has been entered you will have to use a regular expression.
Below is your code with an if statement performing an empty field check:
<p>
<?php the_field('contact_phone_number'); ?><br />
or <?php the_field('contact_email'); ?>
<?php if(get_field('artist_website')) { ?>
<br />View Artist's Website
You may find your code easier to read by pre-setting your variables and including HTML in the echo:
<p>
<?php
$contact_phone_number = get_field('contact_phone_number');
$contact_email = get_field('contact_email');
$artist_website = get_field('artist_website');
echo "{$contact_phone_number}<br />";
echo "or <a href='mailto:{$contact_email}'>{$contact_email}</a><br/ >;
if($artist_website) {
echo "View <a href='{$artist_website}' target='_blank'>Artist's website</a>";
}
?>
</p>
I am building a simple WP theme, but now I am stuck. I need to add an image on a fixed place for post_template A and 2 images on post_template B
Like so:
title
img
date
content
title
img img
date
content
Is it possible to make a template and on the admin side have the corresponding # of upload fields?
You can do that with custom fields...
In the edit page view add a custom field called "img1" for instance and the value should be the image url.
Then in your template A file you can output the image with:
<?php
$myimage = get_post_meta($post->ID, 'img1', true);
if ($myimage) { ?>
<img src="<?php echo $myimage; ?>" />
<?php } ?>
And in template B you just do that 2 times ;)