Need help? Check out our Support site, then


WordPress.com Forums » Widgets

buttons

  1. belle80
    Member

    I'm sorry to return to the subject of buttons and widgets again, but I have been over faq and forum topics many times without much luck....

    I want to add buttons (for instance a wordpress button) to my side bar. I have pasted the following into a text widget, but nothing shows:

    <img src=”http://faq.files.wordpress.com/2006/05/wp-button-6.gif” title=”WordPress!” alt=”WordPress link” />

    furthermore I would like to add 'fave this blog technorati' links and other badges. When I add the following to a text widget, only a text shows in my side bar. Can you tell me step by step how to make this a button instead? Do I upload the 'images' from somewhere (where?), and how do I write this into the text widget?

    <script src="http://widgets.technorati.com/t.js" type="text/javascript"> </script>
    View blog top tags

    Thanks very much in advance
    http://www.belle80.wordpress.com

  2. raincoaster
    Member

    All Javascript is stripped out of WordPress.com, including in sidebar widgets. You can add the plain image/link HTML from Technorati, but not any of the javascript widgets. If you see the word "javascript" in the code, it's a total no-go under any circumstances. They have the code for the plain HTML buttons on their site under Buttons, and I believe you can hotlink their images without problem. I'm using the "Favorite This" one myself.

    One trick for making up text widgets that I use is to put them together in the Write Post box, as if they were a post, fiddling with formatting and making sure everything works like it should. When it's done, I click over to the Code view using the tab, copy the code, delete the draft I was working in, and paste all of the code into a text widget. That generally works well (although cautious souls would save the draft until the widget was up and running, just to be safe).

  3. belle80
    Member

    Thankyou for your reply, I'll play around with this for a while. I'm still looking for the plain HTML buttons on technorati however...
    is it under here somewhere ? http://www.technorati.com/widgets/blogwidgets

  4. raincoaster
    Member

    Nope, we can't use any Technorati widgets I don't think. They used to have a page with plain old-fashioned HTML buttons, but since their redesign I can't seem to find it. The Buttons page only shows browser buttons, and all the widgets on the page you posted are javascript. I'd suggest you contact someone whose WP.com blog you find the widgets on and ask them how they did it.

  5. belle80
    Member

    thats a pity, but thankyou i'm a little wiser now. Just added a pixie weather to my side bar that I saw on your site!

  6. raincoaster
    Member

    Glad you liked it. I have the Favorite this button from Technorati, but I honestly don't think it works. You can hotlink the image, though, if you can figure out how to get it working.

    The weather thing is fun, and I'm surprised it actually works, given that it seems to be dynamic. Normally all that stuff is stripped out of WordPress.

  7. belle80
    Member

    I'm still having problems creating a wordpress button through the text widget....even when I try to play around with the code under 'write a post'
    I have used the usage suggested on faq here:

    <img src=”-choose from above-” title=”WordPress!” alt=”WordPress link” />

    then I replace -choose from above- with one of the suggested buttons such as
    http://faq.files.wordpress.com/2006/05/wp-button-1.png

    however only the word ('wordpress') comes up in the side bar....not the button.
    Is there some part of the code I am missing here?

  8. raincoaster
    Member

    Hard to tell the way you've posted the code. Post the whole thing that you're pasting in the widget, but put it between backticks, those little almost-singlequotations that are at the top left-hand key on the standard keyboard. It's on the same key as the tilda, this: ~ Type a backtick, paste the code, then type another backtick and hit Publish. That will preserve everything.

  9. sulz
    Member

    bello80: the code doesn't work because i think the title shouldn't be there. try this.

    <img src="http://faq.files.wordpress.com/2006/05/wp-button-1.png" alt="1" />

  10. belle80
    Member

    thanks, found the quotation mark key now...

    I'll try showing what I'm trying to post now...

    <img src=”http://faq.files.wordpress.com/2006/05/wp-button-7.gif” title=”WordPress!” alt=”WordPress link” />

  11. belle80
    Member

    magnificent, that just worked!

  12. raincoaster
    Member

    No, quotation marks aren't it. Backticks are different, although they look similar. Posting code between backticks makes it look like this:
    <img src=”http://faq.files.wordpress.com/2006/05/wp-button-7.gif” title=”WordPress!” alt=”WordPress link” />

    now watch is mess up and make a fool of me. Okay, it didn't.

    All I can think is, A) maybe the image is down on their end? Put everything from HTTP to .gif inclusive into your browser bar and make sure the image comes up. And instead of "Wordpress link" you need to put the actual URL you're linking to in there, I believe.

    The simplest way to use a button with a link is to put the link in your blogroll and add the image in Add Link, in the part below where you put the link information. But the image must have a web address that functions: if it doesn't, copy it and upload it yourself and get the URL from your own account. This only works if you put the link into your regular blogroll. If you want it in a text widget, I think you're screwed.

  13. belle80
    Member

    may I ask another question...?
    are you able to tell me how to write the code so that it actually links to http://www.wordpress.com?

  14. belle80
    Member

    just to clarify what I mean, posting the following successfully brings out the button

    "<img src="http://faq.files.wordpress.com/2006/05/wp-button-1.png" alt="1" />"

    however the button doesn't link to word press here.

    Thanks for all the advice, I can see I'm going to learn a lot just playing around from the tips you have given me so far

  15. sulz
    Member

    bello80: the button with the link -

    <a href="http://wordpress.com"><img src="http://faq.files.wordpress.com/2006/05/wp-button-1.png" alt="1" /></a>

  16. belle80
    Member

    Thanks very much, that worked and I can see how to configure things a lot better now with regards to buttons!

  17. devblog
    Member

    Just for clarification, it is recommended to use the title attribute in your image tags. The alt attribute is for 'alternate' text. In other words, if the image doesn't come up, whatever text you have in your 'alt' attribute will be displayed instead.

    Now, to make the image link back to wordpress.com, you do this:

    <a href="http://www.wordpress.com" title="WordPress"><img src="http://faq.files.wordpress.com/2006/05/wp-button-1.png" alt="WordPress"  /></a>

    OR

    <a href="http://www.wordpress.com" title="WordPress"><img src="http://faq.files.wordpress.com/2006/05/wp-button-7.gif" alt="WordPress" /></a>

    HTH

  18. devblog
    Member

    Sulz beat me to it :D

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags

No tags yet.