123 Followers
174 Following
JLsBibliomania

JL's Bibliomania

Also on GoodReads as J L's Bibliomania:

https://www.goodreads.com/user/show/8830421-j-l-s-bibliomania

and Litsy @jlsbibliomania

 

While my first love was SF, I read widely in YA, urban fantasy, police procedurals,  middle-grade, and non-fiction. 

 

 

 

Currently reading

Sparrow Hill Road
Seanan McGuire
Forensics: What Bugs, Burns, Prints, DNA and More Tell Us About Crime
Val McDermid
Progress: 161/320 pages
The Loved Dog: How to Train Your Dog in 30 Days
Tamar Geller
Progress: 103/256 pages

Building tables in HTML, or, how to get your spreadsheet on BookLikes

I'm using the spreadsheet I made in RL on BookLikes to track my Halloween 2017 Bingo reads and I've been asked by a couple of people how they can go about doing their own. 

 

BookLikes supports HTML tables in posts, but it's not obvious how to go about doing it.  There are basically two parts involved:  knowing where to put the table and building the table (or copy/pasting).  

 

I'm going to cover building the table - because there are a couple of different routes you can take to do that - first.  Then I'll cover where to put it, because there's only one way to do that and it applies to everybody.

 

So first: the code.  For advanced users, this is what I did:  I created my spreadsheet and converted it to HTML**, then opened that HTML up in an editor (any text editor will work) and cleaned it up (most apps put a LOT of extraneous crap in that won't work in BL).  For BookLikes you only need the table itself:  the HTML tag, head tag and body tag will only mess things up.

 

(**Excel will export to web page.  Mac users using Numbers app need a middle step: Copy the table from Numbers.  Create a new document in TextEdit and make sure Rich Text Format is turned ON. Paste the table into TextEdit - make sure it looks like the one you copied.  Save the document as an HTML page.)

 

For the person who does not want anything at all to do with the table creation:  if you are willing to PM me your email address, I'll send you the code I used and you can paste that into your post and alter it to suit your books/style.  It can also be had by doing a "view source" on my blog page and doing a copy/paste.

 

If you want to try building your own table from scratch, I'm assuming you know a bit about HTML and CSS.  Below are two screenshots: one of the beginning of my table and one of the end of it (it's stupidly too long to put in as one screenshot).  Feel free to use this as a guide to achieving the coloured rows, etc.  Some of the styles are overkill, but it was easier to leave them than it was to delete them.

 

 

[...]

 

Note:  I used a div tag to center the table in the post; span didn't work; I didn't try table align=center, ymmv

 

This post would go on forever if I explained each style, but if you are looking for a specific result, or want to know what any of them means, please ask in the comments and I'll be happy to explain further.  

 

Now once you've decided how you're going to get your table, you need to know where to put it.  On the Create new post page, in the toolbar, you want the button at the end:

 

 

When you click on that you'll get a pop up window for another text input box called Source Code.  If you've already started your post, you'll see the text and HTML code in this window.  It'll likely look messy.

 

If you've copied your table code from somewhere else, place your text cursor where you want the table to go in the post, and paste.  If you are starting from scratch, this is where you start typing. 

 

You can use this 'source code' button whenever you want to add a bit of flair, or tweak your post - I often use it to adjust the padding around my images (i.e. I want padding on the right, but not the left side of my image), or on the rare occasions when I want coloured text.  BookLikes will take a fair bit of CSS, but sometimes it's hit and miss - what it doesn't like it just deletes, so your results may vary.

 

I hope this helps and if anyone would like to just use my code as a starting point, and adjust colours and styles, please let me know via PM and I'll email it to you (PM won't take the code either, so email is about the best bet).

 

Reblogged from Murder by Death