Wikia

Vim Tips Wiki

Changes: Make an HTML anchor and href tag

Edit

Back to page

(use shellescape; show use of curl, lynx)
(Change <tt> to <code>, perhaps also minor tweak.)
 
Line 39: Line 39:
 
</pre>
 
</pre>
   
You are prompted to enter the <tt>URL</tt> and <tt>TARGET</tt>. The script automatically determines <tt>PAGE&nbsp;TITLE</tt> by reading the HTML source from the website at URL.
+
You are prompted to enter the <code>URL</code> and <code>TARGET</code>. The script automatically determines <code>PAGE TITLE</code> by reading the HTML source from the website at URL.
   
When you are prompted to enter text, the normal command line shortcuts are available. For example, press Ctrl-R then <tt>+</tt> to insert the contents of the clipboard, or press the Up arrow key to scroll through the input history.
+
When you are prompted to enter text, the normal command line shortcuts are available. For example, press Ctrl-R then <code>+</code> to insert the contents of the clipboard, or press the Up arrow key to scroll through the input history.
   
Assuming the default backslash leader key, you would type <tt>\al</tt> to add a link. You are prompted to enter the URL, and the target; if no target is entered, the link will not include a target field. The link is inserted after the line containing the cursor.
+
Assuming the default backslash leader key, you would type <code>\al</code> to add a link. You are prompted to enter the URL, and the target; if no target is entered, the link will not include a target field. The link is inserted after the line containing the cursor.
 
<pre>
 
<pre>
 
" Prompt user to enter URL and optional TARGET.
 
" Prompt user to enter URL and optional TARGET.
Line 71: Line 71:
   
 
===Alternative tools===
 
===Alternative tools===
The script above includes this line which assumes you have [[wikipedia:Wget|<tt>wget</tt>]] installed (<tt>-q</tt> is quiet, and <tt>-O&nbsp;-</tt> outputs to stdout):
+
The script above includes this line which assumes you have [[wikipedia:Wget|<code>wget</code>]] installed (<code>-q</code> is quiet, and <code>-O -</code> outputs to stdout):
 
<pre>
 
<pre>
 
let html = system('wget -q -O - ' . shellescape(url))
 
let html = system('wget -q -O - ' . shellescape(url))
 
</pre>
 
</pre>
   
An alternative to <tt>wget</tt> would be to use the following if you have [[wikipedia:cURL|<tt>curl</tt>]] (<tt>-s</tt> is silent):
+
An alternative to <code>wget</code> would be to use the following if you have [[wikipedia:cURL|<code>curl</code>]] (<code>-s</code> is silent):
 
<pre>
 
<pre>
 
let html = system('curl -s ' . shellescape(url))
 
let html = system('curl -s ' . shellescape(url))
 
</pre>
 
</pre>
   
Or use the following if you have [[wikipedia:Lynx (web browser)|<tt>lynx</tt>]] (<tt>-source</tt> outputs the source rather than a text rendering of the html):
+
Or use the following if you have [[wikipedia:Lynx (web browser)|<code>lynx</code>]] (<code>-source</code> outputs the source rather than a text rendering of the html):
 
<pre>
 
<pre>
 
let html = system('lynx -source ' . shellescape(url))
 
let html = system('lynx -source ' . shellescape(url))

Latest revision as of 06:11, July 13, 2012

Tip 1178 Printable Monobook Previous Next

created 2006 · complexity basic · author Gerhard Siegesmund · version 6.0


When editing HTML pages or blog entries, you may need to enter an HTML link. This tip show a simple mapping to manually make a link from a URL and a page title. An alternative uses a script to automatically read the title by getting and parsing the HTML source from the website identified by the URL.

Manually making a linkEdit

Suppose you have some lines like this:

This identifies a website:
http://www.example.com
The Example Site

With the mapping below, you can move the cursor to anywhere in the second line (the target URL), then press F7 to convert the text to:

This identifies a website:
<a href="http://www.example.com">The Example Site</a>

The mapping for your vimrc is:

" Convert two lines (URL then TITLE) to one line: <a href=URL>TITLE</a>
map <F7> <Esc>I<a href="<Esc>A"><Esc>gJA</a><Esc>

Automatically determining the titleEdit

With the following script in your vimrc, you can easily insert a link looking like this:

<a href="URL" target="TARGET">PAGE TITLE</a>

You are prompted to enter the URL and TARGET. The script automatically determines PAGE TITLE by reading the HTML source from the website at URL.

When you are prompted to enter text, the normal command line shortcuts are available. For example, press Ctrl-R then + to insert the contents of the clipboard, or press the Up arrow key to scroll through the input history.

Assuming the default backslash leader key, you would type \al to add a link. You are prompted to enter the URL, and the target; if no target is entered, the link will not include a target field. The link is inserted after the line containing the cursor.

" Prompt user to enter URL and optional TARGET.
" Inserts an html link: a line after the cursor like
"   <a href="URL" target="TARGET">Page title</a>
" where 'Page title' is determined from the html source read from URL.
" Requires wget (or similar) tool to get source.
nnoremap <Leader>al :call AddLink()<CR>
function! AddLink()
  let url = input('URL to add? ')
  if empty(url)
    return
  endif
  let target = input('Target for this link? ')
  if !empty(target)
    let target = ' target="' . target . '"'
  endif
  let html = system('wget -q -O - ' . shellescape(url))
  let regex = '\c.*head.*<title[^>]*>\_s*\zs.\{-}\ze\_s*<\/title>'
  let title = substitute(matchstr(html, regex), "\n", ' ', 'g')
  if empty(title)
    let title = 'Unknown'
  endif
  put ='<a href=\"' . url . '\"' . target . '>' . title . '</a>'
endfunction

Alternative toolsEdit

The script above includes this line which assumes you have wget installed (-q is quiet, and -O - outputs to stdout):

  let html = system('wget -q -O - ' . shellescape(url))

An alternative to wget would be to use the following if you have curl (-s is silent):

  let html = system('curl -s ' . shellescape(url))

Or use the following if you have lynx (-source outputs the source rather than a text rendering of the html):

  let html = system('lynx -source ' . shellescape(url))

CommentsEdit

Around Wikia's network

Random Wiki