Add a "Copy Code" Button in the Divi Code Snippet Module


The Divi Code Snippet module lets you display syntax highlighted source code within your Divi Builder pages. If you'd like to include a "Copy Code to Clipboard" button to allow users to quickly and easily copy your code samples, you can do it by setting:

Code Snippet Settings > Code Snippet > Copy-to-Clipboard Button = Yes

Like so:

You can optional also set the tooltip text displayed when the user hovers over the copy-to-clipboard button. 

Here's how the copy button looks on the front-end (with hover tooltip shown):

Add Text Next to the Copy-to-Clipboard Button

If you'd like to add text next to the button, you can do so with some CSS like so:

.dbcs-clipboard-button:after {
    content: 'Copy';
    font-family: arial;
    margin-left: 10px;


Submit a Comment

Comments are manually moderated and approved at the time they are answered. A preview is shown while pending but may disappear if your are cookies cleared - don't worry though, the comment is still in the queue.

Your email address will not be published. Required fields are marked *.

We may earn a commission when you visit links on our website.