# How to Add Inline Highlighting to Text

Inline highlighting works in the block editor or by wrapping a span around the text with a CSS class `has-inline-text`.

### Add Inline Highlighting in the Block Editor

Inline highlighting is very simple. Simply highlight some text in the block editor, and select **Inline Social Highlight** from the **More** context menu.

<figure><img src="https://219399540-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FII25Fu7h0q7vR3UqUhpk%2Fuploads%2FkhNY35KCNsJqvU4Q8uTJ%2Fhas-inline-highlighting-block-editor.gif?alt=media&#x26;token=8cb9daca-4b46-4bdb-a5b6-3657b7bd6a73" alt=""><figcaption><p>Select Inline Social Highlight to Highlight Text</p></figcaption></figure>

### Adding Inline Highlighting Via Code (HTML Attribute)

If you need to highlight text outside of the block editor, just wrap a `span` element around the text and give it a class of `has-inline-text`.

{% code title="Sample HTML code" overflow="wrap" %}

```html
<span class="has-inline-text">Text to Highlight</span>
```

{% endcode %}