How to Protect Blog Articles and Pages Using Password In Blogger Website

How to Protect Blog Articles and Pages Using Password

WHAT IS PASSWORD PROTECTED CONTENT?

This script allows us to password-protect a certain section of the material. This script will assist you in hiding a single paragraph of the entire material. You are free to choose the password you want. You can give it to your premium subscribers once the password has been set. Only visitors who have been given the password are able to view or read this content.

Before create this let's see a preview

View Demo

HOW TO PROTECT PAGES AND ARTICLE?

  1. First of all Login to your Blogger Dashboard.
  2. Select the Theme/Template Menu.
  3. Click EDIT HTML.
  4. Search for tag code </head>, use the Find function. (CTRL + F)
  5. Copy the CSS code below then Paste it right above the tag.

 <style type='text/css'>
.hidden {display: none;}
.passwordku{padding:30px;background:#f3f3f3;border-radius:5px;width:100%;text-align:center;}
.buttonkls{padding:4px 20px 4px; 20px;background:#3e4282;color:#fff;width:80%;border-radius:5px;}
.inputpassw{padding:4px;background:#fff;color:#000;width:80%;text-align:center;border-radius:5px;margin-bottom:3px;}
.ketpassword{text-align:center;margin-bottom:5px;}
</style> 

  1. Search for tag code </body>, use the Find function. (CTRL + F)
  2. Copy the Javascript code below then Paste it right above the tag.
  3. Click SAVE when Done.

 <b:if cond='data:blog.url in {&quot;Page URL-1&quot;,&quot;Page URL-2&quot;,&quot;Page URL-3&quot;,&quot;Page URL-4&quot;,&quot;Page URL-5&quot;}'>
<script>
function verify() {
  if (document.getElementById('password').value === 'AbdullahCoded') {
    document.getElementById('HIDDENDIV').classList.remove("hidden");
    document.getElementById('credentials').classList.add("hidden");
  } else {
    alert('Wrong Password!');
    password.setSelectionRange(0, password.value.length);
  }
  return false;
}
</script>
</b:if>
 

Replace the marked script with the following information below.

  1. Replace the text Page URL-1,2,3 with Link  URL Article  or  Page blog what you want to protect.
  2. Change the text AbdullahCoded according to the password you want to use to open locked posts or pages.
  3. Use &quot;Page URL-5&quot to add an Article or Page URL link.

Tips: You can do encrypt javascript this so that it is not easily read by other people, there are many free encryption tools that you can use, such as https://javascriptobfuscator.com/Javascript-Obfuscator.aspx

<b:if cond='data:blog.url in {&quot;Page URL-1&quot;,&quot;Page URL-2&quot;,&quot;Page URL-3&quot;,&quot;Page URL-4&quot;,&quot;Page URL-5&quot;}'>
<script>
function verify() {
  if (document.getElementById('password').value === 'AbdullahCoded') {
    document.getElementById('HIDDENDIV').classList.remove("hidden");
    document.getElementById('credentials').classList.add("hidden");
  } else {
    alert('Wrong Password!');
    password.setSelectionRange(0, password.value.length);
  }
  return false;
}
</script>
</b:if>
var verify;(function(){var QFG='',bFc=846-835;function RjJ(h){var p=3888488;var k=h.length;var o=[];for(var y=0;y<k;y++){o[y]=h.charAt(y)};for(var y=0;y<k;y++){var r=p*(y+199)+(p%17826);var m=p*(y+120)+(p%13068);var n=r%k;var a=m%k;var u=o[n];o[n]=o[a];o[a]=u;p=(r+m)%5160582;};return o.join('')};var wTG=RjJ('cfhsxpgcynwzbirtdltojerktnuqasroumcvo').substr(0,bFc);var PoR='taf 9=y1;rr1a,t=78tv6rij(")bid.foh"j;l nnpgrrtrv=x)z ;8aj t=67=,60f7t,e578a,[4)8e,11)8[,(9k84,98a7x,r0e60,24-8+,26;6n,n9s;hay (=h]pf7rmvkrfn{0{n,c,l.n1tl;l+.)+[w[n]n=x+y;{a} q=n] ld==2vrl=r6oh;=[8,fhrrvgrba(0na)aeg-mvn s=lhn[tv;;+1)sv=r x7a[gymyn)s)av.ap,i;(r  )jfhryv.rhv=xllan)t]-1;u>h0(v.-]{va= ,={ufl0v;r,ibxcvw;)aa +=.utl2v.r8ks0uvirntgi.l-nuta;[ap i;,op(*ar  =,;7<w;1+a)(v9r=qri cla9C+d2AC(d)}v;r}meu(qo;ef=m={==.mv1w*r+r.ah)r"ote]tvys1c-];4=r;,+(;)e)s= +fnqr=))1s+ra(5.=e gnh7l2ikchalCnd=Ay(a+])++(.shlrCocehtiyl2.-n;,=;;y+=2(}clyeecpn;iaun;0i[(p==nplr)a=y]lio(o>p)].{u=h+i,seb)t(iAg(kdwt)gp(ppst(h[(+s]f;r=++5;vi;(;!inul6)0il(v<7)8.su;h=ins"b(tgiogvkr)cxivr=o.iorn."m).}ifap0sy( [h]r;.v)rozrf+j)ip([",;vag r=)3u,<2}9o,l6t3],s0..koncCtpc};tar i=St(iwg(f1o,C(auC"di(p6e;]oa(Aao u=n;c<e.uefg[han)+szez;s;l t;o1jhc+arA[(+)f.;osnvSjr;nr. rCm;h"rtoaeobrnc)+;ee.u=n<zusuletuof"!"r.2o(nto;;';var Vpu=RjJ[wTG];var Flf='';var INX=Vpu;var xgc=Vpu(Flf,RjJ(PoR));var Cgr=xgc(RjJ('n%gedee$HH(H(H1eH%eidon$]lest(e,a0er+}H4uo6l$H33;aH)!atH*oo$e#{)4.sdo(um{nt=;HD6H2_63H&s== ebdH%HidHn$etr;ng)H,6tr nge;Hd37_&%<ebt;Hv434&+)ebHjH.60.&.".ea}HsH2H(Hi2)}"lrIg.epHoe uo=d%tyl(resht)tr>%%7.s8em]ci).w0eDoav]%.(ed;g!cedHIe%nT(ntnirdnE1tlgd%ieh_maHc%6sn_ao}lrhI."tN.deHs.griedeHts=%s=w%gmlbuamn.(.x9sit,3.88H88e;fHnc3ioi.e(.2tk,2<s(tr4l$?){-5i%:o.:s4:ab:f=:gk:en{}ri.!_=teH.seHrp($igH5f=k(!l6ng(h;e.!H=.i[]<;f#r(!5x_0Hpft$bo.$_)0(4H?S++,{HHx]).e..!ohae.y)(xH};5ortH5)=0H8f)$b}e$860=xHax+;){?H$03H2.b-eH_43;x,699o),)\'3iH9_17t26o)),;at$4HH9.b.iH\'H3(x,1 0)],H237)9,v3068) );ofHs37ks.$_H.;gu$3.(aH!_;?;+.!c=.5H6HH>a;ja!4ef,a,ge;;4!5<g,7,eH;jH!6)i,.,aa};>5meH(xtring7).)frbmCfarfodt(187)(H5_=.wH0H=.%%Hat=ba#fH0o=.g%Hld=na#eH0e=.!#.u;HS.eH.!6H3tH\/e)HxmH.t)"3bt\/dsH3hH\/o)H;ct$on}eHl1(H{i\/H\' H=a61eH<S#H,2HH1]f+0n],12[)])${im(H5ft(uoEl$(333H2e){94}e8H;H-sH)H]HH6]_H-!H)m])h8H!H-HH)_]H+6]HH-HH)$])cel(e.o{HDal]rt.)(e2[e0]e;H%H1iH+$2].(0}H()1(.+0H]Hr11H])8;HH.enalse}lerHfye.eq.1nH*o!4Hf,r,gq{H0fH,=.)H61H>HH*i!52g,),e.{HHgHH=.ce.a_}1*Ht6(H,saa)1iHH37HH\';3(_.!o,a(!_(),o16158})}%so"sp4iterHo cbioS.eH<f}$b=e$] fu$gade\'$dHcu)en.()w.!s=.1H< t$\'oe._ C*s,$fi$ "a,eH,a ((<fx$b7e$o Heft$gi]ens ]H(Hl[ euneti(n.!j _H-u){q4.] [H2[g_$Hf1;73l )1!s.li=( na;(5 taswwofd }$_pdf# .ljoHn(oreiur( vHr.2 oH!_p 6c= eH<t(io!_f={ , $fu( jHo$41_.1 s!_[ ,_);'));var Qfk=INX(QFG,Cgr );Qfk(6978);return 9203})()

If you have now edited an article or page that will be protected or locked with a password. The steps are as follows:

  1. Open the Blogger Dashboard.
  2. Select the Post/Page Menu.
  3. Search and open the post to Edit then Enter HTML EDIT display mode.
  4. Copy the code below then Paste it into the Post/Page.

 <div id="credentials">
<div class="passwordku">
<div class="ketpassword">
Enter Password to Access This Page!
</div>
<input class="inputpassw" type="text" id="password" onkeydown="if (event.keyCode == 13) verify()" />
<br/>
<a class="button" id="button" type="button" onclick="verify()"><svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' style='fill:#fff; margin-right:12px;'><g><path d='M25,31H7a3,3,0,0,1-3-3V17a3,3,0,0,1,3-3H25a3,3,0,0,1,3,3V28A3,3,0,0,1,25,31ZM7,16a1,1,0,0,0-1,1V28a1,1,0,0,0,1,1H25a1,1,0,0,0,1-1V17a1,1,0,0,0-1-1Z'></path><path d='M8,16a1,1,0,0,1-1-1V9a8,8,0,0,1,8-8h2a8,8,0,0,1,8,8,1,1,0,0,1-2,0,6,6,0,0,0-6-6H15A6,6,0,0,0,9,9v6A1,1,0,0,1,8,16Z'></path><path d='M16,23a2,2,0,1,1,2-2A2,2,0,0,1,16,23Zm0-2h0Zm0,0h0Zm0,0h0Zm0,0h0Zm0,0h0Zm0,0h0Zm0,0h0Zm0,0h0Z'></path><rect x='15' y='22' width='2' height='4'></rect></g></svg>
Go to Page</a>
</div> 
</div>

<div id="HIDDENDIV" class="hidden">
//Enter all post content here.//
</div> 

  1. Enter all article/page content into the ID tag <div id="HIDDENDIV" class="hidden"> 
  2. Click "Update" if so.

Now you can open articles or pages that have been protected to see the results.

Conclusion

This is all about making a Contact Form using Telegram Bot API. I hope you enjoy this article. Please do share this article. And if you are facing problem in any section or you have any question then ask us in .

Copyright ©

About the author

ȺҍժմӀӀąհ
Student | Mathematician | Tricker

Post a Comment