Harry Potter tiny icons

Jul 15, 2007 01:24

Have some Harry potter tiny icons to replace the default user and community icons :) For example, instead of
, you will get
.

[15] Stills
[19] Animated (pairings)



Rules:
  1. Credit hobbitholes in your userinfo for tiny icons.
  2. For use as LJ tiny icons only please (don't post/archive these on xanga, myspace, forums, etc), please.
  3. No hotlinking.
  4. Don't modify.
  5. Comments are appreciated! :)


Stills:

01
hp
02
rw
03
hg
04
ginw
05
ll
06
dm
07
fw
08
gw
09
sb
10
rl





















11
ss
12
ad
13
lv
14
hp
15
scar











Animated:

16
trio
17
hp/gw
18
hp/hg
19
hp/ll
20
hp/dm
21
rw/hg
22
rw/ll
23
h/g/r/hr
24
fw+gw
25
sb/rl





















26
dm/hg
27
dm/gw
28
dm/rw
29
ss/rl
30
ss/sb
31
ss/hp
32
ss/dm
33
ss/hg
34
hp/lv



















Notes about the code (read this):
  • Works for Internet Explorer 7+, Firefox, and newer browsers in general. Internet Explorer 6 or below will only display one icon.
  • The code below doesn't work on all styles. If this is the first time you're doing tiny icon customizations AND the code doesn't work below, then go to your style's community to find the appropriate code.
  • See this post by babytest for more information. I originally got the code from the tiny code generator by loveicon but modifications like l-stat in the URL of the images and !important for the paddings need to be added.

Installation Instructions:
1. Save tiny icons to your own image host.

2. Code: Copy and paste the code below into notepad. After you've uploaded your images and put them into the code, changed the height and width for the image (in red and orange), and tweaked the last two padding numbers to how you see fit, paste it all into the custom stylesheet box.

11px = height, 11px = width, 4px = padding from bottom, 2px = padding from left

CODE:
.ljuser img {
width: 0;
height: 0;
background-repeat: no-repeat;
background-color:transparent;
/* so that IE users will still see an image */

background-image: url(YOUR IMAGE FOR THE USER);
padding: 11px 11px 4px 2px !important;
}

.ljuser img[src="http://l-stat.livejournal.com/img/userinfo.gif?v=2"] {
width: 0;
height: 0;
background-repeat: no-repeat;
background-image: url(YOUR IMAGE FOR THE USER) !important;
padding: 11px 11px 4px 2px !important;
}

.ljuser img[src="http://l-stat.livejournal.com/img/community.gif?v=2"] {
width:0;
height: 0;
background-repeat: no-repeat;
background-image: url(YOUR COMMUNITY IMAGE) !important;
padding: 11px 11px 4px 2px !important;
}

3. Lastly, edit your userinfo and paste this into the bio section:

Tiny icons by hobbitholes

All done :)



also posted @ graphics journal: hobbitholes

resources: icon sets

Previous post Next post
Up