Making An Icon Table
So you want that nice table everyone uses?
Piece of cake! It's mostly copy/paste, but you might need some guidance.
First of all, this is much easier to do in for example Notepad. That's what I use at least. With such a program it all gets very easy.
You need to pick what colour to have your top boxes in... the ones saying for example "001: afraid". Right now they don't have a colour! *gasp* It just says "#COLOR CHOICE GOES HERE". I recommend a dark colour since the ttext colour is set to white in the coding (can be changed though).
The background colour of the table is set to a light grey (#CCCCCC), that's how I like it. You might want to change it, but we'll get to asll the changing soon.
And finally it would be very good if you made a filler icon slap into every empty icon box. I would suggest making something that's easy on the eyes (if you keep #CCCCCC as your background, a really good thing is just to make an icon with the background in that colour and write "no icon" in white).
Of course you also need somewhere to host your images... Photobucket is a good option. Upload your "no icon" icon there right away.
Now, on to fiddling with the code!
Click inside the little box and then either right click, choose "Select all" and then "copy". Or, use a shortcut (Ctrl+A and Ctr+C for PCs at least). Then open up Notepad or something similar (I do not recommend Word, it seems to kill some coding that then doesn't work in LJ) and paste it in (rightclick > paste or Ctrl+V)
Save it, always remember to save again when you've made some changed, k?
Now you need to find the "replace" option. In Notepad that's either Edit > Replace or simply Ctrl+H. Found it? Good.
There are two boxes for you to enter text in... "Find what:" and "Replace with:"
For the different things to replace you do the following:
Colour of the "001: afraid" etc boxes
In the "Find what" box you enter exactly COLOR CHOICE GOES HERE (copy/paste that line please).
In the "Replace with:" you enter the colour you want. Without the # sign, it's already there.
You can go here to find yourself a nice colour. Copy what the "HTML Code" says, it should be a combo of 6 letters and/or numbers.
Make sure you have no quotationmarks in either of the boxes.
Hit the button saying Replace All
Filler icons
In the "Find what" box you enter exactly ICON GOES HERE (copy/paste that line please).
In the "Replace with:" you enter the url of your icon (http://yourfillericonurl.png or whatever the url might be).
Make sure you have no quotationmarks in either of the boxes.
Hit the button saying Replace All
Background colour
If you don't like the background colour being light grey, do like this:
"Find what" box: CCCCCC
"Replace with" box: the colour you want. Without the # sign.
Hit the button saying Replace All
Text colour in the "001: afraid" etc boxes
White is a good colour if you have a dark box colour, but in case you pick a lighter colour:
"Find what" box: FFFFFF
"Replace with" box: the colour you want. Without the # sign.
Hit the button saying Replace All
Entering icons
Well, just take your real icon url and replace the filler url in the right place. Make sure there are quotationmarks around the adress when you've pasted it. Just one on each side.
Any questions?
Piece of cake! It's mostly copy/paste, but you might need some guidance.
First of all, this is much easier to do in for example Notepad. That's what I use at least. With such a program it all gets very easy.
You need to pick what colour to have your top boxes in... the ones saying for example "001: afraid". Right now they don't have a colour! *gasp* It just says "#COLOR CHOICE GOES HERE". I recommend a dark colour since the ttext colour is set to white in the coding (can be changed though).
The background colour of the table is set to a light grey (#CCCCCC), that's how I like it. You might want to change it, but we'll get to asll the changing soon.
And finally it would be very good if you made a filler icon slap into every empty icon box. I would suggest making something that's easy on the eyes (if you keep #CCCCCC as your background, a really good thing is just to make an icon with the background in that colour and write "no icon" in white).
Of course you also need somewhere to host your images... Photobucket is a good option. Upload your "no icon" icon there right away.
Now, on to fiddling with the code!
Click inside the little box and then either right click, choose "Select all" and then "copy". Or, use a shortcut (Ctrl+A and Ctr+C for PCs at least). Then open up Notepad or something similar (I do not recommend Word, it seems to kill some coding that then doesn't work in LJ) and paste it in (rightclick > paste or Ctrl+V)
Save it, always remember to save again when you've made some changed, k?
Now you need to find the "replace" option. In Notepad that's either Edit > Replace or simply Ctrl+H. Found it? Good.
There are two boxes for you to enter text in... "Find what:" and "Replace with:"
For the different things to replace you do the following:
Colour of the "001: afraid" etc boxes
In the "Find what" box you enter exactly COLOR CHOICE GOES HERE (copy/paste that line please).
In the "Replace with:" you enter the colour you want. Without the # sign, it's already there.
You can go here to find yourself a nice colour. Copy what the "HTML Code" says, it should be a combo of 6 letters and/or numbers.
Make sure you have no quotationmarks in either of the boxes.
Hit the button saying Replace All
Filler icons
In the "Find what" box you enter exactly ICON GOES HERE (copy/paste that line please).
In the "Replace with:" you enter the url of your icon (http://yourfillericonurl.png or whatever the url might be).
Make sure you have no quotationmarks in either of the boxes.
Hit the button saying Replace All
Background colour
If you don't like the background colour being light grey, do like this:
"Find what" box: CCCCCC
"Replace with" box: the colour you want. Without the # sign.
Hit the button saying Replace All
Text colour in the "001: afraid" etc boxes
White is a good colour if you have a dark box colour, but in case you pick a lighter colour:
"Find what" box: FFFFFF
"Replace with" box: the colour you want. Without the # sign.
Hit the button saying Replace All
Entering icons
Well, just take your real icon url and replace the filler url in the right place. Make sure there are quotationmarks around the adress when you've pasted it. Just one on each side.
Any questions?
| 50 T H E M E D |
| 001 : Afraid | 002 : Alone | 003 : Bad Luck | 004 : Colourful | 005 : Confused |
| 006 : Crazy | 007 : Dance | 008 : Dark | 009 : Day | 010 : Deceit |
| 011 : Envy | 012 : Evil | 013 : Face | 014 : Falling | 015 : Family |
| 016 : Found | 017 : Friend | 018 : Geeky | 019 : Happy | 020 : Home |
| 021 : Humour | 022 : Hurt | 023 : Light | 024 : Lost | 025 : Love |
| 026 : Night | 027 : Old | 028 : Open | 029 : Outside | 030 : Pain |
| 031 : Play | 032 : Power | 033 : Rain | 034 : Right | 035 : Run |
| 036 : Sadness | 037 : Secret | 038 : Skin | 039 : Sleepy | 040 : Song |
| 041 : Sweet | 042 : Talk | 043 : Tears | 044 : Time | 045 : Trapped |
| 046 : Triumph | 047 : Truth | 048 : Unknown | 049 : WTF? | 050 : Yummy |
| 50 A R T I S T ' S C H O I C E |
| 051 | 052 | 053 | 054 | 055 |
| 056 | 057 | 058 | 059 | 060 |
| 061 | 062 | 063 | 064 | 065 |
| 066 | 067 | 068 | 069 | 070 |
| 071 | 072 | 073 | 074 | 075 |
| 076 | 077 | 078 | 079 | 080 |
| 081 | 082 | 083 | 084 | 085 |
| 086 | 087 | 088 | 089 | 090 |
| 091 | 092 | 093 | 094 | 095 |
| 096 | 097 | 098 | 099 | 100 |
| Icon Count : 0 / 100 Last update: |