emacs-orgmode@gnu.org archives
 help / color / mirror / code / Atom feed
* Exporting Org file to Html with collapsable headings
@ 2022-01-20 14:33 ZIPING CHEN
  2022-01-21 12:23 ` Juan Manuel Macías
  2022-01-21 20:18 ` Tim Cross
  0 siblings, 2 replies; 5+ messages in thread
From: ZIPING CHEN @ 2022-01-20 14:33 UTC (permalink / raw)
  To: emacs-orgmode

[-- Attachment #1: Type: text/plain, Size: 744 bytes --]

Hi,

I am working on a large org file with exceptional number of subheadings. For example, I may have org headings inside headings up to 20 or 30 layers deep.

I may have many things like this in the middle of the file.
************************** a new heading.

When I export the file to html, I like to export in such a way that the org headings become collapsable headline in html (toggle switch). I spend some time search the web, and find a theme called bigblow which does something close to what I want, but not exactly. It provide limited layer of toggle switch only. I wish to turn all layers of headings in org file into collapsable headline to html. 

Does anybody know a way I can accomplish this?

Thanks a lot.

Ziping

[-- Attachment #2: Type: text/html, Size: 1267 bytes --]

^ permalink raw reply	[flat|nested] 5+ messages in thread

* Re: Exporting Org file to Html with collapsable headings
  2022-01-20 14:33 Exporting Org file to Html with collapsable headings ZIPING CHEN
@ 2022-01-21 12:23 ` Juan Manuel Macías
  2022-01-21 16:46   ` Max Nikulin
  2022-01-21 20:18 ` Tim Cross
  1 sibling, 1 reply; 5+ messages in thread
From: Juan Manuel Macías @ 2022-01-21 12:23 UTC (permalink / raw)
  To: ZIPING CHEN; +Cc: orgmode

ZIPING CHEN writes:

> I am working on a large org file with exceptional number of
> subheadings. For example, I may have org headings inside headings up
> to 20 or 30 layers deep.
>
> I may have many things like this in the middle of the file.
> ************************** a new heading.
>
> When I export the file to html, I like to export in such a way that
> the org headings become collapsable headline in html (toggle switch).
> I spend some time search the web, and find a theme called bigblow
> which does something close to what I want, but not exactly. It provide
> limited layer of toggle switch only. I wish to turn all layers of
> headings in org file into collapsable headline to html. 
>
> Does anybody know a way I can accomplish this?

I think that you need to add javascript and enclose the collapsible
content in a div. If you google for 'html collapsible sections' there is
quite a bit of information on how to achieve this from the html side.
Here, for example:

https://levelup.gitconnected.com/collapsible-sections-with-or-without-javascript-3fd871955a9d

On the other hand, although not exactly related to what you are looking
for, you may be interested in taking a look at 'organize'. I have not
tried it, and as far as i know, it has its limitations:

https://github.com/200ok-ch/organice

Best regards,

Juan Manuel 


^ permalink raw reply	[flat|nested] 5+ messages in thread

* Re: Exporting Org file to Html with collapsable headings
  2022-01-21 12:23 ` Juan Manuel Macías
@ 2022-01-21 16:46   ` Max Nikulin
  2022-01-22 18:20     ` xincheng99
  0 siblings, 1 reply; 5+ messages in thread
From: Max Nikulin @ 2022-01-21 16:46 UTC (permalink / raw)
  To: emacs-orgmode

On 21/01/2022 19:23, Juan Manuel Macías wrote:
> ZIPING CHEN writes:
> 
>> I may have many things like this in the middle of the file.
>> ************************** a new heading.
>>
>> I wish to turn all layers of
>> headings in org file into collapsable headline to html.
>>
>> Does anybody know a way I can accomplish this?
> 
> I think that you need to add javascript and enclose the collapsible
> content in a div. 

Have a look at info "(org) JavaScript support" 
https://orgmode.org/manual/JavaScript-support.html (I have not tried 
that folding view).

HTML has <details><summary>header</summary>body</details> elements that 
works without JS, but it will require custom exporter.

You should ensure that deep headings can not be recognized as org inline 
tasks. Check ox-html, it may has limit on number of levels that are 
exported as headings with switching to lists for deeper structures.



^ permalink raw reply	[flat|nested] 5+ messages in thread

* Re: Exporting Org file to Html with collapsable headings
  2022-01-20 14:33 Exporting Org file to Html with collapsable headings ZIPING CHEN
  2022-01-21 12:23 ` Juan Manuel Macías
@ 2022-01-21 20:18 ` Tim Cross
  1 sibling, 0 replies; 5+ messages in thread
From: Tim Cross @ 2022-01-21 20:18 UTC (permalink / raw)
  To: emacs-orgmode


ZIPING CHEN <ziping@mac.com> writes:

> Hi,
>
> I am working on a large org file with exceptional number of subheadings. For example, I may have org headings inside headings up
> to 20 or 30 layers deep.
>
> I may have many things like this in the middle of the file.
> ************************** a new heading.
>
> When I export the file to html, I like to export in such a way that the org headings become collapsable headline in html (toggle
> switch). I spend some time search the web, and find a theme called bigblow which does something close to what I want, but not
> exactly. It provide limited layer of toggle switch only. I wish to turn all layers of headings in org file into collapsable headline to
> html. 
>
> Does anybody know a way I can accomplish this?
>
> Thanks a lot.
>
> Ziping


The effect you are after can be achieved using either JS and CSS or with
just CSS. Most of the CSS frameworks out there will support this
functionality. For example

bootstrap - CSS and JS
bulma - CSS only
Tailwind - CSS only

I'm pretty sure all of the above support the ability to create a
minimised version which only includes the features you want. This can
help minimise unwanted interaction between different CSS style
definitions and reduce overall size.

Personally, I prefer bulma or tailwind over bootstrap as it avoids also
having to deal with javascript and having to bundle js code with your
final output. 


^ permalink raw reply	[flat|nested] 5+ messages in thread

* Re: Exporting Org file to Html with collapsable headings
  2022-01-21 16:46   ` Max Nikulin
@ 2022-01-22 18:20     ` xincheng99
  0 siblings, 0 replies; 5+ messages in thread
From: xincheng99 @ 2022-01-22 18:20 UTC (permalink / raw)
  To: Max Nikulin, emacs-orgmode

[-- Attachment #1: Type: text/plain, Size: 1404 bytes --]

Thanks a lot. This is very close to what I am looking for, and saves a lot of my time. I am grateful to all the help I received from this mailing list.

It is a lot of fun subscribing to this list.

Regards

Ziping

> On Jan 21, 2022, at 11:46 AM, Max Nikulin <manikulin_at_gmail_com_fcq2724cv3y0tc_re5x9491@icloud.com <mailto:manikulin_at_gmail_com_fcq2724cv3y0tc_re5x9491@icloud.com>> wrote:
> 
> On 21/01/2022 19:23, Juan Manuel Macías wrote:
>> ZIPING CHEN writes:
>>> I may have many things like this in the middle of the file.
>>> ************************** a new heading.
>>> 
>>> I wish to turn all layers of
>>> headings in org file into collapsable headline to html.
>>> 
>>> Does anybody know a way I can accomplish this?
>> I think that you need to add javascript and enclose the collapsible
>> content in a div. 
> 
> Have a look at info "(org) JavaScript support" https://orgmode.org/manual/JavaScript-support.html <https://orgmode.org/manual/JavaScript-support.html> (I have not tried that folding view).
> 
> HTML has <details><summary>header</summary>body</details> elements that works without JS, but it will require custom exporter.
> 
> You should ensure that deep headings can not be recognized as org inline tasks. Check ox-html, it may has limit on number of levels that are exported as headings with switching to lists for deeper structures.
> 
> 


[-- Attachment #2: Type: text/html, Size: 3360 bytes --]

^ permalink raw reply	[flat|nested] 5+ messages in thread

end of thread, other threads:[~2022-01-22 18:34 UTC | newest]

Thread overview: 5+ messages (download: mbox.gz / follow: Atom feed)
-- links below jump to the message on this page --
2022-01-20 14:33 Exporting Org file to Html with collapsable headings ZIPING CHEN
2022-01-21 12:23 ` Juan Manuel Macías
2022-01-21 16:46   ` Max Nikulin
2022-01-22 18:20     ` xincheng99
2022-01-21 20:18 ` Tim Cross

Code repositories for project(s) associated with this public inbox

	https://git.savannah.gnu.org/cgit/emacs/org-mode.git

This is a public inbox, see mirroring instructions
for how to clone and mirror all data and code used for this inbox;
as well as URLs for read-only IMAP folder(s) and NNTP newsgroup(s).