How to make clickable icon links for your journal.

5 min read

Deviation Actions

Sabtastic's avatar
By
Published:
16.7K Views


Follow Me Here, Too!



My Gallery | Livestream | Facebook
Newgrounds | Twitter | Tumblr | Commissions



Want to learn how to spice up your page with icons like I have on the top of this journal?
Here's all of the stuff you need to do it!

1.
First off, you MUST be an active DeviantART subscriber with an active membership.
If you don't have a membership, just ignore this journal or pass it on to a friend who has one!

2.
You need to type in a specific CSS code in order to get your icon to appear.
[You can copy and paste the completed code by clicking here.]

It should look like this:


3.
Now you should have a working icon code. Paste the code into your journal or where ever you want it on your page.
(it won't work in comments, private notes, signatures, or deviation descriptions)

4.
Now tweak the code to create your own clickable icon!
Here's a breakdown of where and what to edit:

To make your icon link to your webpage, edit the first half of the code. You can paste your link right after: <a href=" and right before "target="_blank">
Make sure the quotation marks in the code "contain" your link without spaces. There should still be a space between the "a" and "href", though.

To make your icon look like the image you've chosen, copy and paste a [direct link] of the image right after <img src=" and right before "/></a > It shouldn't matter what the file extension is, but if you have your own file to upload, try using imgur.com for uploading. You don't need to create accounts, so uploading is speedy.

Icon Webpages and Image Banks You can Use:
Bookmark these super useful
[iconarchive.com]
[findicons.com]
[dryicons.com]

Ready-to-go image links:
(click the icon to get the image link for yourself)


Other extensions for CSS coding / typing:
(just add the codes to the beginning and end of your comments without spaces)

regular text: regular text
bold text: bold text < b >< /b >
italic text: italic text < i > < /i >
underlined text: underlined text < u > < /u >
shrunken raised text: shrunken raised text < sup > < /sup >
shrunken subtext: shrunken subtext < sub > < sub >
clickable text links: clickable text links <REMOVE THISa href="PASTE LINK">YOUR MESSAGE</aREMOVE THIS>

© 2012 - 2024 Sabtastic
Comments38
Join the community to add your comment. Already a deviant? Log In
Revatel's avatar
Wtf I did everything right and they're not even working????