GameBanana Icon GB Tutorial

How to put images for your links*improved version*

SEX! Ok, we got your attention. We are one of the oldest mod sites on the Interwebs. Sign up and maximize your browsing experience.

  • Subscribe: Get notified of new submissions like this.
  • Say Thanks: Show your appreciation by sending DEVGRU-6 points.
  • Post: Give DEVGRU-6 your thoughts on this Tutorial.
  • Vote: Help DEVGRU-6 win the Monthly Awards.
  • Rate: Give this Tutorial a rating out of 10.
  • Flag: Alert moderators and warn members of a problem with this Tutorial.
  • Watch: Get notified when this Tutorial is updated.
Mascot

Resistance is futile...

Sign up

Already a Bananite? Login

Hello everyone. Today, I'm going to teach you how to have images for your links so that it will look like a nice thing to click on. Or whatever reason there is for an image link. **First:** Let's start with the basic tags for the html code: **Second:** Good. Now let's find the site you want to get to by clicking on the image you will chose later. Places like your blog, forums, other submissions,games and etc. **Third:** After you've reached the page you want other people to go. Copy and paste it's URL between the ""tags in the a href location. Like this: So that this is the page other people will go to. **Forth:** Now to find the image you want people to click on. You can go to [Google](http://www.google.com.sg "Google") or any other websites to find images. Note: If you use imageshack, the code won't activate. **Fifth:** Then, copy and paste the image URL between the "" tags in the img src location. Like this: Okay. So this green html code you see above is DONE! And that's IT! All you need is the page url and the image url. If you want an easier way to understand this tutorial, here's a video: -------------------------------------------------------- Now I have some recommendations on this tutorial. You guys usually want people to click a download button or a "click here" button. Well I got the best solution to a transparent image. If you want the best, select either images: This are the best buttons I find so far. They have transparent backgrounds. This would be the best solution for you guys to select. Okay. Everyone of you enjoy this tutorial. And I hope it works for you^_^ Now I have an earlier tutorial that is dope. I didn't do well on my first tutorial. That's why this is an improved tutorial for you guys to use. If you want to see my old/lousy tutorial: Thanks for getting this tutorial. Good luck ^_o

