llVn0YjMLG9Y1gAZwSUYezIfBPNnRB1JIi7LpqAJ

How to Disable the Right-Click Context Menu Using JavaScript

Protect your content! Learn how to disable the right-click context menu in Blogger using JavaScript with custom alert messages.
Javascript code on a monitor. Programming concept.
Image by Cadabra

Worried about people easily copying your blog content? One common method many bloggers use is disabling the browser’s right-click menu. While it won’t completely stop determined users, it can still discourage casual copying of text, images, and source code from your website.

I’ve personally used this JavaScript setup on some of my Blogger projects for years, and it adds a cleaner alert-style notification instead of the usual basic browser popup.

Before making any changes to your Blogger template, make sure to download a backup of your current theme first. That way, you can easily restore everything if something goes wrong during editing.

How to Disable Right-Click on Blogger

1. Sign in to your Blogger account.

2. At the upper left corner, click the blog selector and choose the blog you want to edit.

3. Go to Theme.

4. Click the small dropdown arrow beside CUSTOMIZE and select Edit HTML.

Step 1: Add the CSS Styling

Insert the CSS code below above ]]></b:skin>:

.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 $(main.color)}
.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:$(main.color);padding:5px 7px;color:#fff;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}}

Step 2: Add the Alert Notification Script

Insert the following code under <!-- Local Plugins --> or <body>

/*! Context Menu Alert */
function alertundefinedcontent){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'></span><div class='alert-content '\e004'>"+content+"</div><div class='c-timebar'><div class='c-timebar__remaining'></div></div></div></div>";$undefined'#Alert-Parent').htmlundefineda);var countdown;$undefined".alert").showundefinedresetCountdown).mousemoveundefinedresetCountdown);function resetCountdownundefined){clearTimeoutundefinedcountdown);countdown=setTimeoutundefinedfunctionundefined){$undefined'.alert').hideundefined)},5000)}}$undefined"<br/> + <br/>").nextundefined'<br/>').hideundefined);

Step 3: Add the Main Disable Script

Insert the script below under <!-- Theme Scripts --> or <body>

evalundefinedfunctionundefinedp,a,c,k,e,r){e=functionundefinedc){returnundefinedc<a?'':eundefinedparseIntundefinedc/a)))+undefinedundefinedc=c%a)>35?String.fromCharCodeundefinedc+29):c.toStringundefined36))};ifundefined!''.replaceundefined/^/,String)){whileundefinedc--)r[eundefinedc)]=k[c]||eundefinedc);k=[functionundefinede){return r[e]}];e=functionundefined){return'\\w+'};c=1};whileundefinedc--)ifundefinedk[c])p=p.replaceundefinednew RegExpundefined'\\b'+eundefinedc)+'\\b','g'),k[c]);return p}undefined'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 oundefinede){7 n;bundefinede.10)4 11!=undefinedn=6.c?6.c.12:e.13)&&14!=n&&15!=n&&16!=n&&17!=n&&18!=n&&19!=n&&1a!=n||undefined8undefinedm),!1)}3 pundefinede){7 n=e.1b.q,t=/1c/.rundefined9.s)&&/1d 1e/.rundefined9.1f);bundefined"u"!=undefinedn=n.vundefined))&&"w"!=n&&"x"!=n&&"y"!=n&&"z"!=n&&"A"!=n&&"B"!=n)4""!==a&&2==e.1g&&8undefineda),!!t}3 dundefined){7 e=6.c.1h.q;4"1i"==undefinede=e.vundefined))?undefined8undefinedi),!1):undefined"u"==e||"w"==e||"x"==e||"y"==e||"z"==e||"A"==e||"B"==e)&&f 0}3 Cundefined){4!0}3 Dundefinede){f 0!==e.g?e.g=d:f 0!==e.h.E?e.h.E="1j":e.F=3undefined){4!1},e.h.1k="1l"}5.1m=o,5.g=d,-1==9.s.1nundefined"1o")&&undefined5.F=p,5.1p=C),6.1q=3undefined){Dundefined5.1r)},5.1s=3undefined){4!1},5.1t=3undefinede){4 8undefinedk),!1};!3 tundefined){1u{!3 tundefinedn){1===undefined""+n/n).1v&&0!==n||3undefined){}.1wundefined"1x")undefined),tundefined++n)}undefined0)}1yundefinedn){1zundefinedt,1A)}}undefined);$undefined"1B").1Cundefined3undefined){4 1D});bundefined9.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|vandeweybalao|blogspot|com'.splitundefined'|'),0,{}));

Step 4: Add the Alert Container

Insert the code below between </head> and <body>

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

Step 5: Save Your Blogger Theme

Once everything has been added correctly, click Save Theme.

Your Blogger site should now disable right-click actions while also showing custom alert notifications.

Final Thoughts

Disabling right-click is not a perfect solution against content theft, but it can still discourage casual copying and make it slightly harder for visitors to quickly grab your text, images, or source code.

Just remember that adding too many restrictive scripts may sometimes affect user experience, so always test your website properly on both desktop and mobile devices after installing custom protections.

If you prefer a simpler setup, you can also check my previous guide here: Quick Guide: Disable Right-Click and Copying on Your Blogger Site.

Post a Comment
Please read our comment policy guidelines before posting.