New Shayari Status Copy Box Script For Blogger Website Copy Box Script For Blogger Website

 The Blogger Website Copy Box Script is a simple yet powerful tool that allows you to add a copy box to your blog.

1. Go to your blogger dashboard and click Edit HTML in the Theme panel and paste the below code after the </body> tag.

<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/js/materialize.min.js"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.4/clipboard.min.js"></script>

<script>

var clipboard = new ClipboardJS(".cbtn");

clipboard.on('success', function() {

M.toast({

html:"Copy Successfully",

classes:"green"

});

});

clipboard.on('error', function() {

M.toast({

html:"Copy error",

classes:"red"

});

});

</script>

2. After paste the below CSS code in between <style> or ]]></b:skin> the theme.

/* Code Box With Clipboard Button by gxfreee (My Hindi Articles.com) */

.r1 {text-align: left;height: auto;width: auto;padding-top: 10px;padding-bottom: 10px;padding-left: 20px;box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.12), 0 1px 5px 0 rgba(0, 0, 0, 0.2);border-radius: 0 0 4px 4px;}

.cbtn {color: #fff;background-color: #26a69a;letter-spacing: .5px;cursor: pointer;font-size: 14px;outline: 0;border: none;border-radius: 4px;line-height: 36px;padding: 0 16px;text-transform: uppercase;box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.12), 0 1px 5px 0 rgba(0, 0, 0, 0.2);font-weight: bold;}

.toast {height: auto;width: auto;background-color: #50A950;padding-top: 10px;padding-bottom: 10px;padding-left: 10px;padding-right: 10px;position: fixed;display: inline-block;color: white;margin-left: 50%;margin-top: 5%;border-radius: 5px;}

.c-box{position: relative;display: block;background-color: #1f2024;font-family: Monospace;font-size: 13px;color: #f2f2fa;white-space: pre-wrap;line-height: 1.4em;padding: 15px;margin: 0;border: 0;border-radius: 4px 4px 0 0;

}

3. After Saving your theme, then got to your blogger post editor and switch to HTML mode.

Use this shortcode to which place you need to insert the Code Box With Clipboard Button in any of your posts

<br>

<div class="c-box" id="content">Paste Your Code this area only

</div>

<div class="r1">

<button class="cbtn" data-clipboard-target="#content">Click Here to Copy</button>

</div>

<br>

Blogging has become a popular medium to express one's thoughts and share information with others.

With the rise of technology, creating a blog has become easier than ever before.

Blogging platforms like Blogger have made it possible for anyone to start a blog without any coding knowledge.

However, as a blogger, you want your blog to look unique and stand out from the rest.

One way to achieve this is by customizing your blog's design and layout. And this is where the Blogger Website Copy Box Script comes in.

The Blogger Website Copy Box Script Shayari Status Copy Box Script For Blogger Website is a simple yet powerful tool that allows you to add a copy box to your blog.

This copy box can be used to add code snippets, embed videos or images, and even add text that can be copied by your readers.