I want my list to show up as:
1. Step 1
2. Step 2:
<table>
3. Step 3
but it shows up as:
1. Step 1
2. Step 2:
<table>
1. Step 3
Code:
# Step 1
# Step 2:
:: {| ... |}
# Step 3
Is it possible to continue numbering after inserting a table?
Yes, by using HTML markup, and the (strictly speaking deprecated reintroduced in HTML5) start attibute. The <ol> tag, and other list tags, are among the few allowed HTML tags in the MediaWiki default setup.
*Argentina
*Brazil
{|
...
|}
<ol start=3>
<li>China
<li>Denmark
<li>Egypt
</ol>
Or, as the TS points out, you can use HTML for the whole list, and insert the table inside the <li>:
<ol>
<li>Argentina
<li>Brazil
{|
<!-- insert table here -->
|}
</li><!-- Close this tag -->
<li>China
<li>Denmark
<li>Egypt
</ol>
Related
I would like to use a single footnote multiple times in HTML Quarto. The problem is that once I create a footnote and use it twice, it will be shown as two footnotes. Here is a reproducible example:
---
title: "Footnote multiple times"
editor: visual
format: html
---
Some example text for a footnote[^1].
Some example text for same footnote[^1].
[^1]: Example footnote.
Output:
As you can see, the footnote is shown as two separate footnotes (duplicated) while I created one footnote. So I was wondering if anyone knows how to create one footnote and use it multiple times in HTML Quarto?
We can sort of mimic how quarto would have generated the html code creating for footnotes to get similar appearances (that's why I have used r function so that I don't have to write the same thing multiple times).
---
title: "Footnote multiple times"
format: html
---
```{r}
#| echo: false
gen_fn <- function(n, id) {
# n is number of footnote
# id is a unique id for that footnote
paste0('<sup>', n, '</sup>')
}
```
Some example text for a footnote`r gen_fn(1, "fn1")`
Some example text for same footnote`r gen_fn(1, "fn1")`
Another text containing different footnotes`r gen_fn(2, "fn2")`
```{=html}
<footer>
<h2>Footnotes</h2>
<ol style="padding-left: 1rem;">
<li id="fn1"><p>Example footnote.</p></li>
<li id="fn2"><p>More footnote.</p></li>
</ol>
</footer>
```
I want to convert a markdown to HTML with header numbering, starting from <h2>.
What's the way to achieve it?
pandoc provides the option --number-sections (or -N) so headers are numbered in the output.
Now I am trying to convert markdown to HTML with this option.
In default, the output HTML header level of pandoc starts from <h1>. It is not ideal and so I want to change it to <h2> (whereas the original markdown may contain many first-level headers, the output HTML should contain at most 1 <h1>).
It is possible to specify --shift-heading-level-by=1; then, the output header level starts from <h2> (see Official Pandoc User's Guide and maybe also this question).
However, it would mess up the section-numbering! Basically, the level of the section numbering shifts, too. Now all sections are under "0" (like 0.1, 0.2, 0.2.1, …) and no sections of 1 exist.
pandoc provides another option --number-offset=1 but what it does is just offseting the numbers like "0.1"→"1.1". Then, all section numbers start from 1 with no sections numbered 2. Obviously, it makes no sense. The initial prefix number "1." is redundant and should be removed from all the section numbers like 1.1→1, 1.1.4→1.4, 1.2.3→2.3, etc.
For demonstration purposes, here is a sample markdown text file (abc.md)
%Test-md
# First Header (1) #
## Header (1-1) ##
# Second Header (2) #
## Header (2-2) ##
### Header (2-3) ###
and its output HTML (simplified) with
pandoc -N --section-divs --shift-heading-level-by=1 -t html5 abc.md
<section id="first-header-1" data-number="0.1">
<h2 data-number="0.1">0.1 First Header (1)</h2>
<section id="header-1-1" data-number="0.1.1">
<h3 data-number="0.1.1">0.1.1 Header (1-1)</h3>
</section>
</section>
<section id="second-header-2" data-number="0.2">
<h2 data-number="0.2">0.2 Second Header (2)</h2>
<section id="header-2-2" data-number="0.2.1">
<h3 data-number="0.2.1">0.2.1 Header (2-2)</h3>
<section id="header-2-3" data-number="0.2.1.1">
<h4 data-number="0.2.1.1">0.2.1.1 Header (2-3)</h4>
</section>
</section>
</section>
How can one make pandoc do the numbering in the ordinary way (1, 2, 2.1, 2.2, 2.2.1) yet output the HTML with the header level starting from <h2>?
Pandoc first shifts the headings, then does the numbering. This is not what we want here though, we'd like the numbering to happen first. A pandoc Lua filters can be used to take control of this.
The function pandoc.utils.make_sections performs the action that's triggered by passing --section-divs or --number-sections on the command line. Matching the effect of --shift-heading-level-by=1 is possible by modifying all Header elements manually:
function Pandoc (doc)
-- Create and number sections. Setting the first parameter to
-- `true` ensures that headings are numbered.
doc.blocks = pandoc.utils.make_sections(true, nil, doc.blocks)
-- Shift the heading levels by 1
doc.blocks = doc.blocks:walk {
Header = function (h)
h.level = h.level + 1
return h
end
}
-- Return the modified document
return doc
end
The filter would be used by saving it to a file shifted-numbered-headings.lua. It can then be passed to pandoc via the --lua-filter/-L parameter. The --number-sections/-N option must still be passed for the numbering to become visible, and --section-divs is still required to get <section> elements.
pandoc \
--lua-filter=shifted-numbered-headings.lua \
--number-sections \
--section-divs \
...
The class that pandoc sets on the <section> elements will always reflect the actual tagging level: the <section> that wraps an <h2> heading will have class="level2", even if, conceptually, it is a first level heading. This may be confusing and, unfortunately, cannot be changed with a filter.
So far, the easiest solution I have found is to make it in two steps. First, convert a markdown to HTML with no shift in the header levels. Then, convert the HTML to another HTML in which the header level is shifted by 1: <h1> → <h2>.
Here is an example code:
pandoc -N --section-divs -t html5 /tmp/try1.md |\
pandoc --from=html -t html5 --shift-heading-level-by=1 > output.html
Notice --from=html in the second pandoc -- it is necessary because otherwise pandoc would not know the file type of the streaming (pipe) input.
Here is the (simplified) output. There is now no redundant common prefix like "0." or "1." in the section-header numbers.
<section id="first-header-1" data-number="1">
<h2 data-number="1">1 First Header (1)</h2>
<section id="header-1-1" data-number="1.1">
<h3 data-number="1.1">1.1 Header (1-1)</h3>
</section>
</section>
<section id="second-header-2" data-number="2">
<h2 data-number="2">2 Second Header (2)</h2>
<section id="header-2-2" data-number="2.1">
<h3 data-number="2.1">2.1 Header (2-2)</h3>
<section id="header-2-3" data-number="2.1.1">
<h4 data-number="2.1.1">2.1.1 Header (2-3)</h4>
</section>
</section>
</section>
As a note, number-offset is irrelevant because it is to specify the numbering to start from a different number from the default 1 or 0 and does nothing with the section-numbering level.
setting up documentation for a plugin.
Can you add tables within a dd tag?
I tried the code below but it wont output as a table I tried with the double space line break technique but nothing either
This doesnt parse the table and just leaves the table syntax as is
Term
: definition
: | Table cell | Table cel | Table cell |
This wont render (note there are two spaces after definition)
Term
: definition
| Table cell | Table cel | Table cell |
my goal is this:
<dl>
<dt>Term</dt>
<dd>
definition
<table>
<!-- table rows and cells here -->
</table>
</dd>
</dl>
Depending on the Markdown implementation you are using either you can't or you need to do three things:
(1) Wrap your table with blank lines
A table is a block level element, just like a paragraph is. Therefore, it needs to be on a line by itself. To accomplish that, you need to include a blank line before the table. There is no need to add two spaces to the preceding line as the blank line already separates the elements and each block-level element will always be on its own line (barring some non-standard CSS which changes that behavior) .
(2) Indent your table
Of course, when you are nesting block level elements inside a list item and those elements do not start in the first line of the list item, you must indent those elements by one level to indicate they are nested. Therefore, the table must be indented by four spaces or one tab.
(3) Add a table header
Except for Kramdown, all implementations which support tables (that I am aware of) require the table to include a header. Otherwise, they do not recognize it as a table.
Example
Try this:
Term
: definition
| Header 1 | Header 2 | Header 3 |
| ---------- | --------- | ---------- |
| Table cell | Table cel | Table cell |
That said, both definition lists and tables are non-standard Markdown and their behavior varies among implementations which support them (not all do). Therefore, YMMV.
In fact, Babelmark demonstrates that the above works for Pandoc, RDiscount, PHP Markdown Extra, and MultiMarkdown (strangely version 5, but not version 6). Note that a few other implementations likely would work as well if they were properly configured. Babelmark only demonstrates default behavior for each implementation.
I have a HTML Table of Contents page containing list of book chapters with hyperlinks:
Multimedia Implementation<br/>
Table of Contents<br/>
About the Author<br/>
About the Technical Reviewers<br/>
Acknowledgments<br/>
Part I: Introduction and Overview<br/>
Chapter 1. Technical Overview<br/>
...
I want create NCX file for a Kindle book which must contain details as follows:
<navPoint id="n1" playOrder="1">
<navLabel>
<text>Multimedia Implementation</text>
</navLabel>
<content src="final/main.html"/>
</navPoint>
<navPoint id="n2" playOrder="2">
<navLabel>
<text>Table of Contents</text>
</navLabel>
<content src="final/toc.html"/>
</navPoint>
<navPoint id="n3" playOrder="3">
<navLabel>
<text>About the Author</text>
</navLabel>
<content src="final/pref01.html"/>
</navPoint>
...
I'm using Notepad++: is it possible automate this process with regular expression?
You cannot do everything using regex.. you can split the problem into two parts..
generate strings like <navPoint id="n1" playOrder="1"> using program logic (increment variable)
remaining you can do with regex
Use the following regex to match:
<a\shref="([^"]*)">([^<]*)<\/a><br\/>
And replace with:
(generated string)<navLabel>\n<text>\2</text>\n<content src="\1"/>\n</navPoint>
See DEMO
Yes, it is possibly to replace the links with <navpoint> tags. The only thing I found no solution for is the incremental numbering of the <navpoint> attributes id and playOrder...
The following regex will do most of the work:
/^<a[^>]*href="([^"]+)"[^>]*([^<]+).*$/gm
substitute with:
<navpoint id="n" playOrder="">\n<navLabel><text>$2</text></navLabel>\n<content src="$1" />\n</navpoint>\n
Regex details
/^<a .. only parse lines that start with an `<a` tag
.*href=" .. find the first occurance of `href="`
([^"]+) .. capture the text and stop when a " is found
"[^>]*> .. find the end of the <a> tag
([^<]+) .. capture the text and stop when a < is found (i.e. the </a> tag)
.*$/ .. continue to end of the line
gm .. search the whole string and parse each line individually
More detailled (but also more confusing) explanation is here:
https://regex101.com/r/gA0yJ2/1
This link also demonstrates how the regex is working. You can test changes there if you like
It's been a while since I've had to do any HTML-like code in Vim, but recently I came across this again. Say I'm writing some simple HTML:
<html><head><title>This is a title</title></head></html>
How do I write those closing tags for title, head and html down quickly? I feel like I'm missing some really simple way here that does not involve me going through writing them all down one by one.
Of course I can use CtrlP to autocomplete the individual tag names but what gets me on my laptop keyboard is actually getting the brackets and slash right.
I find using the xmledit plugin pretty useful. it adds two pieces of functionality:
When you open a tag (e.g. type <p>), it expands the tag as soon as you type the closing > into <p></p> and places the cursor inside the tag in insert mode.
If you then immediately type another > (e.g. you type <p>>), it expands that into
<p>
</p>
and places the cursor inside the tag, indented once, in insert mode.
The xml vim plugin adds code folding and nested tag matching to these features.
Of course, you don't have to worry about closing tags at all if you write your HTML content in Markdown and use %! to filter your Vim buffer through the Markdown processor of your choice :)
I like minimal things,
imap ,/ </<C-X><C-O>
I find it more convinient to make vim write both opening and closing tag for me, instead of just the closing one. You can use excellent ragtag plugin by Tim Pope. Usage looks like this (let | mark cursor position)
you type:
span|
press CTRL+x SPACE
and you get
<span>|</span>
You can also use CTRL+x ENTER instead of CTRL+x SPACE, and you get
<span>
|
</span>
Ragtag can do more than just it (eg. insert <%= stuff around this %> or DOCTYPE). You probably want to check out other plugins by author of ragtag, especially surround.
Check this out..
closetag.vim
Functions and mappings to close open HTML/XML tags
https://www.vim.org/scripts/script.php?script_id=13
I use something similar.
If you're doing anything elaborate, sparkup is very good.
An example from their site:
ul > li.item-$*3 expands to:
<ul>
<li class="item-1"></li>
<li class="item-2"></li>
<li class="item-3"></li>
</ul>
with a <C-e>.
To do the example given in the question,
html > head > title{This is a title}
yields
<html>
<head>
<title>This is a title</title>
</head>
</html>
There is also a zencoding vim plugin: https://github.com/mattn/zencoding-vim
tutorial: https://github.com/mattn/zencoding-vim/blob/master/TUTORIAL
Update: this now called Emmet: http://emmet.io/
An excerpt from the tutorial:
1. Expand Abbreviation
Type abbreviation as 'div>p#foo$*3>a' and type '<c-y>,'.
---------------------
<div>
<p id="foo1">
</p>
<p id="foo2">
</p>
<p id="foo3">
</p>
</div>
---------------------
2. Wrap with Abbreviation
Write as below.
---------------------
test1
test2
test3
---------------------
Then do visual select(line wize) and type '<c-y>,'.
If you request 'Tag:', then type 'ul>li*'.
---------------------
<ul>
<li>test1</li>
<li>test2</li>
<li>test3</li>
</ul>
---------------------
...
12. Make anchor from URL
Move cursor to URL
---------------------
http://www.google.com/
---------------------
Type '<c-y>a'
---------------------
Google
---------------------
Mapping
I like to have my block tags (as opposed to inline) closed immediately and with as simple a shortcut as possible (I like to avoid special keys like CTRL where possible, though I do use closetag.vim to close my inline tags.) I like to use this shortcut when starting blocks of tags (thanks to #kimilhee; this is a take-off of his answer):
inoremap ><Tab> ><Esc>F<lyt>o</<C-r>"><Esc>O<Space>
Sample usage
Type—
<p>[Tab]
Result—
<p>
|
</p>
where | indicates cursor position.
Explanation
inoremap means create the mapping in insert mode
><Tab> means a closing angle brackets and a tab character; this is what is matched
><Esc> means end the first tag and escape from insert into normal mode
F< means find the last opening angle bracket
l means move the cursor right one (don't copy the opening angle bracket)
yt> means yank from cursor position to up until before the next closing angle bracket (i.e. copy tags contents)
o</ means start new line in insert mode and add an opening angle bracket and slash
<C-r>" means paste in insert mode from the default register (")
><Esc> means close the closing tag and escape from insert mode
O<Space> means start a new line in insert mode above the cursor and insert a space
Check out vim-closetag
It's a really simple script (also available as a vundle plugin) that closes (X)HTML tags for you. From it's README:
If this is the current content:
<table|
Now you press >, the content will be:
<table>|</table>
And now if you press > again, the content will be:
<table>
|
</table>
Note: | is the cursor here
Here is yet another simple solution based on easily foundable Web writing:
Auto closing an HTML tag
:iabbrev </ </<C-X><C-O>
Turning completion on
autocmd FileType xml set omnifunc=xmlcomplete#CompleteTags
allml (now Ragtag ) and Omni-completion ( <C-X><C-O> )
doesn't work in a file like .py or .java.
if you want to close tag automatically in those file,
you can map like this.
imap <C-j> <ESC>F<lyt>$a</^R">
( ^R is Contrl+R : you can type like this Control+v and then Control+r )
(| is cursor position )
now if you type..
<p>abcde|
and type ^j
then it close the tag like this..
<p>abcde</p>|
Building off of the excellent answer by #KeithPinson (sorry, not enough reputation points to comment on your answer yet), this alternative will prevent the autocomplete from copying anything extra that might be inside the html tag (e.g. classes, ids, etc...) but should not be copied to the closing tag.
UPDATE I have updated my response to work with filename.html.erb files.
I noticed my original response didn't work in files commonly used in Rails views, like some_file.html.erb when I was using embedded ruby (e.g. <p>Year: <%= #year %><p>). The code below will work with .html.erb files.
inoremap ><Tab> ><Esc>?<[a-z]<CR>lyiwo</<C-r>"><Esc>O
Sample usage
Type:
<div class="foo">[Tab]
Result:
<div class="foo">
|
<div>
where | indicates cursor position
And as an example of adding the closing tag inline instead of block style:
inoremap ><Tab> ><Esc>?<[a-z]<CR>lyiwh/[^%]><CR>la</<C-r>"><Esc>F<i
Sample usage
Type:
<div class="foo">[Tab]
Result:
<div class="foo">|<div>
where | indicates cursor position
It's true that both of the above examples rely on >[Tab] to signal a closing tag (meaning you would have to choose either inline or block style). Personally, I use the block-style with >[Tab] and the inline-style with >>.