Emacs: Insert HTML Tag
This page show you how to insert HTML tags.
Insert Html Tag
Alt+x html-mode
, then:
Tag | key | command name |
---|---|---|
<h1> | 【Ctrl+c 1】 | html-headline-1 |
<h2> | 【Ctrl+c 2】 | html-headline-2 |
<p> | 【Ctrl+c Enter】 | html-paragraph |
<hr> | 【Ctrl+c Ctrl+c -】 | html-horizontal-rule |
<ul> | 【Ctrl+c Ctrl+c u】 | html-unordered-list |
<li> | 【Ctrl+c Ctrl+c l】 | html-list-item |
For a complete list, Alt+x describe-mode
【Ctrl+h m】.
Insert Closing Tag
Alt+x sgml-close-tag
【Ctrl+c /】
Insert Custom Tag
Put this in your emacs init file:
(defun insert-p-tag () "Insert HTML markup <p></p>." (interactive) (insert "<p>\n</p>") (backward-char 5))
Select the above code, then Alt+x eval-region
. Then, Alt+x insert-p-tag
will insert your custom tag, and your cursor point will be placed in between the beginning and ending tags.
You should give it a key. [see Emacs: How to Define Keys]
You can edit above code so that it will insert any tag that you like.
If you have more than a few custom tags or templates, a better way to insert templates is abbrev mode.
[see Emacs: Abbrev Mode]
Wrap Tag Around the Word or Selection
Insert a Link
Alt+x html-href-anchor
【Ctrl+c Ctrl+c h】
→ Emacs will then ask you to type a URL, then insert it with the closing </a>
, with your cursor placed before the ending tag so that you can type the link text.
Alternatively, see:
Insert Img Tag
Alt+x html-image
【Ctrl+c Ctrl+c i】 then type the URL for the image.
Alternatively, see:
Emacs: HTML Image Path to Img Tag
Insert HTML Table
See Emacs: Lines to HTML Table
Emacs HTML Topic
Patreon me $5. Ask me question on patreon