Ever worry about someone just lifting your hard work? One of the easiest ways to slow down content theft is by disabling the right-click menu. It’s not a 100% fix, but it definitely makes it harder for someone to grab your text and images in a single click.
I’ve used a specific piece of JavaScript for years to handle this on my websites, and today I'm sharing that exact code with you. It’s easy to implement on Blogger and even includes a custom alert. Just make sure you download a backup your Blogger Theme before you start. It’s always better to have a restore point if things don’t go quite as planned!
1. Sign in to Blogger.
2. At the top left, click the Down arrow and choose a blog to update.
3. Click Theme.
4. After clicking the theme, click the down arrow at the right side of "CUSTOMIZE" and click Edit HTML.
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}}Insert the code below 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="none"'></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);Insert the below script 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,{}));To show the messages insert the below script between </head> and <body>
<div id='Alert-Parent'>
</div>5. Save your theme.
That covers everything for this setup. Happy Blogging!
If this method isn't exactly what you’re looking for, feel free to check out some of the other tricks I shared in my previous post, Quick Guide: Disable Right-Click and Copying on Your Blogger Site.
