I have alt and title tags that contain data from a table that are appended with the base_url that I would like to remove. When I do so the alt tags show up empty. Currently the is what the code is:
<img title="<?php print_r(base_url().
$promo5['data'][0]->CarouselImageTitleAtribute);?>"
alt = "<?php print_r(base_url().$promo5['data']
[0]->CarouselImageAltAtribute);?>'/.
The result is this:
<img title="https://www.example.com/Click here to read about
our custom products"
alt = "https://www.example.com/Custom colored products"/>
I need to remove the https://www.example.com/ and only keep the value in the table (CarouselImageAltAtribute) I have tried using
<?php echo $promo5->CarouselImageAltAtribute; ?>
With no luck.
Remove base_url() code from alt="" and title="" like below:-
<img title = "<?php echo $promo5['data'][0]->CarouselImageTitleAtribute;?>"
alt = "<?php echo $promo5['data'][0]->CarouselImageAltAtribute;?>"/>
Related
My code is below. I wanna add to link my website icon to the main page but its seems like it doesn't work.
$output .= " <img id='svg_logo' href='https://example.com/' src='https://example.com/path/' /> ";
Because an <img> element has no href attribute. You can't make something a "link" just by adding an href to it.
The <img> is the content of your "link", and the link itself is a standard <a> element:
<a href="https://example.com/">
<img id="svg_logo" src="https://example.com/path/" />
</a>
My end goal is to create a gallery of Images that when clicked link to an external website. This needs to be done through Advanced Custom Fields, so I made a repeater that has the image and link in the same row:
link1 | cover_image1
link2 | cover_image2
Right now I'm inserting this code into a text editor inside my webpage. I also imported some short-code from here, that allows me to use %ROW% as an iterator.
"attachments" is the parent repeater and "link" and "cover_image" are the children.
[acf_repeater field="attachments"]
external url = [acf field ='attachments_%ROW%_link']
image url = [acf field ='attachments_%ROW%_cover_image']
<a href =[acf field ='attachments_%ROW%_link'] >
<img src = [acf field ='attachments_%ROW%_cover_image'] width="300" height="214" />
</a>
[/acf_repeater]
The webpage renders this:
Where the broken image contains this code:
<img src="[acf" field="attachments_0_cover_image" ]="" width="300" height="214">
I think [acf field ='attachments_%ROW%_cover_image'] in <img> isn't resolving all the way to the url, as external url = and image url = both render the correct urls.
Wordpress also converts my code to this after saving, so its probably a syntax error?
[acf_repeater field="attachments"]
external url = [acf field = attachments_%ROW%_link]
image url = [acf field = attachments_%ROW%_cover_image]
<a href="[acf">
<img src="[acf" width="300" height="214" />
</a>
[/acf_repeater]
I'm not sure how to properly convert [acf field ='attachments_%ROW%_cover_image'] to a url in the <img> and I could use some help on the proper syntax. Thank you so much for you help!
html for the attribute per Arian:
<div class="fl-module fl-module-rich-text fl-node-5d4926759d7aa"
data-node="5d4926759d7aa">
<div class="fl-module-content fl-node-content">
<div class="fl-rich-text">
<p>Agenda: https://hips.hearstapps.com/hmg-prod.s3.amazonaws.com/images/cute-cat-photos-1593441022.jpg?crop=0.669xw:1.00xh;0.166xw,0&resize=640:*</p>
<p>Video Links: </p>
<p>Thumbnails: </p>
<p></p>
<p>external url = https://www.youtube.com/watch?v=uHKfrz65KSU<br>
image url = http://wordpress.local/wp-content/uploads/Thumbnail_1.png</p>
<p><a href="[acf" field="attachments_0_link" ]=""><br>
<img src="[acf" field="attachments_0_cover_image" ]="" width="300" height="214"><br>
</a></p>
<p><br></p>
<p>external url = https://www.youtube.com/watch?v=X2lIovmNsUY<br>
image url = http://wordpress.local/wp-content/uploads/Thumbnail_2-1.png</p>
<p><a href="[acf" field="attachments_1_link" ]=""><br>
<img src="[acf" field="attachments_1_cover_image" ]="" width="300" height="214"><br>
</a></p>
<p><br></p>
<p>external url = https://www.youtube.com/watch?v=hDJkFLnmFHU<br>
image url = http://wordpress.local/wp-content/uploads/Thumbnail_3-1.png</p>
<p><a href="[acf" field="attachments_2_link" ]=""><br>
<img src="[acf" field="attachments_2_cover_image" ]="" width="300" height="214"><br>
</a></p>
<p><br></p>
</div>
</div>
</div>
Not a wordpress guy, but seems like wordpress prevents expanding/executing shortcodes with parameters within html attributes, maybe this could work as workaround if you can put php code there:
<?php
$link = do_shortcode("[acf field ='attachments_%ROW%_link']");
$cover_img = do_shortcode("[acf field ='attachments_%ROW%_cover_image']");
?>
<a href="<?= $link ?>">
<img src="<?= $cover_img ?>" width="300" height="214" />
</a>
Actually i found comment on this:
It appears it's using the same quotes for the HTML attribute and the shortcode's attributes that create problems.
at here
so this may work too:
<a href="[acf field ='attachments_%ROW%_link']">
<img src="[acf field ='attachments_%ROW%_cover_image']" width="300" height="214" />
</a>
or without shortcode quotes:
<a href="[acf field=attachments_%ROW%_link]">
<img src="[acf field=attachments_%ROW%_cover_image]" width="300" height="214" />
</a>
last option i can think of is creating parameter-less shortcodes like this:
function acflink_shortcode() {
return do_shortcode("[acf field ='attachments_%ROW%_link']");
}
add_shortcode('acflink', 'acflink_shortcode');
function acfimage_shortcode() {
return do_shortcode("[acf field ='attachments_%ROW%_cover_image']");
}
add_shortcode('acfimage', 'acfimage_shortcode');
then using in editor like:
<a href="[acflink]">
<img src="[acfimage]" width="300" height="214" />
</a>
I'd like to pass the current img src to a function I'm working on (to get more data from a database)
Is there a simple way to grab the src from within the img tag?
I'd like to do this:
<img src="http://example.com/images/1.jpg" alt="amazing image" data="<?php echo( get_extra_data($img_src) ); ?>" />
Rather than this:
<img src="http://example.com/images/1.jpg" alt="amazing image" data="<?php echo( get_extra_data("http://example.com/images/1.jpg") ); ?>" />
I'd like to dynamically get the src from the current img rather than having to have the url twice if that makes sense.
In other words, could the function get_extra_data() reference the img element it was called from?
This is because I'd like to just paste data="<?php echo( get_extra_data($img_src) ); ?>" into the exsisting image elements I need it on.
I have this code:
<img src="'. $random_pics[$i] .'" width="'.$thumb_width.'" alt="" name="?album='. urlencode($albums[$i]) .'" class="alb" />
<div id="pictures"></div>
<script>
$('.alb').click(function(){
var href = $(this).attr('name');
$("#pictures").load('display.php'+href)
});
</script>
Then I have a display.php file, where I use $_GET['album'] to get the album name and display the photos from that album.
How it should work: when I click the image, the pictures div should load the display.php?album=somealbum, but for some reason it does not... My files are bigger, but I think the problem is here.
It looks like you missed the php tags around each of those embedded php codes. Or perhaps there should be more to the snippet you provided?
<img src="<?php echo $random_pics[$i]; ?>"
width="<?php echo $thumb_width; ?>"
alt=""
name="?album=<?php echo urlencode($albums[$i]); ?>"
class="alb" />
how to insert this javascript code :
thejavascript
inside img src in php
<img src="http:'.$iv[$j].'.jpg" height="220" width="200" alt="Image '.ucwords($kw).'" "thejavascript">
Thanks
You can use this jQuery script to add and onClick event in your balise img but you must adding an attribute id into your image. An id must be unique in your html page.
$("img#idImage").click(function({
window.open('welcome.html','welcome');
}));
$kw = $ucwords($kw);
"<img id='idImage' src='http:{$iv[$j]}.jpg' height='220' width='200' alt='Image {$kw}' />";
But the best will be to separate attributes height and width into a CSS stylesheet.
Insert the following HTML outside PHP brackets and it should work according to the way you posted it. I'm making a few assumptions, one being that the link you posted wraps the image code and that the PHP variables turn the image into valid code.
<a href="javascript:void(0);" onclick="window.open('welcome.html','welcome')">
<img src="http:<?=$iv[$j]; ?>.jpg" height="220" width="200" alt="Image <?=ucwords($kw); ?>">
</a>
More simple, replace "thejavascript" (with the "") by :
onclick="window.open(\'welcome.html\',\'welcome\')"
A bit different approach, onclick event is on img tag.
$javascript="window.open('welcome.html','welcome')";
$img='<img src="http:'.$iv[$j].'.jpg" height="220" width="200" onclick="'.$javascript.'">';
echo $img;