Using the HTML Details Disclosure Element

Like many others, I post notes about my reading on my blog. I’ve tried several ways of doing this; I’m now in my third month of the current strategy, and I find that it helps me to think more carefully about what I’m reading.

Some of those notes are rather long, and I was concerned that a reader might grow weary, scrolling through a long note about a book they find uninteresting, and miss seeing notes about a book that they might want to read. But in the past week I stumbled on the HTML Details disclosure element. Using this element, I can designate a short paragraph as the summary of the note. When the page loads, only the summaries are visible. But clicking on a summary reveals the entire note.

I think the look of the page is much cleaner.

I’m just tech-savvy enough to cause problems for myself, and it took me longer that it should have to set this up. I’m posting this here both to remind myself of what I did, just in case I have to do it again, and to provide some hints to others who might want to do it themselves.

These notes are relevant primarily to my own process – I write in emacs org-mode and then use ox-hugo to export using the hugo static blog framework.

The first challenge (actually, given how easy this was, the only real challenge) I faced was that my versions of hugo and my site template (Anatole) were out of date. I updated to the latest versions of each. After the software was up to date, it was a simple matter of adding a few lines to each summary note.

Here’s an example:

#+begin_details
#+begin_summary
A short take:

Marshall is an acclaimed biographer. Her biography of the Peabody sisters was well received and she won a Pulitzer Prize for her biography of Margaret Fuller. In this collection of essays she turns the biographical eye on herself. This is not a chronological narrative about her life; instead, she tells stories about objects, about people, and about events that have shaped her. I find it an interesting approach – just as a biographer exists in the background of the subject’s life, Marshall as autobiographer emerges more subtly than she might in this collection of essays. Each of the essays stands alone in some ways, but I came out of the reading with the sense that I know Marshall as I might know someone with whom I have occasional conversations over the course of many years. Her personality and her person emerge both in the stories that she tells and in the way that she tells them.

Click here to read more.
#+end_summary


I won’t attempt to describe all of the essays here, but rather focus on two that I found most interesting. In “Free for a while,” she tells the story of how her life interfaced with that her high school classmate Jon Jackson. Jon’s brother George was found guilty of stealing $70.00 and received a sentence of one year to life. He published a collection of prison letters called [[https://www.historyisaweapon.com/defcon1/soledadbro.html][Soledad Brother]]. In his senior year of high school, Jon died in a courthouse raid that he hoped would free his brother so that could escape together to join Eldridge Cleaver, exiled in Algeria. The judge and two prisoners also died. The story of George Jackson and the other Soledad Brothers and of Jon Jackson’s failed attempt to rescue George is well known; what I found most interesting in this essay is how Marshall describes the interweaving of her life with Jon’s, showing the different circumstances of their private and family lives and also the ways in which they overlapped in and around school.
#+end_details

And here’s how this looks on the web:

A short take:

Marshall is an acclaimed biographer. Her biography of the Peabody sisters was well received and she won a Pulitzer Prize for her biography of Margaret Fuller. In this collection of essays she turns the biographical eye on herself. This is not a chronological narrative about her life; instead, she tells stories about objects, about people, and about events that have shaped her. I find it an interesting approach – just as a biographer exists in the background of the subject’s life, Marshall as autobiographer emerges more subtly than she might in this collection of essays. Each of the essays stands alone in some ways, but I came out of the reading with the sense that I know Marshall as I might know someone with whom I have occasional conversations over the course of many years. Her personality and her person emerge both in the stories that she tells and in the way that she tells them.

Click here to read more.

I won’t attempt to describe all of the essays here, but rather focus on two that I found most interesting. In “Free for a while,” she tells the story of how her life interfaced with that her high school classmate Jon Jackson. Jon’s brother George was found guilty of stealing $70.00 and received a sentence of one year to life. He published a collection of prison letters called Soledad Brother. In his senior year of high school, Jon died in a courthouse raid that he hoped would free his brother so that could escape together to join Eldridge Cleaver, exiled in Algeria. The judge and two prisoners also died. The story of George Jackson and the other Soledad Brothers and of Jon Jackson’s failed attempt to rescue George is well known; what I found most interesting in this essay is how Marshall describes the interweaving of her life with Jon’s, showing the different circumstances of their private and family lives and also the ways in which they overlapped in and around school.

The second paragraph is hidden initially, but it appears if one clicks anywhere on the visible paragraph.

Pretty neat.

comments