Trying to use a great plugin "Fly Dynamic Image Resizer" to return images from ACF but not having much luck. Can anyone provide any clue as to what I may be doing wrong? Thanks.
ACF variables:
<?php
$photo = get_field('photo', $post);
$fly_image = fly_get_attachment_image_src($photo, 'big_featured_works', true);
?>
HTML:
<img src="<?php echo $fly_image['src']; ?>"/>
$fly_image = fly_get_attachment_image_src(get_field('photo', $post), 'big_featured_works', true);
<img src="<?php echo $fly_image['src']; ?>"/>
then switch the return value of the custom field to image ID (from default "Image Array")
If your field is a repeater field you'll have to use get_sub_field, like this:
$image = get_sub_field('image');
fly_get_attachment_image_src($image, 'image-custom-size')['src'];
$image = fly_get_attachment_image_src( get_post_thumbnail_id(), 'home_page_square', array( 500, 500 ), true );
echo '<img src="' . $image['src'] . '" width="' . $image['width'] . '" height="' . $image['height'] . '" />';
(Reference)
Related
Wordpress automatically adds srcset and sizes attributes to all images coming from posts. That’s very neat.
But how to I get WordPress to add those attributes to images that come from a customizer input?
In my case: a default image for posts. That default image is displayed when no image was uploaded in a post. It’s uploaded by the user through the customizer and called using get_theme_mod.
image from post (works fine, all attributes are added):
get_the_post_thumbnail($post->ID, 'news', array('class' => 'img-responsive'));
if no image is provided: the default image is loaded (no ’scrset’ and ’sizes’)
'<img src="' . esc_url( get_theme_mod( 'default_image' ) ) . '" alt="default image" class="img-responsive" />'
wp_image_add_srcset_and_sizes() seems to be the way to go but it requires attributes I don’t know where to get.
Thank you for your help!
this function does the trick:
function create_responsive_image( $img ) {
$img_id = attachment_url_to_postid( $img );
$img_srcset = wp_get_attachment_image_srcset( $img_id );
$img_sizes = wp_get_attachment_image_sizes( $img_id );
return '<img src="' . $img . '" srcset="' . esc_attr( $img_srcset ) . '" sizes="' . esc_attr( $img_sizes ) . '">';
}
What I want to do is have images display on each blogposts, the images that will be displayed will be what the post was tagged with, for example I will tag 1 post with 2 tags, design and print, I would like 2 small images to appear on that posts page.
This is the code that I have managed to scrape together, the else statement is displaying so a post will have the same amount of default-author.jpg showing as there are tags.
This makes me think that something in the foreach is not working but I'm still trying to learn and this is puzzling me, any help would be much appreciated.
<div class="image_wrap">
<?php
$posttags = get_the_tags(); // Get articles tags
$home = get_bloginfo('url'); // Get homepage URL
// Check if tag-slug.png exists and display it.
if ($posttags) {
foreach($posttags as $tag) {
$upload_dir = wp_upload_dir();
$image_relative_path = "/wp-content/uploads/2017/06/" . $tag->slug .".png";
$image_path = $upload_dir['basedir'] . $image_relative_path;
$image_url = $upload_dir['baseurl'] . $image_relative_path;
if (file_exists($image_path)) {
echo '<a href="' . $home . '/' . $tag->slug . '" /><img title="' . $tag->name . '" alt="' . $tag->name . '" src="' . $image_url . '" /></a>';
// If no image found, output something else.
} else { ?>
<img src="<?php bloginfo('template_directory'); ?>/img/default-author.jpg" title="image missing"/>
<?php }
}
}
?>
Does anyone have any ideas on how I can achieve the effect I want, images to be displayed on a blogpost [in wordpress] depending on what tag it has?
I'm trying to remove the "img src" tag from the php so it'll simply display the images url, rather than displaying the actual image. This is the code I've got so far and it works perfectly, but when it's rendered it shows thumbnails instead of urls.
<?php $pics = get_post_meta( $post->ID, 'pics', true );
foreach( $pics as $pics)
{
$image_attributes = wp_get_attachment_image_src( $pics['pictures'] );
echo '<img src="' . $image_attributes[0] . '" />';
}
?>
I know theres a way to do this, but I don't know how to remove the tags without breaking the image code. Any help is appreciated.
If you just want to echo the image src and not display it as an image then change
echo '<img src="' . $image_attributes[0] . '" />';
to
echo $image_attributes[0];
<?php
$pics = get_post_meta( $post->ID, 'pics', true );
foreach( $pics as $pics)
{
$image_attributes = wp_get_attachment_image_src( $pics['pictures'] );
echo $image_attributes[0];
}
?>
So do you want to show on the page the "html code" with the tag and the src attribute?
Have you tried to enclose "img" tag within "pre" tag?
echo '<pre><img src="' . $image_attributes[0] . '" /></pre>';
I'm using Wordpress and the PODS plugin and created the pod project. In project i've created a set of fields. One of those is project_slide. If this field has a value, I want to show this in a RoyalSlider on my frontpage.
I've started with this piece of code (= one slide).
<?php
$project = pods('project', array('limit' => -1));
while ($project->fetch()) {
echo '<div class="rsContent">';
echo '<img class="rsImg" src="' . $project->display('project_slide') . '" alt="' . $project->display('project_title') . '">';
echo '</div>';
}
?>
The problem is: each project I add, displays in the slider. Even if project_slide has no value. Any idea how to resolve this?
Just add an if-statement to the loop.
Hide Image example
In my example, I only add the slide when the value isn't [empty string]
while ($project->fetch()) {
if( $project->display('project_slide') !== ""){
echo '<div class="rsContent">';
echo '<img class="rsImg" src="' . $project->display('project_slide') . '" alt="' .$project->display('project_title') . '">';
echo '</div>';
}
}
Expand with a detection if the image actually exists
You could expand it with a file_exists to also check if it exists (for the items with value, but the image itself doesnt exists). Just make sure the file_exists is 2nd, that way it only checks if the file is present if the string is not empty (if-statements go from left to right)
$project->display('project_slide') !== "" && file_exists($_SERVER['DOCUMENT_ROOT'].$project->display('project_slide')`
Default image method:
Instead of showing it only when there is an image, you could always show it, but build a default-image logic:
$defaultImage = '/some/image.jpg'; // set a default image outside of the loop
while ($project->fetch()) {
$src= $project->display('project_slide') !== "" ? $project->display('project_slide') : $defaultImage; // set a default umage
echo '<div class="rsContent">';
echo '<img class="rsImg" src="' . $src . '" alt="' .$project->display('project_title') . '">';
echo '</div>';
}
I have selected a row from the database, within the row is a field called image. This is a blob datatype which contains an image within the database but when i try to display the image via php it displays the text version of the image not the actual image.
<?php
// No direct access to this file
defined('_JEXEC') or die('Restricted access');
$player = $this->player;
$name = $player->forename . " " . $player->surname;
$handed = $player->handed;
$image = $player->image;
?>
<div class="thumbnail"><?php echo '<img src="' . $image . '" alt="' . $name . '" />'?></div>
It is probably an easy fix and i did look at trying:
$mime = "image/jpeg";
$b64Src = "data:".$mime.";base64," . base64_encode($image["img"]);
echo '<img src="'.$b64Src.'" alt="" />';
?>
but that only outputed:
<img src="data:image/jpeg;base64,/w==" alt="">
Any help is much appreciated, thankyou in advance