mistojen: (Default)
mistojen ([personal profile] mistojen) wrote2016-08-05 09:10 pm
  • Add Memory
  • Share This Entry
Entry tags:

thread tracker: plurk



Plurk-Inspired Thread Tracker



Uh, so I got really bored tonight because I was sick of toggling through all of my Dreamwidth inboxes to find out if I had any tags (seriously, let's get it together with the notifications, Dreamwidth, shall we?) and my Plurk went quiet, so...I decided to give this a try.

Heads up...this thing is stupidly complicated code. If you don't know how to read code, you miiiight not want to bother with it? I'm guessing it'll just frustrate you, is all. I'd love it if anyone actually does use this code, for you to drop a comment below and let me know how you like it. I don't personally have the patience to maintain a thread tracker like this but I'm not a patient person by nature, so maybe someone out there will actually want to use this. It gave me something to do, either way. :) If you do use it, enjoy, and please don't hate me if you get frustrated with the maintenance of it lol.


Announcing Plurk Coins journalname
bakerstreet name of meme
top comment
gamethefirst name of thread
with [profile] threadpartner
gamethesecond name of thread
here's a quick, short description
bakerstreet name of meme
with [profile] threadpartner
bakerstreet name of meme
top comment
gamethefirst name of thread
with [profile] threadpartner
Announcing Plurk Coins journalname
bakerstreet name of meme
top comment
gamethefirst name of thread
with [profile] threadpartner
gamethesecond name of thread
here's a quick, short description
bakerstreet name of meme
with [profile] threadpartner
bakerstreet name of meme
top comment
gamethefirst name of thread
with [profile] threadpartner
'plurk' design by mistojen
instructions:
  1. Copy the code for the skeleton and paste it into your post.
  2. Copy the code for table one
  3. In between the sections labeled "TABLE START" and "TABLE END" paste the code for table one
  4. Replace the following:
    • TABLENUMBER (I recommend labeling this t1, t2, etc. because that's how I've done it in the code for subsequent tables, but you can name it whatever you want, you'll just have to make sure they match where applicable.)
    • YOURICON (must be square; image will resize itself)
    • JOURNALNAME (this is your character's journal name)
    • THREAD## (this is optional but will help you keep things organized)
    • THREADICON (must be square; image will resize itself)
    • GAMENAME (you can replace this with the name of your game or meme community)
    • URLGOESHERE (this is the url for your thread.)
    • NAMEOFTHREAD (this is the name for your log or meme.)
  5. After NAMEOFTHREAD, if you'd like to add a little description or something on the line below as shown in my live preview, it'll need to be short and proceeded by a <*br> (no asterisk) tag.
  6. To add subsequent tables, copy the code for subsequent tables and paste it into the skeleton directly below the first table.
    If you add subsequent tables, you'll see that at the very bottom of the code, you will find #TABLENUMBER as the href value of a link — if you're planning on adding more tables, then I'd say leave it and change it to t1 until you add a third table, at which point, change it to t3...if that makes sense?
  7. Because this code assumes you have exactly six threads to put into each table, until you have six threads, I've added "visibility: hidden;" to the wrapper div (the one located directly below the header < ! ---THREAD ## --- > ) around every thread other than the first in each table code. Once you add thread information to one of these divs, simply remove "visibility: hidden;" from that div and it will be visible on the plurk timeline. Be careful if you're doing a CTRL+F to find this, because on table one, I also have the Left Arrow image set to "visibility: hidden;" and removing that will make the arrow show up, so if you don't want the arrow on the left side of your timeline on your first table, don't remove it from that spot...just from the thread divs.
  8. If you only have one table, find where the code has <*a href="#t2"><*/a> wrapped around the arrow image (there are no asterisks in the code, so you'll have to remove them if you're going to search) and change t2 to t1, so that it'll reroute itself back to your main table and you won't see any blips. When adding subsequent tables, you'll want to change the t1, t2 coding to link to the correct table (so if you have three tables, you'll want to label them as t1, t2, t3. On the first table, you'll only be linking to t2 around that image. On the second table, you'll link to t1 on the first image and t3 on the last image, and then on t3, you'll want to link to t2 on the first and t1 on the second. I told you this was stupidly complicated, didn't I?)
  9. If you'd like to upload the images I'm using on the table for safe keeping they are here:
    • Plurk logo: http://i.imgur.com/3x2MRBR.png
    • Plurk Coins/Alerts icons: http://i.imgur.com/z98ll7w.png
    • Gradient: http://i.imgur.com/CR1kMlh.png
    • Left Arrow: http://i.imgur.com/Fs60kSz.png
    • Right Arrow: http://i.imgur.com/iFArkxQ.png
  10. Please do not remove credit.
  11. If you have any questions or run into hiccups (which you very well might), please feel free to comment below and I'll try to get back to you ASAP to help.
  12. Enjoy!


code for skeleton:


code for table one


code for subsequent tables