How can I make h:graphicImage a link to http://www.google.com?
<h:graphicImage value="/imagenes/Powertrain_GM.gif" width="50" />
I tried to put it like this:
<a href="http://www.google.com">
<h:graphicImage value="/imagenes/Powertrain_GM.gif" width="50" />
</a>
But does not work...
Also tried:
<a href="http://www.google.com">
<img src="/imagenes/Powertrain_GM.gif">
</a>
But nothing... Everything is inside <h:form>...</h:form>
Help please.
I have no idea why it works know. I used the second code. Any ideas of this strange problem? I did not changed anything and know works...
Related
<p style="text-align: center">
<img class="alignnone size-full wp-image-759 aligncenter" /><img
src="https://steamboateramuseum.org/wp-content/uploads/2021/01/ViFLverttransparent.gif"
/>
</p>
This is what I have now, I have been asked to link it but every time I add my <a tag and url to hyperlink it just doesn't work! Where would I fit a hyperlink into this? I am sorry for the stupid question in advance.
Okay so based on your comments I think I have understood your problem. Do following ->
<p style="text-align: center;">
<a href="here goes your link e.g. https://google.com">
<img src="i.imgur.com/I5DFV.jpg" />
</a>
</p>
Depending on your usecase you might have to update style to show it in better way, but this will work functionally
Although you question wasn't clear, but what i understood is your hyperlink containing an image is not working. Maybe you're missing Something in your quotes? anyway here is an example of a working hyperlink with an image.
<img src="images/someimage.jpg" title="Image hyper link" width="300" height="200" />
so my question is how do I add the opening and closing tag separately using jQuery.
For eg.
<a class="test" href="#">
<img src="https://images.unsplash.com/photo-1611165243857-d8b0ff81ba63?ixid=MXwxMjA3fDB8MHx0b3BpYy1mZWVkfDIwfDZzTVZqVExTa2VRfHxlbnwwfHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60"/>
</a>
I want add a figure tag to wrap the image. So the outcome will be like below. Currently when i use the
jQuery('img').before('<figure>');
jQuery('img').after('</figure>');
it don't seems to work. Please advise. Thanks.
<a class="test" href="#">
<figure>
<img src="https://images.unsplash.com/photo-1611165243857-d8b0ff81ba63?ixid=MXwxMjA3fDB8MHx0b3BpYy1mZWVkfDIwfDZzTVZqVExTa2VRfHxlbnwwfHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60"/>
</figure>
</a>
You're looking for .wrap().
jQuery('img').wrap('<figure></figure>');
Link for more info if you want: https://api.jquery.com/wrap/
kindly check the below code.
$( "img").wrap( "<figure></figure>");
I am having a problem referencing an image I have on a server in my temp folder. I have the following:
<a href="#" title="Hello">
<img width="220" height="255" src="file://myServerName/c$/temp/myImage.jpeg" class="attachment-hp-thumb wp-post-image" alt="Hello" />
</a>
This is currently giving me a blank screen, no errors. Can someone please give me some pointers on what I am doing wrong?
I located social icons in my text widget located in the header. It works in IE but not in Chrome or Firefox?? I am wondering if it has to do with my Artisteer 4 theme I am using, but I have looked at all the CSS and code and don't see what is interfering. My site is http://www.visualtechnologyconsulting.com
and the code in the text widget is:
<a href="http://www.facebook.com/visualtechnologyconsulting/">
<img class="alignnone size-full wp-image-372" alt="Visual Technology Consulting
Facebook" src="http://www.visualtechnologyconsulting.com/wp-
content/uploads/2013/01/facebook-logo-webtreats.png" width="75" height="75" />
</a>
<a href="http://www.linkedin.com/company/visual-technology-consulting/">
<img src="http://www.visualtechnologyconsulting.com/
wp-content/uploads/2013/01/linkedin-logo-webtreats.png"
alt="Visual Technology Consulting Linkedin" width="75" height="75"
class="alignnone size-full wp-image-373" />
</a>
I can see them in Chrome. Everything looks fine.
But maybe you post the CSS Part?
Nate, its working for me in Chrome and firefox. See here. Have you refreshed your browsers cache?
I found it!! it was a CSS issue I was covering the icons with the header div, needed to reduce it to 40%!!!
Thanks everyone!
Goal: I want to add a "pin it" button (alongside the facebook and twitter buttons) at the bottom of each post on my tumblr.
Main Problem: Simply pasting the code provided at http://pinterest.com/about/goodies/ for adding a pin it button into tumblr's custom HTML editor does not work. I pasted the following code at the end of the {block:Posts} block:
<a href="http://pinterest.com/pin/create/button/" class="pin-it-button"
count-layout="horizontal">
<img border="0" src="//assets.pinterest.com/images/PinExt.png" title="Pin It" />
</a>
<script type="text/javascript" src="//assets.pinterest.com/js/pinit.js"></script>
This results in a "pin it" button in the correct place in each post, but clicking on it does nothing. The HTML generated by tumblr is changed, and looks as follows:
<a style="cursor:pointer" title="http://pinterest.com/pin/create/button/" class="pin-it-button" count-layout="horizontal">
<img border="0" src="//assets.pinterest.com/images/PinExt.png" title="Pin It"></a>
<script type="text/javascript" src="//assets.pinterest.com/js/pinit.js"></script>
There is no href attribute in the anchor tag generated by Tumblr. This seems like a problem. Anyone know how to get Tumblr to do this correctly?
Another Problem (Possibly as important): The code provided by pinterest doesn't specify an image to pin. I want the button to pin the image in the post. From reading online I've gotten ideas to include the url and media parameters in the href attribute. For Example:
<a href="http://pinterest.com/pin/create/button/?url={Permalink}&media={PhotoURL-500}" class="pin-it-button" count-layout="horizontal">
<img border="0" src="//assets.pinterest.com/images/PinExt.png" title="Pin It" />
</a>
Again, nothing happens when I click the resulting pin it button - so I don't know if these parameters are necessary - only that they don't fix my first problem.
Any help is greatly appreciated.
Cheers,
- David
Try encoding the variables in using URLEncodedPermalink - this worked for me:
{block:Posts}
{block:Photo}
<a href="http://pinterest.com/pin/create/button/?url={URLEncodedPermalink}&media={URLEncodedPhotoURL-500}" class="pin-it-button" count-layout="horizontal">
<img border="0" src="//assets.pinterest.com/images/PinExt.png" title="Pin It" />
</a>
{/block:Photo}
{/block:Posts}
Thanks for the suggestions. Here's what ended up working for me.
Followed the instructions at http://tumblring.net/how-to-add-a-pinterest-button-to-tumblr/
with the following differences:
Used the following HTML embed code right before the {/block:Posts} closing tag:
<a href="http://pinterest.com/pin/create/button/?url={Permalink}&media={PhotoURL-500}"
class="pin-it-button" count-layout="horizontal">
<img border="0" src="//assets.pinterest.com/images/PinExt.png" title="Pin It" />
</a>
Did NOT include the following javascript snipped along with the html embed:
<script type="text/javascript" src="http://assets.pinterest.com/js/pinit.js"></script>
Your code should be inside the Posts Block and Post type Block as well. For example if you are adding a pinit button into a photo post it would be the following:
{block:Posts}
{block:Photo}
<a href="http://pinterest.com/pin/create/button/?url={Permalink}&media={PhotoURL-500}" class="pin-it-button" count-layout="horizontal">
<img border="0" src="//assets.pinterest.com/images/PinExt.png" title="Pin It" />
</a>
{/block:Photo}
{/block:Posts}