One Click to Auto Select Code from Blockquote in Blogger

One Click to Auto Select Code from Blockquote in Blogger


Blogger tutorial based site specially those who share codes in their Blog then must use blockquote. Generally main feature of blockquote is displaying the widget code within tag. We use different stylish blockquote in our site but often user has to select the whole code block top to bottom for copying. If the code is larger, then it will make little trouble for user. Because by using cursor sometimes mouse pointer become deselected.  So the solution is to one click text selection from blockquote by using mouse pointer. After that we have to use copy option for further use of code. But some users may feel irritating. Though this is very simple widget but very useful. For watching demo you can click on code block on this post. Just click on it and all code will be select instantly. Because your blog visitors and code users will feel comfortable to use it. For installing this feature please follow the below steps-

Step 1 Log in to your Blogger Account and Go to your Blogger Dashboard

Step 2 Click on Now click on -> Template -> Edit HTML

Step 3 Now find the </body> by pressing Ctrl+F (Windows) or CMD+F (Mac)  

Step 4 Copy the code from below and Paste the code above/before </body> 

<script type='text/javascript'>
var pres = document.getElementsByTagName(&quot;blockquote&quot;);
for (var i = 0; i &lt; pres.length; i++) {
pres[i].addEventListener(&quot;click&quot;, function () {
var selection = getSelection();
var range = document.createRange();
 }, false);

Step 5 Now simply hit the Save template Button. 


  • If you are using pre code instead of blockquote then replace blockquote with pre.
  • If you want double click to select text then replace click to dblclick.
That's it. Now you can check your blog and click on any code from block. And see all code block are select by one click. This really nice and user friendly for the Blog user. 
One Click to Auto Select Code from Blockquote in Blogger
4 Stars stars - "One Click to Auto Select Code from Blockquote in Blogger" Blogger tutorial based site specially those who share codes in their Blog then must use blockq...

Post a Comment

স্যার ব্লগের মোবাইল ?m=1 এ কি অ্যাড লাগানে যায় ।

Responsive template use korle othoba custom mobile template support korle AdSense show korbe.

ভাই আপনার POPULAR

এই গেজেট টা কোথায় পাবো ?

Nice post for blogger tips. You can get bd all internet offer news here

Ali vai..Ata ekta tab widget. Ami ekhono share kori nai. But simple ekta share korci. ooita try korte parben....Please nicher link theke tutorial ta follow koren.

Facebook Group Community Disqus Channel Code ConverterHide Code Converter Show EmoticonHide Emoticon

Got questions? Ask ’em below! While we’re here, you might like to give any feedback about this Post, Your comment inspire us to continuous Improvement of This Blog and Contents. Your words are your own, so be nice and helpful if you can. Please, only use your REAL NAME, not your business name or keywords. Using business name or keywords instead of your real name will lead to the comment being deleted. Anonymous commenting is not allowed either. Limit the amount of links submitted in your comment. We accept clean XHTML in comments, but don't overdo it please.

Make sure you tick the Notify Me box below the comment form to be notified of follow up comments and replies. Thank you for commenting

Contact Form


Email *

Message *