What tutorial do you want for the next article! Request Here!

How to Disable Context Menu Using JavaScript With Alert Notification

Guide to installing Disable Context Menu Using JavaScript With Alert Notification on blogger template
Please wait 0 seconds...
Scroll Down and click on Go to Link for destination
Congrats! Link is Generated
How to Disable Context Menu Using JavaScript With Alert Notification
Disable Context Menu With Alert Notification

It's very annoying when someone else copies your article and doesn't even take your permission and doesn't give you any credit. If you want to protect your content from being copied, then this article will be very beneficial for you because in this post, We're going to guide you step by step how to Disable Context Menu Using JavaScript With Alert Notification

Disabling right-click, copy and paste or context menu is one of the most popular trick for stopping thieves from stealing blog content.

Without further ado, below is the practical guide on how to disable right-click or context menu using JavaScript with alert messages in Blogger or Blogspot. But, before anything else it is a good practice to always download a backup of your Blogger Theme this way you can easily restore your theme in case something went wrong.

Live Demo

How to Add Disable Context Menu with Alert Notification Timebar

Step 1: On Blogger dashboard, click Theme

Step 2: Click the arrow down icon next to 'customize' button

Step 3: Click Edit HTML you will be directed to editing page

Step 4: Find </style> or ]]></b:skin> tag, for a faster search press shortcut key Ctrl + F

Step 5: Copy below CSS code and paste just right above </style> or ]]></b:skin>

