Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Using an Image as a Link in AsciiDoc

I'm trying to create a "clickable" image in AsciiDoc lightweight markup language with Asciidoctor.

I tried the following (not working): image::<url1>[<url2>[]]

For example:

image::https://img.shields.io/badge/License-Apache%202.0-blue.svg[http://www.apache.org/licenses/LICENSE-2.0[]]

It should become roughly the following html:

<a href="http://www.apache.org/licenses/LICENSE-2.0"><img src="https://img.shields.io/badge/License-Apache%202.0-blue.svg"></a> 

How can I accomplish this in AsciiDoc without passing through raw HTML?

like image 251
CouchDeveloper Avatar asked Dec 15 '15 21:12

CouchDeveloper


People also ask

Can an image be used as a hyperlink?

To use image as a link in HTML, use the <img> tag as well as the <a> tag with the href attribute. The <img> tag is for using an image in a web page and the <a> tag is for adding a link. Under the image tag src attribute, add the URL of the image.

How do I associate an image with a link?

Copy the URL you want to link to your image. Drag-and-drop the image that you want to turn into a link into your template. Click the image to open the toolbar, then click the link icon and select "Web Page" from the drop-down. Paste the copied URL into the Link URL Field.


1 Answers

block:

image::https://img.shields.io/badge/License-Apache%202.0-blue.svg[link="http://www.apache.org/licenses/LICENSE-2.0"]

inline:

image:https://img.shields.io/badge/License-Apache%202.0-blue.svg[link="http://www.apache.org/licenses/LICENSE-2.0"]

Notice the link attribute on the image.

like image 111
LightGuard Avatar answered Sep 20 '22 10:09

LightGuard