Copy button

 

If you want to add a copy button to your blog, you can use a code snippet to create the button and add it to your blog's HTML or JavaScript. Here's an example code snippet that you can modify to fit your blog's design:

<pre class="wp-block-code"><code><p id="text-to-copy">Hi My name is</p></code></pre>
 <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css" integrity="sha512-AUfjKk/IcMfMI4pjkZsJX9YB+TyyynYIwiz8yKRn2E/5tshcSLV7kO/mKv9Q7l37hPfO/s7RGD8r/VDl7HJ89g==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<button id="copy-button"><i class="fas fa-copy"></i>Copy</button>

<style>
button {
  padding: 10px 20px;
  background-color: #007bff;
  color: #fff;
  border: none;
  border-radius: 5px;
  cursor: pointer;
}

button:hover {
  background-color: #0069d9;
}

</style>

<script>
const copyButton = document.getElementById("copy-button");
const textToCopy = document.getElementById("text-to-copy");

copyButton.addEventListener("click", () => {
  navigator.clipboard.writeText(textToCopy.innerText).then(() => {
    alert("Text copied to clipboard!");
  });
});

</script>