Pop Up Window for Notification/Announcement/Greetings

Pop Up Window for Notification/Announcement/Greetings


<b:if cond='data:view.isHomepage'>
<style type='text/css'>
/* Pop Up Ramadhan */
@keyframes slideDown{0%{opacity:0;transform:translateY(-10%)}100%{opacity:1;transform:translateY(0%)}}
#arlinapuasa2019ku{line-height:1.55;display:block;background:#fff;position:fixed;top:25%;right:0;left:0;margin:auto;text-align:center;max-width:600px;box-shadow:0 0 2.5rem -1.5rem rgba(0,0,0,0.5);z-index:99;min-height:325px;padding:20px;border-radius:10px;animation:slideDown 2s}#arlinapuasa2019ku .puasa19{position:absolute;color:#222;font-size:1.5rem;font-weight:400;z-index:99999;text-align:center;margin:auto;padding:10px;left:0;right:0;top:17%;border-bottom:1px solid rgba(0,0,0,0.05);border-top:1px solid rgba(0,0,0,0.05)}#arlinapuasa2019ku .puasa19 p{margin:10px auto;font-style:italic;font-family:Georgia}#arlinapuasa2019ku .puasa19 .ramadhan2019{font-size:2.5rem;font-style:normal}#arlinapuasa2019ku a.close-popup{background:#428bca;position:absolute;bottom:20px;right:20px;color:#fff;text-align:center;cursor:pointer;z-index:99;border-radius:3px;display:inline-block;font-size:13px;padding:4px 14px;min-width:60px;border:1px solid #3885c7;transition:all 0.3s}#arlinapuasa2019ku a.close-popup:hover{background:#fff;color:#3885c7;border-color:#3885c7}#arlinapuasa2019ku a.close-popup:active{opacity:.9}
.ketupat{position:absolute;left:0;right:0;top:-12px;margin:auto;width:10px;height:10px;background:#B9E937;box-shadow:10px 0 0 #57D131,10px 10px 0 #B9E937,0px 10px 0 #57D131,5px 5px 0 10px #fff;display:inline-block;text-align:center;transform:rotate(45deg);z-index:2}.ketupat.duaa{top:initial;bottom:3px}
@media screen and (max-width:768px){#arlinapuasa2019ku .puasa19{font-size:1rem}#arlinapuasa2019ku .puasa19 .ramadhan2019{font-size:1.5rem}#arlinapuasa2019ku{min-height:260px;left:20px;right:20px}}
</style>
</b:if>

<b:if cond='data:view.isHomepage'>
<div id='arlinapuasa2019ku'>
<div class='ketupat'/>
<a class='close-popup' href='#' title='Close this message'>Close</a>
<div class='puasa19'>
<p>Selamat Menunaikan Ibadah Puasa</p>
<p><span class='ramadhan2019'>Ramadhan 1440 H</span></p>
<p>Mohon Maaf Lahir Batin</p>
</div>
<div class='ketupat duaa'/>
</div>
<script type='text/javascript'>
//<![CDATA[
$(window).bind("load",function(){$("#arlinapuasa2019ku").animate({top:"25%"},1e3),$("a.close-popup").click(function(){return $(this).parent().fadeOut(1e3),!1})});
//]]>
</script>
</b:if>
Create your own HTML Parser Tool

Create your own HTML Parser Tool


<style scoped="" type="text/css">
#parser2{position:relative;overflow:hidden}
#parser2 .btn,#parser2 .btn:active{background-image:none}
#parser2 .btn{font-weight:400;padding:6px 12px;margin-bottom:5px;font-size:14px;line-height:1.42857143;text-align:center;white-space:nowrap;-ms-touch-action:manipulation;touch-action:manipulation;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;border:0;border-radius:4px;cursor:pointer;transition:all .3s}
#parser2 .btn:active:focus,#parser2 .btn:focus{outline:0}
#parser2 .btn:focus,#parser2 .btn:hover{color:#333;text-decoration:none;outline:0}
#parser2 .btn:active{outline:0;-webkit-box-shadow:inset 0 3px 5px rgba(0,0,0,.125);box-shadow:inset 0 3px 5px rgba(0,0,0,.125)}
#parser2 .btn-primary{color:#fff;background:#3e51b5}
#parser2 .btn-primary:focus,.button-group button:disabled{color:#fff;background:#286090}
#parser2 .btn-primary:active,#parser2 .btn-primary:hover{color:#fff;opacity:.9}
#parser2 .btn-danger{color:#fff;background:#f39c12}
#parser2 .btn-danger:focus{color:#fff;opacity:.9}
#parser2 .btn-danger:active,#parser2 .btn-danger:hover{color:#fff;opacity:.9}
#parser2 .btn-info{color:#fff;background:#5bc0de}
#parser2 .btn-info:focus{color:#fff;background:#31b0d5}
#parser2 .btn-info:active,#parser2 .btn-info:hover{color:#fff;background:#31b0d5}
#parser2 .btn-xs{font-size:12px;line-height:1.5;border-radius:3px;padding:1px 5px}
#parser2 textarea#somewhere{background:#fef1c8;border:0;height:300px;width:100%;margin:0 0 10px;box-sizing:border-box;font-family:Consolas,Monaco,'Andale Mono',monospace;color:#111;border-radius:10px;box-shadow:inset 0 -5px 5px rgba(0,0,0,0.05);padding:20px}
#parser2 textarea#somewhere:active,#parser2 textarea#somewhere:focus{outline:0}
#parser2 .btn-sm{display:inline-block;font-size:13px;line-height:1.5;border-radius:5px;padding:12px;margin:0 auto 10px auto;width:30%;box-shadow:0 3px 1.2rem -0.8rem rgba(0,0,0,0.8)}
#parser2 .btn-xs{font-size:13px;line-height:1.5;border-radius:5px;padding:12px;margin:auto;width:30%;box-shadow:0 3px 1.2rem -0.8rem rgba(0,0,0,0.8)}
.collapse{display:none}
.alert-success{color:#222;background:#fff}
.alert{border:0;padding:5px 15px;border-radius:10px;position:absolute;top:20px;right:20px;min-width:210px;color:#0984e3;font-size:13px;box-shadow:0 2px 4px 0 rgba(0,0,0,0.16)}
button.close{padding:0;cursor:pointer;background:none;border:0;-webkit-appearance:none}
.close{float:right;font-size:1.3rem;color:#0984e3;margin:1px 0 0 0}
button.close:focus{outline:0}
.close:hover{opacity:1!important}
#btnInfo h4{margin:0;font-size:13px;line-height:2}
#button-link{display:none}
.clear{clear:both;display:block;margin-bottom:2px}
.alert br{display:none}
</style>
<div id="parser2">
<textarea id="somewhere" placeholder='Write/paste the code here then click the Parse Code button'></textarea>
<div class='alert alert-success margin-bottom-20 collapse' id='btnInfo' role='alert'>
<button class='close close-copy' onclick='document.getElementById(&quot;btnInfo&quot;).style.display = &quot;none&quot;;cdClear();' type='button'><span aria-hidden='true'>&#215;</span></button> 
<h4>Code copied to clipboard</h4>
</div>
<br/> <button onclick="convert();" class='btn btn-primary btn-sm btn-parse' type="button">Parse Code</button> 
<div class="clear"></div>
<button class='btn button-link btn-xs btn-info' id='button-link' data-clipboard-action='copy' data-clipboard-target='#somewhere' type='submit'>Copy code to clipboard</button> <button class='btn btn-danger btn-xs' id='btn_clear' onclick='cdClear();'>Clean</button> 
</div>
<script type="text/javascript">//<![CDATA[
function downloadJSAtOnload(){var d=document.createElement("script");d.src="https://cdn.jsdelivr.net/gh/Arlina-Design/redvision@master/htmlparse.js",document.body.appendChild(d)}window.addEventListener?window.addEventListener("load",downloadJSAtOnload,!1):window.attachEvent?window.attachEvent("onload",downloadJSAtOnload):window.onload=downloadJSAtOnload;
//]]></script>
How to add Auto Source link

How to add Auto Source link

 


Hello friends, I noticed on Internet many people (blogger/webmaster) copy content from another website and publish on their blogs/websites.

If a blogger/webmaster copy your content then automatically a source link is also copied with this text. I know this method is too old but I'm facing this problem because too many blogger copy text from my another blog.

How to Add Automatic Source Code Link?

  • Go to Blogger.
  • Click on Themes.
  • Click on Edit HTML.
  • Find </body>.
  • Paste the code before </body>.

<script type='text/javascript'>
//<![CDATA[
!function(e,t)
{var n="getSelection",o="removeAllRanges",i="addRange",l="parentNode",a="firstChild",d="appendChild",r="removeChild",s="test",c="innerHTML";if(e[n])
{var p,g,f,h,u,y;t.addEventListener("copy",function(C){for(g=C.target;3===g.nodeType;)g=g[l];
if(h=t.createElement("div"),(p=e[n]())&&p.rangeCount&&(p=p.getRangeAt(0))&&(f=p.cloneRange(),p=p.cloneContents())){for(;u=p[a];)h[d](u);if(!/^(pre|code)$/i[s](g.nodeName||"")&&!/(^|\s)no-attribution(\s|$)/i[s](g.className||""))
{var v=e.location.href;h[c]+="<br><br>&copy; "+t.title+'<br>Source: <a href="'+v+'">'+v+"</a>"}
y=t.createRange(),t.body[d](h),y.selectNodeContents(h),p=e[n](),p[o](),p[i](y),setTimeout(function()
{h[l][r](h),p[o](),p[i](f)})}},!1)}}(window,document);
//]]>
</script>
How to remove "?m=1" from blogger

How to remove "?m=1" from blogger

How to remove "?m=1" from blogger blog

 Hello friends, 

After a month I'm sharing on my blog. How to remove "?m=1" from blogger blog.

Because if we create blog using Google blogger then we get m=1 with blog address.

So here you can say good bye to this tag "m=1".

Just copy the below highlighted code and paste it on your blog template.


Also Check: How to type English to Telugu 


How to hide "m=1"?

  1. Go to blogger.
  2. Now go to Template section
  3. Click on edit HTML.
  4. Search </body> and paste the below code before <body>.
  5. Save the theme. And say goodbye with this annoying tag.


<script type='text/javascript'>

//<![CDATA[

var uri = window.location.toString();

if (uri.indexOf("%3D","%3D") > 0) {

var clean_uri = uri.substring(0, uri.indexOf("%3D"));

window.history.replaceState({}, document.title, clean_uri);

}

var uri = window.location.toString();

if (uri.indexOf("%3D%3D","%3D%3D") > 0) {

var clean_uri = uri.substring(0, uri.indexOf("%3D%3D"));

window.history.replaceState({}, document.title, clean_uri);

}

var uri = window.location.toString();

if (uri.indexOf("&m=1","&m=1") > 0) {

var clean_uri = uri.substring(0, uri.indexOf("&m=1"));

window.history.replaceState({}, document.title, clean_uri);

}

var uri = window.location.toString();

if (uri.indexOf("?m=1","?m=1") > 0) {

var clean_uri = uri.substring(0, uri.indexOf("?m=1"));

window.history.replaceState({}, document.title, clean_uri);

}

//]]>

</script>

I redesign a blogger template and use this code for remove m=1. You can check it.
Voice To Text converter (HTML/JavaScript)

Voice To Text converter (HTML/JavaScript)

Create Voice To Text converter with HTML and JavaScript
Hello friends, Today i'm sharing "How to create Voice To Text converter with HTML and JavaScript?"
If you are a webmaster or blogger then you can create this tool on your website/blog.
For create voice to text converter, create a new page and follow this tutorial.


  • Create a plain html page or for blogger create a new page.
  • Add HTML for this tool.

<div class="words" contenteditable>
</div>


  • After HTML add CSS for this tool.
<style>@import url("https://fonts.googleapis.com/css?family=Open+Sans");

html {
font-size: 10px;
}

body {
background: #fce6d3;
font-family: "Open Sans", sans-serif;
font-size: 2rem;
color: #1d2e4b;
}

.words {
max-width: 500px;
margin: 50px auto;
background: #fff;
border-radius: 5px;
padding: 1rem 2rem 1rem 5rem;
background: -webkit-gradient(linear, 0 0, 0 100%, from(#cfddf9), color-stop(4%, #fff)) 0 4px;
background-size: 100% 3rem;
position: relative;
line-height: 3rem;
-moz-box-shadow: 2px 8px 15px rgba(228, 126, 118, 0.5);
-webkit-box-shadow: 2px 8px 15px rgba(228, 126, 118, 0.5);
box-shadow: 2px 8px 15px rgba(228, 126, 118, 0.5);
}

p {
margin: 0 0 3rem;
}

.words:before {
content: "";
position: absolute;
width: 4px;
top: 0;
left: 30px;
bottom: 0;
border: 1px solid;
border-color: transparent #ffd9d9;
}</style>


  • Add JavaScript code for this tool
<script>
window.SpeechRecognition = window.SpeechRecognition || window.webkitSpeechRecognition;

if (!window.SpeechRecognition) {
alert("Your browser does not support speech recognition. Use Chrome!")
}

const recognition = new SpeechRecognition();
recognition.interimResults = true;

let p = document.createElement('p');
const words = document.querySelector('.words');
words.appendChild(p);

recognition.addEventListener('result', e => {
const transcript = Array.from(e.results)
.map(result => result[0])
.map(result => result.transcript)
.join('');

p.textContent = transcript;

if(e.results[0].isFinal) {
p = document.createElement('p');
words.appendChild(p);
}

console.log(transcript);
});


recognition.addEventListener('end', recognition.start);
recognition.start();</script>

  • Now your tool is ready.
How to make Blank template for Blogger

How to make Blank template for Blogger



Hello friends, In this post I'm sharing you "How to create A blank template in blogger?". Because many blogger want to design their blog with their own choice.
Because Design of any blog/website is first impression to their visitors. 
Let's start
  1.  Go to blogger.
  2. Click on Theme option from Left side of screen.
  3. Click on Edit HTML or restore theme.
  4. Copy the below code and paste it in the code area.
  5. Now save the xml theme.
  6. Your Blank template is ready now.
Or if you want  to use Restore option. Just copy the below code. Then create a new plain text file with named with "blank.xml". And paste the copied text in this file.

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html>
<html b:version='2' class='v2' expr:dir='data:blog.languageDirection' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='https://www.google.com/2005/gml/b' xmlns:data='https://www.google.com/2005/gml/data' xmlns:expr='https://www.google.com/2005/gml/expr'>

<head>
<meta content='IE=EmulateIE7' http-equiv='X-UA-Compatible' />
<b:if cond='data:blog.isMobile'>
<meta content='width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0' name='viewport' />
<b:else />
<meta content='width=device-width' name='viewport' />
</b:if>
<b:include data='blog' name='all-head-content' />
<title>
<data:blog.pageTitle />
</title>
<b:skin>
<![CDATA[/*
-----------------------------------------------
/////////// CSS Code////////////////////////////////////////////////////////////////////////////////////////
////////////////////////TEMPLATE CREATED BY : Vishesh Grewal////////////////////////////////////////////////////////////
/////////////////////// DOWNLOAD FROM: www.visheshgrewal.blogspot.com //////////////////////////////////////////////////
----------------------------------------------
]]>
</b:skin>

</head>

<body>

<center>
<h1> Blank Blogger Template </h1>
</center>

<!--Start Please keep the Credits intact-->
<div style='margin-top:300px; '>
<center>
<p class='author'>&#169; <b>Code from</b><a href='https://visheshgrewal.blogspot.com/'>Vishesh Grewal</a></p>
</center>
</div>

<b:section class='navbar' id='navbar' maxwidgets='1' showaddelement='no' />

<!-- End Please keep the Credits intact-->
</body>

</html>
Create Sitemap with Drop-down list (blogger)

Create Sitemap with Drop-down list (blogger)

How to create Sitemap with Drop-down list in blogger (Visheshgrewal.blogspot.com)
Hello My friends! In this post i'm sharing you How to create Sitemap with Drop-down list in blogger. Because sitemap is important in SEO for give better search results of your site/blog.
I'm sharing code for sitemap who create sitemap of your blogger blog with Drop-down list.

How to create Drop-down sitemap?

    • Login to your blogger Account.
    • Select your blog.
    • Now go to Pages section.
    • Create new page.
    • Enter the name of page.
    • Paste the copied code and click on publish.
    <div id='sitemaps' class='sitemaps'>
    <div class='loading'>
    Loading....</div>
    </div>
    <script>/*<![CDATA[*/
    /* Blogger Sitemap Dropdown */
    var toc_config = {containerId:'sitemaps', showNew:0, sortAlphabetically:{thePanel:true, theList:true}, activePanel:1, slideSpeed:{down:400, up:400}, slideEasing:{down: null, up: null}, slideCallback:{down:function(){}, up:function(){}}, clickCallback:function(){}, jsonCallback:'sitemaps',delayLoading: 0};
    window.onload = function(){
    !function(e,o){var t=o.getElementById(toc_config.containerId),c=o.getElementsByTagName("head")[0],n=[];e[toc_config.jsonCallback]=function(e){for(var o,c,i=e.feed.entry,a=e.feed.category,l="",s=0,d=a.length;d>s;++s)n.push(a[s].term);for(var r=0,f=i.length;f>r;++r)(toc_config.showNew||toc_config.showNew>0)&&r<toc_config.showNew+1&&(i[r].title.$t+=" %new%");i=toc_config.sortAlphabetically.theList?i.sort(function(e,o){return e.title.$t.localeCompare(o.title.$t)}):i,toc_config.sortAlphabetically.thePanel&&n.sort();for(var g=0,h=n.length;h>g;++g){l+='<div class=\"sitemap-box\">
    <h4 class=\"judul\">
    '+n[g]+'</h4>
    ',l+='<div class=\"konten\">
    <ol>';for(var _=0,p=i.length;p>_;++_){o=i[_].title.$t;for(var w=0,u=i[_].link.length;u>w;++w)if("alternate"==i[_].link[w].rel){c=i[_].link[w].href;break}for(var v=0,m=i[_].category.length;m>v;++v)n[g]==i[_].category[v].term&&(l+='
    <li><a href=\"'+c+'\" title=\"'+o.replace(/ \%new\%$/,"")+'\">'+o.replace(/ \%new\%$/,"")+'</a></li>
    ')}l+='</ol>
    </div>
    </div>
    '}t.innerHTML=l,"undefined"!=typeof jQuery&&($("#"+toc_config.containerId+" .konten").hide(),$("#"+toc_config.containerId+" .judul").click(function(){$(this).hasClass("aktif")||(toc_config.clickCallback(this),$("#"+toc_config.containerId+" .judul").removeClass("aktif").next().slideUp(toc_config.slideSpeed.up,toc_config.slideEasing.up,toc_config.slideCallback.up),$(this).addClass("aktif").next().slideDown(toc_config.slideSpeed.down,toc_config.slideEasing.down,toc_config.slideCallback.down))}).eq(toc_config.activePanel-1).addClass("aktif").next().slideDown(toc_config.slideSpeed.down,toc_config.slideEasing.down,toc_config.slideCallback.down))};var i=o.createElement("script");i.src="https://visheshgrewal.blogspot.com/feeds/posts/summary?alt=json-in-script&max-results=9999&callback="+toc_config.jsonCallback,"onload"==toc_config.delayLoading?e.onload=function(){c.appendChild(i)}:e.setTimeout(function(){c.appendChild(i)},toc_config.delayLoading)}(window,document);
    }
    /*]]>*/</script>
    

    Note:- After copy this code, Please change your blog address with https://visheshgrewal.blogspot.com
    Remove template footer credit by JavaScript Obfuscator

    Remove template footer credit by JavaScript Obfuscator

    How to Remove Blogger template footer credit link with using JavaScript Obfuscator decode tool by Vishesh Grewal
    This time I will add a tutorial about footer credit link in blogger which makes it's developer/designer non-removable.

    What is a Template Credit Link?
    Template Credit Link is inserted by the Blogger template maker. The purpose of the template maker to insert a credit link in template to see their work on their blogs, who use these templates.


    For example, If you use free templates made by Templatemark , Sora Templates , Magic Companies ,Msdesign, Templateclue , and other many Template designers
    , then you see footer credit Link in your blog.
    Like this:-
    How to Remove Blogger template footer credit link with using JavaScript Obfuscator decode tool

    How to Remove Credit Footer Blogger Templates?

    If you understand better programming languages like javascript & html. Then footer credit removing is too easy for you.

    There are at least a number of methods or methods for each template maker to insert credit links, including:

    1 . The developers/author inserts a time trial code in the template

    The developers/author adds a time trial code which means the template can only be used within a specified time. And after the time is up, there will usually be a notification to buy the paid version. And for the paid version there is also add a strictly applied code in it, for example templates can only be used / restricted to a few blog addresses.

    2. The developers/author adds the link credit with certain code using javascript obfuscator tool


    I think at this time, this method is widely used by template maker to add link credit, by wrapping the link credit with the code Javascript Obfuscator.The wrapper code will work if the credit link is removed and the blog will automatically redirect to the developers/author's site.
    This obfuscated code can be "opened" with Online Tools as i shared below.

    Methods for removing credit link:-

    There are two methods to Remove/hide credit link.
    Method 1:- By adding
    <style ='visibility:hidden'/>
    in the footer section where credit link id is embedded.
    But i think this method is too old. Because I also used this code earlier for hiding credit link.

    Method 2:- By using JavaScript Obfuscator tool. This method is fully secure without any redirections.(Use this method be carefully because author's add credit link in JavaScript obfuscated code.)
    You can search on Google for JavaScript Obfuscator decode tool.
    Here the decode tool website which I used for removing credit link.

    Add a Cookie Notice for Privacy Policy Agreement

    Add a Cookie Notice for Privacy Policy Agreement

    How to add a Cookie Notice for Privacy Policy Agreement [Blogger/Website]

    Why Cookies notification Required for blogger/website.

    European Union (EU) laws require you to give EU visitors information about cookies used on your blog. In many cases, these laws also require you to obtain consent.

    As a courtesy, Google added the following notice on your blog to help meet these regulations:

    "This site uses cookies from Google to deliver its services and analyze traffic. Your IP address and user-agent are shared with Google along with performance and security metrics to ensure quality of service, generate usage statistics, and to detect and address abuse."

    The notice lets visitors know about Google's use of certain Blogger and Google cookies on your blog, including Google Analytics and AdSense cookies.

    Cookies and Cookie Types:-

    Cookies can be classified into different types based on different characteristics. 
    • Based on their purpose, there are basically two types of cookies, necessary and non-necessary. The necessary cookies are the ones that are essential for the functioning of a website, and the non-necessary cookies are the ones that are added additionally by the website and are not really important for the functioning of the website.    
    • Based on their origin, cookies can be divided into first-party and third-party cookies. First-party cookies are set by the website itself that the user is currently visiting, say, check whether the user is logged in or not. Whereas third-party cookies are put in by other websites that track the user for targeting relevant advertisements.
    • Based on their duration, cookies can be divided into two, persistent and session cookies. Session cookies are set when the user starts a session and are temporary cookies. They expire once the browser is closed and the session ends. Persistent cookies, on the other hand, stay on the user’s browser for a longer period and only die when they reach their expiration period.

    Adding a Cookie Banner Agreement:-

    Blogger is a popular platform/website to create your blog in free. To add a cookie banner that is GDPR compliant on your Blogger or Blogspot website, you can use this Tutorial.

    Steps To Add Cookie Notice:-

    1. Go to  Blogger.
    2. Now Go to Theme option.
    3. Click on Edit HTML.
    4. Now Paste this CSS code after tag.


      <style> .cc-window{opacity:1;transition:opacity 1s ease}
      .cc-window.cc-invisible{opacity:0}.cc-animate.cc-revoke{transition:transform 1s ease}
      .cc-animate.cc-revoke.cc-top{transform:translateY(-2em)}
      .cc-animate.cc-revoke.cc-bottom{transform:translateY(2em)}
      .cc-animate.cc-revoke.cc-active.cc-bottom,.cc-animate.cc-revoke.cc-active.cc-top,.cc-revoke:hover{transform:translateY(0)}.cc-grower{max-height:0;overflow:hidden;transition:max-height 1s}
      .cc-link,.cc-revoke:hover{text-decoration:underline}
      .cc-revoke,.cc-window{position:fixed;overflow:hidden;box-sizing:border-box;font-family:Helvetica,Calibri,Arial,sans-serif;font-size:16px;line-height:1.5em;display:-ms-flexbox;display:flex;-ms-flex-wrap:nowrap;flex-wrap:nowrap;z-index:9999}
      .cc-window.cc-static{position:static}
      .cc-window.cc-floating{padding:2em;max-width:24em;-ms-flex-direction:column;flex-direction:column}.cc-window.cc-banner{padding:1em 1.8em;width:100%;-ms-flex-direction:row;flex-direction:row}.cc-revoke{padding:.5em}
      .cc-header{font-size:18px;font-weight:700}.cc-btn,.cc-close,.cc-link,.cc-revoke{cursor:pointer}.cc-link{opacity:.8;display:inline-block;padding:.2em}.cc-link:hover{opacity:1}
      .cc-link:active,.cc-link:visited{color:initial}.cc-btn{display:block;padding:.4em .8em;font-size:.9em;font-weight:700;border-width:2px;border-style:solid;text-align:center;white-space:nowrap}
      .cc-banner .cc-btn:last-child{min-width:140px}.cc-highlight .cc-btn:first-child{background-color:transparent;border-color:transparent}.cc-highlight .cc-btn:first-child:focus,.cc-highlight .cc-btn:first-child:hover{background-color:transparent;text-decoration:underline}
      .cc-close{display:block;position:absolute;top:.5em;right:.5em;font-size:1.6em;opacity:.9;line-height:.75}.cc-close:focus,.cc-close:hover{opacity:1}.cc-revoke.cc-top{top:0;left:3em;border-bottom-left-radius:.5em;border-bottom-right-radius:.5em}.cc-revoke.cc-bottom{bottom:0;left:3em;border-top-left-radius:.5em;border-top-right-radius:.5em}.cc-revoke.cc-left{left:3em;right:unset}
      .cc-revoke.cc-right{right:3em;left:unset}
      .cc-top{top:1em}.cc-left{left:1em}.cc-right{right:1em}
      .cc-bottom{bottom:1em}.cc-floating>.cc-link{margin-bottom:1em}.cc-floating .cc-message{display:block;margin-bottom:1em}.cc-window.cc-floating .cc-compliance{-ms-flex:1;flex:1}
      .cc-window.cc-banner{-ms-flex-align:center;align-items:center}.cc-banner.cc-top{left:0;right:0;top:0}.cc-banner.cc-bottom{left:0;right:0;bottom:0}.cc-banner .cc-message{-ms-flex:1;flex:1}
      .cc-compliance{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-line-pack:justify;align-content:space-between}.cc-compliance>.cc-btn{-ms-flex:1;flex:1}
      .cc-btn+.cc-btn{margin-left:.5em}@media print{.cc-revoke,.cc-window{display:none}}@media screen and (max-width:900px){.cc-btn{white-space:normal}}@media screen and (max-width:414px) and (orientation:portrait),screen and (max-width:736px) and (orientation:landscape){.cc-window.cc-top{top:0}.cc-window.cc-bottom{bottom:0}
      .cc-window.cc-banner,.cc-window.cc-left,.cc-window.cc-right{left:0;right:0}
      .cc-window.cc-banner{-ms-flex-direction:column;flex-direction:column}.cc-window.cc-banner .cc-compliance{-ms-flex:1;flex:1}.cc-window.cc-floating{max-width:none}.cc-window .cc-message{margin-bottom:1em}
      .cc-window.cc-banner{-ms-flex-align:unset;align-items:unset}}.cc-floating.cc-theme-classic{padding:1.2em;border-radius:5px}.cc-floating.cc-type-info.cc-theme-classic .cc-compliance{text-align:center;display:inline;-ms-flex:none;flex:none}.cc-theme-classic .cc-btn{border-radius:5px}.cc-theme-classic .cc-btn:last-child{min-width:140px}.cc-floating.cc-type-info.cc-theme-classic .cc-btn{display:inline-block}.cc-theme-edgeless.cc-window{padding:0}
      .cc-floating.cc-theme-edgeless .cc-message{margin:2em 2em 1.5em}.cc-banner.cc-theme-edgeless .cc-btn{margin:0;padding:.8em 1.8em;height:100%}.cc-banner.cc-theme-edgeless .cc-message{margin-left:1em}
      .cc-floating.cc-theme-edgeless .cc-btn+.cc-btn{margin-left:0} #cookieChoiceInfo {display:none} .cc_container {box-shadow: none; border: 1px soild #ddd; border-radius: 0;} .cc_container .cc_btn:hover, .cc_container .cc_btn:active {background: #999; color: #fff;}
      .cc_container .cc_btn, .cc_container .cc_btn:visited {background: #000 !important; color: #fff !important; border-radius: 2px !important;}
      </style>


  •  Paste this JavaScript code after this CSS code.



  • <script src="https://cdnjs.cloudflare.com/ajax/libs/cookieconsent2/3.0.6/cookieconsent.min.js">
    </script>

    Paste this Javascript code after </body>.


    <script>
    // EU Law Cookies

    window.addEventListener("load", function()
    { window.cookieconsent.initialise
    ({ "palette": { "popup": { "background": "#eb6c44", "text": "#ffffff" }, "button": { "background": "#f5d948", "text": "#fff" } }, "position": "bottom-center", "content":
    { "message": "This site uses cookies from Google to deliver its services, to personalise ads and to analyse traffic. By using this site, you agree to its use of cookies.", "dismiss": "OK", "href": "https://visheshgrewal.blogspot.com/p/privacy-policy.html", } })});

    </script>
    Create JavaScript Obfuscator Tool [PHP]

    Create JavaScript Obfuscator Tool [PHP]

    Create Your Own JavaScript Obfuscator Tool using PHP visheshgrewal.blogspot.com


    JavaScript Obfuscator is a powerful free obfuscator for JavaScript, containing a variety of features which provide protection for your source code.


    What is Javascript Obfuscator?

    To transforms your original JavaScript source code into a new representation that's harder to understand, copy, re-use and modify without authorization. The obfuscated result will have the exact functionality of the original code.

    Why Obfuscation?

    • Code size will be reduced.
    • Hide the business logic and your code from others.
    • Reverse engineering is highly difficult.
    • In JavaScript, download time will be reduced.
    If you are developing enterprise application, Then I recommend you can use a product like Jscrambler for obfuscating your code. Reverse engineering of obfuscated code is really difficult to Decode.
     Example of Obfuscating of JavaScript Code.
    Original JavaScript code:-
    function hello(name) {
    console.log('Hello, ' + name);
    }
    hello('New user');

    After obfuscation:-

    eval(function(p,a,c,k,e,d)
    {while(c--){if(k[c])
    {p=p.replace(new RegExp('\\b'+c+'\\b','g'),k[c])}}
    return p}('7 0(1){6.5(\'4, \'+1)}0(\'3 2\');',8,8,
    'hello|name|user|New|Hello|log|console|function'.split('|')))

    How To make your Own JavaScript Obfuscator by Using PHP?
    To create your own JavaScript Obfuscator, You have an hosting account with Supported PHP version 5.4<.
    1.  Create a file with name index.php
    • Click Here to Get Code for Index.php file from Github.
    2. Create 2nd file with name  HunterObfuscator.php


    <?php
    class HunterObfuscator
    {
    private $code;
    private $mask;
    private $interval;
    private $option = 0;
    private $expireTime = 0;
    private $domainNames = array();

    function __construct($Code, $html = false)
    {
    if ($html) {
    $Code = $this->cleanHtml($Code);
    $this->code = $this->html2Js($Code);
    } else {
    $Code = $this->cleanJS($Code);
    $this->code = $Code;
    }

    $this->mask = $this->getMask();
    $this->interval = rand(1, 50);
    $this->option = rand(2, 8);
    }

    private function getMask()
    {
    $charset = str_shuffle('abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ');
    return substr($charset, 0, 9);
    }

    private function hashIt($s)
    {
    for ($i = 0; $i < strlen($this->mask); ++$i)
    $s = str_replace("$i", $this->mask[$i], $s);
    return $s;
    }

    private function prepare()
    {
    if (count($this->domainNames) > 0) {
    $code = "if(window.location.hostname==='" . $this->domainNames[0] . "' ";
    for ($i = 1; $i < count($this->domainNames); $i++)
    $code .= "|| window.location.hostname==='" . $this->domainNames[$i] . "' ";
    $this->code = $code . "){" . $this->code . "}";
    }
    if ($this->expireTime > 0)
    $this->code = 'if((Math.round(+new Date()/1000)) < ' . $this->expireTime . '){' . $this->code . '}';
    }

    private function encodeIt()
    {
    $this->prepare();
    $str = "";
    for ($i = 0; $i < strlen($this->code); ++$i)
    $str .= $this->hashIt(base_convert(ord($this->code[$i]) + $this->interval, 10, $this->option)) . $this->mask[$this->option];
    return $str;
    }

    public function Obfuscate()
    {
    $rand = rand(0,99);
    $rand1 = rand(0,99);
    return "var _0xc{$rand}e=[\"\",\"\x73\x70\x6C\x69\x74\",\"\x30\x31\x32\x33\x34\x35\x36\x37\x38\x39\x61\x62\x63\x64\x65\x66\x67\x68\x69\x6A\x6B\x6C\x6D\x6E\x6F\x70\x71\x72\x73\x74\x75\x76\x77\x78\x79\x7A\x41\x42\x43\x44\x45\x46\x47\x48\x49\x4A\x4B\x4C\x4D\x4E\x4F\x50\x51\x52\x53\x54\x55\x56\x57\x58\x59\x5A\x2B\x2F\",\"\x73\x6C\x69\x63\x65\",\"\x69\x6E\x64\x65\x78\x4F\x66\",\"\",\"\",\"\x2E\",\"\x70\x6F\x77\",\"\x72\x65\x64\x75\x63\x65\",\"\x72\x65\x76\x65\x72\x73\x65\",\"\x30\"];function _0xe{$rand1}c(d,e,f){var g=_0xc{$rand}e[2][_0xc{$rand}e[1]](_0xc{$rand}e[0]);var h=g[_0xc{$rand}e[3]](0,e);var i=g[_0xc{$rand}e[3]](0,f);var j=d[_0xc{$rand}e[1]](_0xc{$rand}e[0])[_0xc{$rand}e[10]]()[_0xc{$rand}e[9]](function(a,b,c){if(h[_0xc{$rand}e[4]](b)!==-1)return a+=h[_0xc{$rand}e[4]](b)*(Math[_0xc{$rand}e[8]](e,c))},0);var k=_0xc{$rand}e[0];while(j>0){k=i[j%f]+k;j=(j-(j%f))/f}return k||_0xc{$rand}e[11]}eval(function(h,u,n,t,e,r){r=\"\";for(var i=0,len=h.length;iencodeIt() . "\"," . rand(1, 100) . ",\"" . $this->mask . "\"," . $this->interval . "," . $this->option . "," . rand(1, 60) . "))";
    }
    public function setExpiration($expireTime)
    {
    if (strtotime($expireTime)) {
    $this->expireTime = strtotime($expireTime);
    return true;
    }
    return false;
    }

    public function addDomainName($domainName)
    {
    if ($this->isValidDomain($domainName)) {
    $this->domainNames[] = $domainName;
    return true;
    }
    return false;
    }

    private function isValidDomain($domain_name)
    {
    return (preg_match("/^([a-z\d](-*[a-z\d])*)(\.([a-z\d](-*[a-z\d])*))*$/i", $domain_name)
    && preg_match("/^.{1,253}$/", $domain_name)
    && preg_match("/^[^\.]{1,63}(\.[^\.]{1,63})*$/", $domain_name));
    }

    private function html2Js($code)
    {
    $search = array(
    '/\>[^\S ]+/s', // strip whitespaces after tags, except space
    '/[^\S ]+\

    /' // Remove HTML comments ); $replace = array( '>', '<', '\\1', '' ); $code = preg_replace($search, $replace, $code); $code = "document.write('" . addslashes($code . " ") . "');"; return $code; } private function cleanHtml($code) { return preg_replace('//', '', $code); } private function cleanJS($code) { $pattern = '/(?:(?:\/\*(?:[^*]|(?:\*+[^*\/]))*\*+\/)|(?:(?<!\:|\\\|\')\/\/.*))/'; $code = preg_replace($pattern, '', $code); $search = array( '/\>[^\S ]+/s', // strip whitespaces after tags, except space '/[^\S ]+\/' // Remove HTML comments ); $replace = array( '>', '<', '\\1', '' ); return preg_replace($search, $replace, $code); } }