DataTables: Basic Operation

1

I am trying to turn on DataTables in a jekyll 4.1.1 on a default install for ubuntu. So I created a minimalist test file (enclosed below) and ran it through jekyll. if I understand the docs correctly, datatable: true in the header should operationalize it, linking to the data table css and js (and document.ready). Unfortunately, the resulting html does not do this. I could get this to work myself (by handincluding all the necessary components as raw html), but before I rely on my own hacks, I was wondering whether there is a standard way and I merely forgot something.

---
title: "Test Table"
datatable: true
---

# Mark Down

<div class="datatable-begin"></div>

| time| sig1A|
|----:|-----:|
|    1|     3|
|    2|     4|

<div class="datatable-end"></div>


# HTML

<table class="display">
 <thead>
  <tr>
   <th style="text-align:right;"> time </th>
   <th style="text-align:right;"> sig1A </th>
  </tr>
 </thead>
<tbody>
  <tr>
   <td style="text-align:right;"> 4 </td>
   <td style="text-align:right;"> 5 </td>
  </tr>
  <tr>
   <td style="text-align:right;"> 6 </td>
   <td style="text-align:right;"> 7 </td>
  </tr>
</tbody>
</table>
2

What docs??
Could you post a link to it?

3

I am not sure what you are asking…which is probably the problem. by “doc,” do you mean the document that I enclosed?

I have simply installed jekyll 4.1.1 on ubuntu (nothing extra), created the test document, and build it to a destination (ok, I had a default layout, too).

4

Docs, as in documentation in reference to this on your previous post:

datatable: true is not something core to Jekyll. I’m guessing that is something to do with whatever custom theme you have installed.

5

if it is not part of jekyll core and requires some particular theme, then this makes sense. (it would be a nice feature for core jekyll, though.) I just need to do it myself by hand then.

grazie. /iaw

6

were you using this documentation theme?

7

Nope. To be honest, I was confused. I was not sure whether the name implied that it was a specialized theme for jekyll, or simply the documentation for jekyll. (I had found the hint to DataTables: true through google, and noted that it was in the documentation theme.) it is a very generic name for something that is not part of the core…

The front page https://idratherbewriting.com/documentation-theme-jekyll/index.html also did not provide an explanation (of differences, enhancements, examples) upfront, and no links to some sites (or a list of when to consider using it).

I am not complaining. I am just explaining why it was not clear to me what I was looking at.

/iaw

8

Can you post some debugging feedback to see what is broken.

  • are you using an unsupported themed on GH Pages? Are you using remote theme plugin to pull it in?
  • can you reproduce the issue locally?
  • when you visit your page and view html source, are jquery and jquery-datatables in your JS script tags of your head tag? You might have to adjust your use of layouts to make sure you use the head includes or the theme’s default layout
  • in your JS console do you get an error downloading or executing jquery?
9

There are multiple ways to approach datatables. HTML vs markdown. Jekyll theme vs add JS yourself. Can you get any one approach to work?

Here is a related question using the same theme.

https://talk.jekyllrb.com/t/how-to-pull-csv-into-datatables/

10

ah - haha - I can see how that could look like actual jekyll documentation. It is a cool theme, that is for sure, lots can be learned from how he put everything together.