Previous | Next

Castlist: Clickable "Bio-card" Directory

{view the live preview}

001: Informative Info
Here's a 16 character magic click castlist. There's a homepage with each character listed, a minibio page for each of them, and seamless clicking via the footer links. Stats have room for one custom field and have links for the char's journal, app, IC contact, and dropbox. Could also be used for a CDJ character list.

Click through the code to see it in action (profile #2 shows what it looks like with a small bio, and profile #3 shows a long bio; the rest take up exactly the right amount of space to fill it without scrollbars).

This code is, well, a big ass fucker so, if you're adding to it, try not to double its size or you'll exceed post limit (which is why the live test isn't in this entry, lmao). If you want to use this code for less characters (or want to divide your table into smaller groups so you can post duplicates of it in the post for each group), and want it edited down so the homescreen images are larger and there are less pages, let me know and I'll code it up!

Also, let me know if I forgot anything in the CTRL+F guide. I'm tired as balls and may have left something out lmao.
002: The Code
Paste the following into a code tester, then follow the directions below!

003: CTRL+F This Shit
C</span>haracter bio #1. through C</span>haracter bio #16. for each bio page.
http://i.imgur.com/1d075.png to change userpics and Name Here for homepage names (x16).
http://i.imgur.com/a3q2Q.png to change bio pics (x16).
character one; through character sixteen; to fill in the stats and links.

georgia,times,serif to change the bulk font.
helvetica,arial,sans-serif to change the stats font.
#222 to change bulk text color.
#FFF to change subtitle and stats text color.
#AAA to change stats header color.
#333 to change header title color, subtitle bg, pic border color, and stats bg.
#F1F1F1 to change the main background color.
004: Rules and Shit
→Leave my credit.
→Do not redistribute in part or in whole.
→If you break something during editing don't be scared to ask me to see what happened. Yep. That's a rule.
→If you're a maker like I am and you do something cool with this I'd really like to see it, but it's not necessary.

→LJ-RAW means ya gotta BR them line breaks!
→Probably should be behind a cut, js js.


Jan. 21st, 2014 06:37 am (UTC)
I love this! I do have a question though, is this compatible with webs?
Apr. 9th, 2015 10:05 pm (UTC)
is there any way i can get 20 character images? i'm scare i'll mess it up.
Feb. 2nd, 2017 09:24 pm (UTC)
Just wanted to say a big thank you for this. I'm not using it as a cast list, I've been using it to track my 50 in 52 reading challenge and it's GREAT!
Feb. 18th, 2018 10:30 pm (UTC)
Hey! I thought you'd like to know that the live preview website for this code has been archived and is no longer available for viewing.