Posts

  • 1
  • 2
  • 6y
    DEVGRU-6 avatar
    DEVGRU-6 Offline
    Member Joined 7y
    363 points Ranked 11140th
    @napole0n99- *face palm* Dude, trying to modify the code in that way, is stupid. The code I've given you is just perfect. Besides, if you dun understand, watch the damn video!

    Here's the code:



    Remember. Dun do anything to it.
    DEVGRU Seal Team 6 avatar
    Mantra
    DEVGRU Seal Team 6
  • 6y
    DEVGRU-6 avatar
    DEVGRU-6 Offline
    Member Joined 7y
    363 points Ranked 11140th
    I dunno. I just think that there should be like a second version of this tutorial. I dunno. I normally sumbit maps and skins on my profile.

    But I think this could help newbies when it comes to this kind of thing. -_-
    DEVGRU Seal Team 6 avatar
    Mantra
    DEVGRU Seal Team 6
  • 6y
    Frizz925 avatar
    Frizz925 Offline
    Member Joined 7y
    Why don't you just update the previous tutorial? Really, I'd like to know why.
    *Switching to the old account*
  • 6y
    Corvalho avatar
    Corvalho avatar elsewhere
    Apocalyptic Flag Affiliation: Apocalyptic
    Moderator Joined 6y
    39,783 points Ranked 102nd
    69 medals 14 legendary 15 rare
    • 1st Place - Oddities Skinning Contest Medal icon
    • 1st Place - Powerful Tools Skinning Contest Medal icon
    • 1st Place - Summertime Skinning Contest Medal icon
    • 1st Place - L4D2 Skinning Contest Medal icon
    • 1st Place - Sci-Fi Concepts Contest Medal icon
    • 1st Place - Halloween Skinning Contest 2014 Medal icon
    Corvalho avatar
    Corvalho
    Apocalyptic Flag
    Apocalyptic
    you could add the title="" atribute to the "a" or the "img" tag so the user can see a short description when he put the mouse over the img.
     avatar
    Mantra
  • 6y
    Carma avatar
    Carma Offline
    Member Joined 7y
    5,884 points Ranked 763rd
    We know.
    Banned
  • 6y
    DEVGRU-6 avatar
    DEVGRU-6 Offline
    Member Joined 7y
    363 points Ranked 11140th
    Oh okay. Sorry for that to happen. But thanks for liking this tutorial I made. Even though I still have an old/lousy tutorial on the front page ):

    Even though I can delete it but I just don't feel like it. I still have a link which connects the old tutorial to the new one. I just don't wanna delete it. But once again, thanks for liking it, Aceman.
    DEVGRU Seal Team 6 avatar
    Mantra
    DEVGRU Seal Team 6
  • 6y
    robin avatar
    robin avatar Lurking
    Apps
    Super Moderator Joined 10y
    6,046 points Ranked 739th
    28 medals 2 legendary 6 rare
    • Submitted 100 Maps Medal icon
    • 10 years a member Medal icon
    • 6 years a member Medal icon
    • Achieved Super Moderator clearance Medal icon
    • Submitted 100 Threads Medal icon
    • Returned 1000 times Medal icon
    My html tutorial is broken. :(

    This will help teh newbies tho ;)
    Senior Moderator
  • 6y
    DEVGRU-6 avatar
    DEVGRU-6 Offline
    Member Joined 7y
    363 points Ranked 11140th
    Whatever. I'm just trying to do my best. For those of you who don't understand, watch the video!
    DEVGRU Seal Team 6 avatar
    Mantra
    DEVGRU Seal Team 6
  • 6y
    Naikon_ avatar
    Naikon_ Offline
    Member Joined 7y
    how kan i put this image/link to my profile ?!

    i try to put it but whont work
    Schutzstaffel
  • 6y
    Logan Dougall avatar
    Logan Dougall avatar Offline
    Half Life Storm Flag Affiliation: Half Life Storm
    Admin Joined 11y
    13,071 points Ranked 327th
    40 medals 3 legendary 9 rare
    • Achieved Admin clearance Medal icon
    • 500 posts awarded Exemplary Feedback Medal icon
    • 10 years a member Medal icon
    • 50 posts awarded Exemplary Feedback Medal icon
    • 100 posts awarded Exemplary Feedback Medal icon
    • 200 posts awarded Exemplary Feedback Medal icon
    Logan Dougall avatar
    Logan Dougall
    Half Life Storm Flag
    Half Life Storm
    Admin
    Still too much fluff. Should have edited the old submission rather than make a new one considering it's the exact same topic....

    Sum up tutorial:

    Make a link<a href="WEBSITEURLHERE">Clicky Link</a>

    Make an image<img src="IMAGEURLHERE" />

    Combine them<a href="http://gooogle.ca"><img src="http://gooogle.ca/logo.jpeg"></a>

    You don't need ANYTHING else but that. Over-complicating a dead simple task.
    √úberStylers {...} ~/clubs/1947
  • 1
  • 2

Share

Shareable Image:
Share banner
HTML embed code:
BB embed code:
Markdown embed code:

More embeddable images

Bookmark and Share

Credits

Key Authors
Aceman
Found from this guy
Thanks
Win-Zip
giving me a link to Aceman's tutorial
Devieus
giving me the code
4everjapanese
video

Submitter

DEVGRU-6 avatar
DEVGRU-6 Offline
Member Joined 7y
363 points Ranked 11140th

DEVGRU-6
Creator
Send a Private Message to the submitter

Category

Details

Difficulty Level
Beginner Difficulty

Attributes

Stats

Posts
14
Views
3,745
Date Added
6y
Date Modified
6y
bcp.crwdcntrl.net tracking pixel