/*-- Material Icons Font --*/
@font-face{font-family:"Material Icons Round";font-display:swap;font-style:normal;font-weight:400;src:url(https://fonts.gstatic.com/s/materialiconsround/v65/LDItaoyNOAY6Uewc665JcIzCKsKc_M9flwmP.woff2) format("woff2")}.mir{font-family:"Material Icons Round";font-weight:400;font-style:normal;font-size:24px;line-height:1;letter-spacing:normal;text-transform:none;display:inline-block;white-space:nowrap;word-wrap:normal;direction:ltr;-webkit-font-feature-settings:liga;-webkit-font-smoothing:antialiased}
/*-- Alert Message Timebar by thewebtrick.com --*/
.alert{position:fixed;bottom:20px;right:20px;z-index:999999;width:auto;max-width:400px;margin:0 0 0 20px;background-color:rgba(0,0,0,.7);border-radius:4px;color:#fff;box-shadow:1px 7px 14px -5px rgba(0,0,0,.2);border-left:3px solid #ffffff}
.alert-main{text-align:left;padding:21px 0;padding-left:70px;padding-right:60px}
.alert-close{float:right;position:absolute;top:8px;right:10px;cursor:pointer;font-size:18px}
.alert-close:before{content:'\e5c9';font-family:'Material Icons Round'}
.alert-icon{background-color:#ffffff;padding:5px 7px;color:#ffd929;border-radius:50%;font-size:18px;position:absolute;left:40px;top:50%;transform:translate(-50%,-50%)}
.alert-icon:before{content:'\e004';font-family:'Material Icons Round'}
.c-timebar{width:100%;height:2px;position:absolute;bottom:0;left:0}
.c-timebar__remaining{width:100%;height:100%;position:absolute;left:0;top:0;border-radius:5px;background:rgba(255,255,255,1);z-index:2;transform-origin:0 0;animation:timebar_progress;animation-duration:5s;animation-timing-function:linear}
.alert:hover .c-timebar__remaining{animation-play-state:paused}@keyframes timebar_progress{from{transform:scaleX(1)}to{transform:scaleX(0);background:transparent}}

Note:
In the mark section you can change the color of the icon and width of the widget as you wish.

Step 6: Add below script above </head> or </body>

<script type='text/javascript'>
//<![CDATA[/*! Context Menu Alert */
function alert(content){var a="<div class='alert'><span class='alert-close \e5c9' onclick='this.parentElement.style.display=&quot;none&quot;'></span><div class='alert-main'><span class='alert-icon \e004'></span><div class='alert-content'>"+content+"</div><div class='c-timebar'><div class='c-timebar__remaining'></div></div></div></div>";$('#Alert-Parent').html(a);var countdown;$(".alert").show(resetCountdown).mousemove(resetCountdown);function resetCountdown(){clearTimeout(countdown);countdown=setTimeout(function(){$('.alert').hide()},5000)}}$("<br/> + <br/>").next('<br/>').hide();
//]]></script>

Step 7: Next search <body> tag and copy and paste below script above<body>

<script type='text/javascript'>
//<![CDATA[eval(function(p,a,c,k,e,r){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--)r[e(c)]=k[c]||e(c);k=[function(e){return r[e]}];e=function(){return'\\w+'};c=1};while(c--)if(k[c])p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c]);return p}('7 i="j G H I J!",k="K L M!",a="N l & O l P Q.",m="j R S T U V W X Y Z";3 o(e){7 n;b(e.10)4 11!=(n=6.c?6.c.12:e.13)&&14!=n&&15!=n&&16!=n&&17!=n&&18!=n&&19!=n&&1a!=n||(8(m),!1)}3 p(e){7 n=e.1b.q,t=/1c/.r(9.s)&&/1d 1e/.r(9.1f);b("u"!=(n=n.v())&&"w"!=n&&"x"!=n&&"y"!=n&&"z"!=n&&"A"!=n&&"B"!=n)4""!==a&&2==e.1g&&8(a),!!t}3 d(){7 e=6.c.1h.q;4"1i"==(e=e.v())?(8(i),!1):("u"==e||"w"==e||"x"==e||"y"==e||"z"==e||"A"==e||"B"==e)&&f 0}3 C(){4!0}3 D(e){f 0!==e.g?e.g=d:f 0!==e.h.E?e.h.E="1j":e.F=3(){4!1},e.h.1k="1l"}5.1m=o,5.g=d,-1==9.s.1n("1o")&&(5.F=p,5.1p=C),6.1q=3(){D(5.1r)},5.1s=3(){4!1},5.1t=3(e){4 8(k),!1};!3 t(){1u{!3 t(n){1===(""+n/n).1v&&0!==n||3(){}.1w("1x")(),t(++n)}(0)}1y(n){1z(t,1A)}}();$("1B").1C(3(){4 1D});b(9.1E!=1F){6.1G.1H="1I://1J.1K.1L"}',62,110,'|||function|return|document|window|var|alert|navigator|smessage|if|event|disable_copy_ie||void|onselectstart|style|image_save_msg|You|no_menu_msg|Click|keypressmessage||disableEnterKey|disable_copy|nodeName|test|userAgent||TEXT|toUpperCase|TEXTAREA|INPUT|PASSWORD|SELECT|OPTION|EMBED|reEnable|disableSelection|MozUserSelect|onmousedown|Can|Not|Save|images|Context|Menu|Disabled|Double|Long|is|Disabled|Are|Not|Allowed|to|Copy|Content|or|View|Source|ctrlKey|97|keyCode|which|73|99|120|26|85|83|43|target|Safari|Apple|Computer|vendor|detail|srcElement|IMG|none|cursor|default|onkeydown|indexOf|MSIE|onclick|onload|body|ondragstart|oncontextmenu|try|length|constructor|debugger|catch|setTimeout|5e3|img|mousedown|false|onLine|true|location|href|https|thewebtrick|com'.split('|'),0,{}));
//]]></script>

Step 8: To show the alert messages insert the below script above</head>

<div id='Alert-Parent'>
</div>

Note:
If alert timebar message not visible then paste above code between <head> and <body>

Step 9: Save your theme by clicking this icon.

That's all. Happy Blogging!

This is all about how to disable copy paste in blogger. We hope this article has been very useful for deactivating copy paste on your blog and protecting your content from being copied. If you have any question or doubt then let us know in the comment.

You May Like These Posts:

إرسال تعليق

To avoid SPAM comments, all comments will be moderated before being displayed.
Cookie Consent
We serve cookies on this site to analyze traffic, remember your preferences, and optimize your experience.
Oops!
It seems there is something wrong with your internet connection. Please connect to the internet and start browsing again.
AdBlock Detected!
We have detected that you are using adblocking plugin in your browser.
The revenue we earn by the advertisements is used to manage this website, we request you to whitelist our website in your adblocking plugin.
Site is Blocked
Sorry! This site is not available in your country.