A secure but flexible way to insert HTML tags into DokuWiki
This is an attempt to enable direct insertion of HTML tags in DokuWiki that is not reliant on the HTML option, which is no longer available in current versions of DokuWiki.
More information on the Plugin Page on DokuWiki.
The following HTML elements are added by this plugin (in alphabetic order):
<abbr>
– “Abbreviation”
<address>
– “Address”
<article>
– “Article”
<aside>
– “Aside”
<b>
– “Bring Attention To” (also known as “bold”)
<bdi>
– “Bidirectional Isolate” and <bdo>
– “Bidirectional Text Override”
<cite>
– “Citation”
<dfn>
– “Definition”
<dl>
– “Description list”, <dt>
– “Description term”, and <dd>
– “Description details”
<div>
– “Generic block”
<figure>
– “Figure” and <figcaption>
– “Figure caption”
<h1>
… <h6>
– “Section Heading Elements”
<i>
– “Idiomatic Text” (also known as “italic”)
<kbd>
– “Keyboard Input”
<mark>
— “Mark text”
<pre>
– “Preformatted Text”
<q>
– “Inline Quotation”
<s>
– “Strikethrough”
<samp>
– “Sample Output”
<section>
– “Section”
<small>
— “Side content” (smaller)
<span>
— “Content span”
<time>
– “Date/Time”
<u>
– “Unarticulated Annotation” (also known as “underline”)
<var>
– “Variable”
Please note that <div>
and <span>
are also handled by the Wrap Plugin and having them enabled while Wrap is also active can lead to unexpected results. If you need the attribute features of this plugin with these tags, it is better to disable Wrap, and possibly use Ad-Hoc Wrap instead as a replacement.
Instead of specifying the attributes in the HTML format, this plugin replicates and expands the formats used by the wrap plugin, which allows to specify the attributes as in the following example:
<tagname #tagid csswidth :lang &datetime classname classname2>
#tagid
– any valid HTML id, prefixed by a hash (#
) will be used as the element’s ID.
csswidth
– a valid width specification, as used by CSS (examples: 50%
, 24em
, 460px
, etc.).
Note: This option is still included for compatibility, but it is generally not recommended because it can cause layout issues on smaller screens (e.g. smartphones).
:lang
– a colon (:
), followed by a valid BCP47 language code. Examples: :en
, :fr-CH
, :grc-Latn
, etc. See also: “Declaring language in HTML”.
Note: this will also set the HTML dir
attribute: either by setting a language code that has a default RTL script, or by appending a script tag that refers to a RTL script (e.g. Arab
or Hebr
). The resulting text direction can still be overriden by the [dir=…]
attribute (see below)
"Title text"
– A string that is enclosed in double quotes will be rendered as title
.
classname
– anything that does matches a valid CSS class name (and none of the other formats) will be treated as a class name.
[name=value]
– extended format for all other allowed attributes. For example, [style=color:red]
, or [dir=ltr]
to override the text direction set by the :lang
attribute, etc.
Generally, attributes can appear in any order and are always optional!
If you previously used <html>
tags to embed HTML code into your DokuWiki site, you need to replace them with the format used by this plugin. The best way to get started is to make a run a couple of search-replace operations on the data/pages/
directory in your DokuWiki installation.
:bangbang: Important: It is advisable to run the following searches on a copy of this directory and also keep a backup of the original state, in case of problems that only show up later. The following search-replace operations can do serious damage to your site content. The autor does not take any responsibility for any damages that follow from applying this procedure: :bangbang:
:information_source: Tool: The autor has made good experiences with the Search-Replace function of Notepad++, an open-source, free and very powerful text editor for Windows. Other editors may of course also offer similar functionality.
1. Remove the \<html> tags
<html>
in default mode, replace with an empty string.</html>
in default mode, replace with an empty string.2. Remove the attribute name from title="…" attributes
title="
(note the space in front!) in standard mode, replace with "
(space + quotation mark)**3. Format the language specifications (if needed)
lang="([^\"]*)"
in regex mode (!), replace with :$1
(note: spaces in front of each!)4. Simplify any classes
class="([^\"]*)"
in regex mode (!), replace with $1
(note the spaces again!)In most cases, these should take care of the vast majority of HTML attributes. Make sure to check each file and clean up anything that these searches didn't catch.
If needed, similar searches can also be used for other attributes (e.g. style="([^\"]*)"
-> [style=$1]
for style), but it is probably a good idea to manually update these, rather than relying on automatisms.