DZone
Thanks for visiting DZone today,
Edit Profile
  • Manage Email Subscriptions
  • How to Post to DZone
  • Article Submission Guidelines
Sign Out View Profile
  • Post an Article
  • Manage My Drafts
Over 2 million developers have joined DZone.
Log In / Join
Refcards Trend Reports
Events Video Library
Refcards
Trend Reports

Events

View Events Video Library

Zones

Culture and Methodologies Agile Career Development Methodologies Team Management
Data Engineering AI/ML Big Data Data Databases IoT
Software Design and Architecture Cloud Architecture Containers Integration Microservices Performance Security
Coding Frameworks Java JavaScript Languages Tools
Testing, Deployment, and Maintenance Deployment DevOps and CI/CD Maintenance Monitoring and Observability Testing, Tools, and Frameworks
Culture and Methodologies
Agile Career Development Methodologies Team Management
Data Engineering
AI/ML Big Data Data Databases IoT
Software Design and Architecture
Cloud Architecture Containers Integration Microservices Performance Security
Coding
Frameworks Java JavaScript Languages Tools
Testing, Deployment, and Maintenance
Deployment DevOps and CI/CD Maintenance Monitoring and Observability Testing, Tools, and Frameworks

Generative AI has transformed nearly every industry. How can you leverage GenAI to improve your productivity and efficiency?

SBOMs are essential to circumventing software supply chain attacks, and they provide visibility into various software components.

Related

  • Java EE 6 Pet Catalog with GlassFish and MySQL
  • 8 Awesome Source Code Management Tools to Keep In Check
  • Build Your Own Shopping Cart With React Hooks
  • Virtual Reality and Augmented Reality in the Browser

Trending

  • Spring Cloud LoadBalancer vs Netflix Ribbon
  • Leveraging AI: A Path to Senior Engineering Positions
  • Deploy Serverless Lambdas Confidently Using Canary
  • Top NoSQL Databases and Use Cases

Awesome Asciidoctor: Highlight Lines in Source Code Listings

In Asciidoctor, we are able to configure syntax highlighting for our source code listings. In this post, we see how to use the line highlighting feature in Asciidoctor.

By 
Hubert Klein Ikkink user avatar
Hubert Klein Ikkink
·
Oct. 06, 16 · Tutorial
Likes (1)
Comment
Save
Tweet
Share
5.1K Views

Join the DZone community and get the full member experience.

Join For Free

In Asciidoctor, we are able to configure syntax highlighting for our source code listings. We can choose from the built-in support for Coderay, Pygments, highlight.js, and prettify. The syntax highlighter libraries Coderay and Pygments support extra highlighting of lines. Because of this, we are able to add extra attention to those lines. In this post, we will see how we can use the line highlighting feature in Asciidoctor.

First of all, we must add the document attribute source-highlighter and use the value coderay or pygments. When we use Coderay, we must also enable the line numbers for the source code listing. This is because Coderay will highlight the line numbers in the output. Pygments highlight the whole line, with or without line numbers in the output. Therefore, we will choose Pygments in our example. To highlight certain lines in the source code output, we will use the highlight attribute for the source code block. We are able to specify single line numbers separated by a comma (,) or semi-colon (;). If we use a comma, then we must enclose the value of the highlight attribute in quotes. To define a range of line numbers, we can define the start and end line numbers by putting a hyphen in between (i.e., 5-10 to highlight lines 5 to 10). To unhighlight a line, we must prefix it with an exclamation mark (!). For example, the following value for the highlight attribute highlights the lines 2, 3 to 7, and not 5: [source,highlight=1;3-7;!5].

In the following example markup, we have a source code block where we highlight the lines 7 to 9. We will use Pygments as the syntax highlighter:

= Source highlight lines
:source-highlighter: pygments
:pygments-style: emacs
:icons: font
 
== Creating an application
 
To create a simple Ratpack application we write
the following code:
 
.Simple Groovy Ratpack application
[source,groovy,linenums,highlight='7-9']
----
package com.mrhaki
 
import static ratpack.groovy.Groovy.ratpack
 
ratpack {
    handlers {
        get {
            render "Hello World!" // <1>
        }
    }
}
----
<1> Render output

If we look at the generated HTML, then we can see that lines 7, 8 and 9 are differently styled:

Image title

Written with Asciidoctor 1.5.4.

Listing (computer) Awesome (window manager)

Published at DZone with permission of Hubert Klein Ikkink, DZone MVB. See the original article here.

Opinions expressed by DZone contributors are their own.

Related

  • Java EE 6 Pet Catalog with GlassFish and MySQL
  • 8 Awesome Source Code Management Tools to Keep In Check
  • Build Your Own Shopping Cart With React Hooks
  • Virtual Reality and Augmented Reality in the Browser

Partner Resources

×

Comments

The likes didn't load as expected. Please refresh the page and try again.

ABOUT US

  • About DZone
  • Support and feedback
  • Community research
  • Sitemap

ADVERTISE

  • Advertise with DZone

CONTRIBUTE ON DZONE

  • Article Submission Guidelines
  • Become a Contributor
  • Core Program
  • Visit the Writers' Zone

LEGAL

  • Terms of Service
  • Privacy Policy

CONTACT US

  • 3343 Perimeter Hill Drive
  • Suite 100
  • Nashville, TN 37211
  • [email protected]

Let's be friends: