Emacs: Insert HTML Tag

By Xah Lee. Date: . Last updated: .

This page show you how to insert HTML tags.

Insert Html Tag

Alt+x html-mode, then:

Tagkeycommand name
<h1>Ctrl+c 1html-headline-1
<h2>Ctrl+c 2html-headline-2
<p>Ctrl+c Enterhtml-paragraph
<hr>Ctrl+c Ctrl+c -html-horizontal-rule
<ul>Ctrl+c Ctrl+c uhtml-unordered-list
<li>Ctrl+c Ctrl+c lhtml-list-item

For a complete list, Alt+x describe-modeCtrl+h m】.

Insert Closing Tag

Alt+x sgml-close-tagCtrl+c /

Insert Custom Tag

Put this in your emacs init file:

(defun insert-p-tag ()
  "Insert HTML markup <p></p>."
  (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

Emacs: Wrap HTML Tags

Insert a Link

Alt+x html-href-anchorCtrl+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:

Emacs: URL to Link Command

Insert Img Tag

Alt+x html-imageCtrl+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

  1. Emacs HTML Tips
  2. Emacs: Xah HTML Mode
  3. Emacs: Insert HTML Tag
  4. Emacs: URL to Link Command
  5. Elisp: Replace HTML Entities
  6. Emacs: CSS Compressor
  7. Emacs: Working with CSS Color Values
  8. Emacs: View Image Thumbnails
  9. Emacs: HTML Image Path to Img Tag
  10. Emacs: Convert Image Files in Dired
Patreon me $5 patreon

Or Buy Xah Emacs Tutorial

Or buy a nice keyboard: Best Keyboard for Emacs

Patreon me $5. Ask me question on patreon