---
title: "How to Add Download Button in Syntax/Code Highlighter in Elementor?"
url: https://theplusaddons.com/docs/add-download-button-in-code-highlighter-in-elementor/
date: 2024-03-15
modified: 2026-04-09
lang: en
author: "Aditya Sharma"
description: "With The Plus addon for Elementor’s Syntax Highlighter, you can add a download button to your code highlighter in Elementor, you are not only enhancing the visual appeal of your..."
image: https://theplusaddons.com/wp-content/uploads/2024/03/Code-Highlighter-in-Elementor_-1024x536.jpg
word_count: 200
---

# How to Add Download Button in Syntax/Code Highlighter in Elementor?

## 

- Adds a download button to the Syntax Highlighter widget in The Plus Addons for Elementor.
- Enables users to easily download code snippets by toggling the Download Button option.
- Requires installation and activation of The Plus Addons for Elementor to utilize the Syntax Highlighter features.

With The Plus addon for Elementor’s Syntax Highlighter, you can add a download button to your code highlighter in Elementor, you are not only enhancing the visual appeal of your website but also providing your visitors with a simple and efficient way to access and download your code snippets.

*To check the complete feature overview documentation of The Plus Addons for Elementor Syntax Highlighter widget, [click here.](https://theplusaddons.com/docs//syntax-highlighter-settings-overview/)*

***Requirement  - This widget is a part of The Plus Addons for Elementor, make sure it's installed & activated to enjoy all its powers.***

[LIVE WIDGET LINK](https://theplusaddons.com/elementor-widget/elementor-syntax-highlighter/?utm_source=tpae&utm_medium=docs&utm_campaign=text)

To do this, add the Syntax Highlighter widget to the page and follow the steps - 

1. Select the appropriate language from the **Language** dropdown.

2. In the **Source Code **field, you have to add the source code.

![Download Button in Syntax highlighter](https://theplusaddons.com/wp-content/uploads/2024/03/Download-Button-in-Syntax-highlighter.gif)

3. Enable the **Download Button** toggle.

From the **Button Icon**, you can add an image to the button.

4. Then you have to add the file URL with the code in the **Link** field.

Now, you will have a download button in your syntax highlighter which the user can use to easily download the code.

![Download Button in Syntax highlighter Demo](https://theplusaddons.com/wp-content/uploads/2024/03/Download-Button-in-Syntax-highlighter-Demo.gif)

***Suggested Read: ***[*How to Highlight any Specific Line in Syntax Highlight in Elementor*.](https://theplusaddons.com/docs//highlight-any-specific-line-in-syntax-highlight-in-elementor/)