All directives

All directives

b-ber extends Markdown with custom directives that are based off the EPUB 3 Structural Semantics Vocabulary. We selected a sub-set of terms from that vocabulary that allows for a rich markup language that is still easily readable for writers and editors but contains the majority of structural elements required for a published work. In addition to the directives based off the EPUB 3 Semantic Vocabulary, and following the same principles of readability, we developed an additional set of directives for handling different media layouts and interactive paradigms.

Directives are broken down into three categories: block, inline, and miscellaneous. Information as well as supported attributes are listed below. The id attribute is required on all directives and immediately follows a colon after the directive name.

::: chapter:my-chapter-id

Some content

::: exit:my-chapter-id

Block directives

Block directives act as containers for other content and give the markup semantic structure. Block directives must be exited with an exit tag with the corresponding directive id.

Attributes

Attribute	Description
classes	A list of HTML classes
title	The section title

Directive names

frontmatter
halftitlepage
titlepage
dedication
epigraph
foreword
preface
acknowledgments
bodymatter
introduction
prologue
chapter
subchapter
epilogue
conclusion
part
volume
section
article
backmatter
afterword
loi
appendix
seriespage
credits
contributors
colophon

Example

::: chapter:chapter-one classes:"class-one class-two" title:"My First Chapter"

# Chapter One

::: exit:chapter-one

Inline directives

Inline directives are for presentational data like images, audio, and video. They are typically written on a single line, unless they support a caption. Each inline directive supports slightly different attributes.

Directive names

figure
figure-inline
video
video-inline
audio
audio-inline
iframe
iframe-inline
logo

Attributes

Figure and figure-inline

Attribute	Description
alt	Content for the image's alt attribute
caption	The image caption. Supports markdown
classes	A list of HTML classes
source	The relative path to the image

Audio, video, audio-inline and video-inline

Attribute	Description
source	The relative path to the media
poster	The relative path to the poster image
autoplay	See the HTML5 media attribute *
loop	See the HTML5 media attribute *
controls	See the HTML5 media attribute *
muted	See the HTML5 media attribute *
preload	See the HTML5 media attribute *
autobuffer	See the HTML5 media attribute *
buffered	See the HTML5 media attribute *
mozCurrentSampleOffset	See the HTML5 media attribute *
played	See the HTML5 media attribute *
volume	See the HTML5 media attribute *
crossorigin	See the HTML5 media attribute *

iframe, iframe-inline

Attribute	Description
title	Content for the iframe's alt attribute
caption	The iframe caption. Supports markdown
classes	A list of HTML classes
source	The online path to the iframe
poster	The relative path to the poster image
height	The height of the iframe
width	The width of the iframe

Logo

Attribute	Description
alt	Content for the image's alt attribute
source	The relative path to the image

Example

::: figure-inline:epigraph-image-one source:image-one.jpg
:: Caption for *image one*
::

::: video:video-one source:demo-video poster:square.jpg controls:yes
:: *Video* caption.
::

---

* For more information on HTML5 media attributes see MDN