Tessisamess

Previous | Next

Checklist & Progress Tracker





MY FIRST CHECKLIST
  44% COMPLETED
INCOMPLETE ITEM
INCOMPLETE ITEM
This is an item with more information
INCOMPLETE ITEM W/SUB-ITEMS
COMPLETED ITEM
INCOMPLETE ITEM
COMPLETED ITEM
INCOMPLETE ITEM
COMPLETED ITEM
COMPLETED ITEM

MY SECOND CHECKLIST
  60% COMPLETED
INCOMPLETE ITEM
COMPLETED ITEM
INCOMPLETE ITEM
COMPLETED ITEM
COMPLETED ITEM

MY THIRD CHECKLIST
  100% COMPLETED
COMPLETED ITEM
COMPLETED ITEM
COMPLETED ITEM
COMPLETED ITEM
COMPLETED ITEM
COMPLETED ITEM


Information

Hey guys! I got a question about checklists today from one of my wonderful commenters, and it got me thinking... so today we have a checklist/progress bar combo code, along with codes for isolating single parts of the code if you don't need The Works.

The default version of this code utilizes the details tag so that you can hide and expand multiple checklists in the same entry, and I've also added coding for items with descriptions and sub-lists!

Use the coding in ITEM TYPES to fill in checklists! A good way to do this fast is to put a textarea in the comments of the entry your checklist is on with the contents of ITEM TYPES and screen it so you always have it handy without having to run back over here. Enjoy! ♥

Coding: Full Progress Checklist



Coding: Multiple Checklists



Coding: Item Types



Coding: Checklist Only



Coding: Progress Bar Only



Installation Guide

Paste into an entry and fill in the following!

CHECKLIST TITLE - Your title
50% (x2) - Your amount of progress
CHECKLIST HERE - Start inputting checklist items here

Editing Guide

Paste the coding into Notepad or similar and bring up Replace All (usually Ctrl+H) to replace values quickly and easily!

FONTS
helvetica,arial,sans-serif - Overall font
impact - Headers

COLORS
#fff - Character names
#eee - Progress bar background/gutter
#8BADA2 - Accent color
#222 - Text color
0,0,0 - Container border; blockquote border (semi-transparent rgba value)

Terms of Use

♡ Do not remove credit.
♡ Do not redistribute my codes in part or in whole (posting a copy for players to use in your game is fine with a link to original post.)
♡ If you break something during editing, please feel free to drop me a comment and I'll help as best I can!
♡ I love seeing edits! This isn't a rule, but if you have a cool edit of one of my codes I'd love to see it!

Comments

Oct. 19th, 2017 11:34 pm (UTC)
This. Is. Perfect. Thank you!! ♥
Oct. 19th, 2017 11:45 pm (UTC)
You're so welcome!! I had a ton of fun putting it together. ♥
Oct. 20th, 2017 12:41 am (UTC)
ohhh my god i love this
Oct. 20th, 2017 12:45 am (UTC)
Heee, yay ty! ♥ I can't believe I've never made anything like this before lmao.
Oct. 20th, 2017 12:50 am (UTC)
Very cool! I'll definitely have an excuse to use this... probably at my icon journal for my in progress/upcoming sets... Hmm...
Oct. 23rd, 2017 10:04 pm (UTC)
Oooh, that's a great idea! I was definitely thinking about using this to track each month's work tbh haha.
Nov. 29th, 2017 05:42 pm (UTC)
thank you for this code. i have a character who does a reading challenge. so this might be something i could use for them, especially the progress bar. i'll probably play around with it to make it work because i wanted to find something similar tracking wise like goodreads has where it shows a percentage and books read / goal total.
Nov. 29th, 2017 06:12 pm (UTC)
Oh nice, that's a great idea! I think a couple people are using this on the personal journals for just that!