How to protect blogger post or page with the password

In this article, I will tell you how you can protect your post or page with a password on the blogger. If you want to sell any content on the blogger then you can use this trick to sell any content by blogger. If you want to give anyone any kind of personal docs by blogger then you can lock the page with the password so no one can view the content of this page.
If you don't understand then please see a preview of this script click on the below preview button to see the demo of password protected page. The password of the preview page is "test".

PREVIEW

Now if you see the preview then I hope you understand what I want to tell you. So many readers of this article tell me this, not an approved version! For who tells this I tell him you can't customize this boxed because this is not run by your theme CSS it's run by the alert box of the browser. All browser has a different kind of dialogs box.

The benefit of this script

There are so many benefits to this script. So those are some highlighted features of this script:

1. Protect page or post.
2. Save your personal docs.
3. No ignorable points.
4. Many more...

Now if you read details about those features then you can see by searching on google.

How to add this script on post or page

If you want to add this password script on your blog post/page then follow all the bellow steps I am telling you:

1. Open your post editor in the HTML view of the blogger.
2. Now copy the below code and paste it on the below of your post/page HTML view.
   
   

<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
var password = 'password'
password=prompt('Please enter the password to enter this post:','');
if (password != 'password') {
location.href='URL';
}
// End -->
</SCRIPT>

3. Now open change password text with your password and add your blog homepage URL on the URL text.

Now publishes your article and see. Done.

Conclosing

Now after this code adding done don't forget me give a small thanks. You can also give your feedback on the comment section it's always opened for you. Thanks for stay with us.

How to protect blogger post or page with the password

08:17 blogger

How to install lazy load on Blogger

Lazy load: There is so much way to make your blog faster but the best way is using lazy loading script. In this article, I will talk about how you can install the lazy load script on Blogger. There is so much lazy loading script but the same time lazy loading script makes down your blog full load time this why I am all problem and make a new lazyloading using javascript. Let's tell you some facts about lazy loading.

What is the lazy load

When anyone browses your blog or website all script and image it's load when the person opens your blog this why your blog loses speed. Now if you use lazy load script it's run image and script when the user needs this image or script. If you want to know more about lazy loading then you can read in Wikipedia (https://en.wikipedia.org/wiki/Lazy_loading).

Compare

So let me show you my blog speed without lazyload script and with lazy load script. 

Without lazy load script

See on the below image it's the speed of my Blog. If you see on the image carefully then you see this not a good speed, impact, in my opinion, it's world waste speed ever.

Without Lazy Load Script Speed

Now you can see on the image it's not a dem speed the main loading speed is only 89%.

With lazy load script

Now I am already showing you the speed without lazy loading script so now let's show you the speed using lazy load script on my blog.

With Lazy Load Script Speed

Now if you see on both images with lazy load script without lazy load script there is so much different fast one is the speed then fully load time and on the last the page size and request number. I hope you will understand both differences.

How to install the lazy load script

Open your Blogger dashboard go to the theme section then and HTML edit of your theme. Now search for </body> tag then add the below code after </body> tag.

<script>
//<![CDATA[
// Lazy Load
(function(a){a.fn.lazyload=function(b){var c={threshold:0,failurelimit:0,event:"scroll",effect:"show",container:window};if(b){a.extend(c,b)}var d=this;if("scroll"==c.event){a(c.container).bind("scroll",function(b){var e=0;d.each(function(){if(a.abovethetop(this,c)||a.leftofbegin(this,c)){}else if(!a.belowthefold(this,c)&&!a.rightoffold(this,c)){a(this).trigger("appear")}else{if(e++>c.failurelimit){return false}}});var f=a.grep(d,function(a){return!a.loaded});d=a(f)})}this.each(function(){var b=this;if(undefined==a(b).attr("original")){a(b).attr("original",a(b).attr("src"))}if("scroll"!=c.event||undefined==a(b).attr("src")||c.placeholder==a(b).attr("src")||a.abovethetop(b,c)||a.leftofbegin(b,c)||a.belowthefold(b,c)||a.rightoffold(b,c)){if(c.placeholder){a(b).attr("src",c.placeholder)}else{a(b).removeAttr("src")}b.loaded=false}else{b.loaded=true}a(b).one("appear",function(){if(!this.loaded){a("<img />").bind("load",function(){a(b).hide().attr("src",a(b).attr("original"))[c.effect](c.effectspeed);b.loaded=true}).attr("src",a(b).attr("original"))}});if("scroll"!=c.event){a(b).bind(c.event,function(c){if(!b.loaded){a(b).trigger("appear")}})}});a(c.container).trigger(c.event);return this};a.belowthefold=function(b,c){if(c.container===undefined||c.container===window){var d=a(window).height()+a(window).scrollTop()}else{var d=a(c.container).offset().top+a(c.container).height()}return d<=a(b).offset().top-c.threshold};a.rightoffold=function(b,c){if(c.container===undefined||c.container===window){var d=a(window).width()+a(window).scrollLeft()}else{var d=a(c.container).offset().left+a(c.container).width()}return d<=a(b).offset().left-c.threshold};a.abovethetop=function(b,c){if(c.container===undefined||c.container===window){var d=a(window).scrollTop()}else{var d=a(c.container).offset().top}return d>=a(b).offset().top+c.threshold+a(b).height()};a.leftofbegin=function(b,c){if(c.container===undefined||c.container===window){var d=a(window).scrollLeft()}else{var d=a(c.container).offset().left}return d>=a(b).offset().left+c.threshold+a(b).width()};a.extend(a.expr[":"],{"below-the-fold":"$.belowthefold(a, {threshold : 0, container: window})","above-the-fold":"!$.belowthefold(a, {threshold : 0, container: window})","right-of-fold":"$.rightoffold(a, {threshold : 0, container: window})","left-of-fold":"!$.rightoffold(a, {threshold : 0, container: window})"})})(jQuery);$(function(){$("img").lazyload({placeholder:"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh1vYSmXKwC-WPBx1HT5RWfIwZaw0Th7MPvejqoUBGkpCf3JFpVMtwrgD-6jxO8nysj4BxvCcMLIO-KeOpnka_-yrjPiDJmxuEUEwj7MkY9zruZJMvrb3dYxiP7fd2wAg6eHTl6QD-BUbPl/s1/arlinadesign.gif",effect:"fadeIn",threshold:"-50"})});
//]]>
</script>

Now save your theme and enjoy the fastest blog.

Last word

So you are now at the end of the post I hope you enjoy this article about installing lazy loading speed on Blogger. If you face any problem then tell us on the below comment box. Thanks for reading us.

How to install lazy load on Blogger

08:14 blogger

Top 7 Blogger Page Types Conditional Tags

So many people ask me how I can create my own blogger template? This why I decided to write all articles about this topic. So before creating your own blogger template, you must need to know HTML, JAVASCRIPT, and CSS. if you know HTML, CSS, JavaScript then you need to know blogger conditional tag. If want to create a blogger theme it's just for you. If you want to use your blogger theme dynamically then your blogger conditional tags help you.

Now all of them are called conditional tag for an example: <data:blog.title/> this tag is use you dynamically get your blog name. If you add this tag anywhere of your theme HTML edit then you see your blog name on the site. If you still don't know anything then there is one more example for you:

On the theme HTML edit

Now I hope you understand the use of the blogger conditional tag. Now if you want to add any widget on the homepage but you hide this widget for post and page then you need to use the blogger page type conditional tag.

So let's talk about the top 7 blogger page types conditional tags

Archive Page

<b:if cond='data:blog.pageType == &quot;archive&quot;'>
Your Element Here
</b:if>

This conditional tag helps you to add any kind widget or element only for the archive page. By using this conditional tag you can customize the archive page.

Index Page

For the home & search page

<b:if cond='data:blog.pageType == &quot;index&quot;'>
Your Element Here
</b:if>

This conditional tag helps you to customize and add any widget only for the home and search page.

Only for the home page

<b:if cond='data:view.isHomepage'>
Your Element Here
</b:if>

If you want to add any widget only for the homepage then this conditional tag helps you do this.

Label Page

For all label

<b:if cond='data:blog.searchLabel'>
Your Element Here
</b:if>

This conditional tag helps you to add any kind of element for the search label page. Just add any widget you want.

For specific label

<b:if cond='data:blog.searchLabel== &quot;LABEL-NAME&quot;'>
Your Element Here
</b:if>

This conditional tag is used for specifying the label page. If you want to add any widget for any specific label then simply you can use this label just add you are specific label name on the LABEL-NAME.

Item Page

For all post

<b:if cond='data:blog.pageType == &quot;item&quot;'>
Your Element Here
</b:if>

If you want to add and customize the item option like read more button then you can use this conditional tag.

For fast post

<b:if cond='data:post.isFirstPost'>
Your Element Here
</b:if>

If you want to customize the fast article then you can use this conditional tag.

Static Page

<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
Your Element Here
</b:if>

If you want to and any widget element on the page then you can use this conditional tag.

Error Page

<b:if cond='data:blog.pageType == &quot;error_page&quot;'>
Your Element Here
</b:if>

This conditional tag used to add any widget on the 404 error page. You can create 404 error page with this conditional tag.

Search Page

For all search result

<b:if cond='data:blog.searchQuery'>
Your Element Here
</b:if>

This conditional tag used to add any kind of widget on the search result page.

For specific search query

<b:if cond='data:blog.searchQuery == &quot;SEARCH-QUERY&quot;'>
Your Element Here
</b:if>

This conditional tag used to add any widget for specific search terms. Just add the specific search terms on the SEARCH_QUARY.

Conclusion

There is the end of this article. If you face any problem with the blogger conditional tag then simply comment down below I will try my best to help you. Thanks for with us.

Top 7 Blogger Page Types Conditional Tags

08:10 blogger

How to install flat UI color picker on Blogger

Color picker: So many people see color picker on so many websites.  Many want to add color pickers on their Blogger blog but they see no way for doing this. To fix all problem I am writing this article about how to install flat UI color picker on Blogger.

What is the color picker?

Color picker also called color chooser and color tool. It's mostly used for get any color code. Color is one of the great tools for graphic design and web design for an example if you want to know what is the color code of my site the there is only one way and it is the color picker.

What is the use of color picker?

I am already telling you what is the use of color picker but let's tell you some more details about the use of color picker. Color pickers mostly used to get color code and convert any color code to a solid color. There is the same more uses details:

1. Getting color code.
2. Know about the color from the hex & HTML color code.
3. Own color creation.
4. Color mixing.
5. Many more...

How to install this tool

I am already waste your so much time this why I am don't waste any more time just let talk about the main topic. So now I am telling you how to install this flat UI color picker tool on any post or page of your blog page.

Open your Blogger dashboard the create any post or page where you want to add this tool now go to the HTML view/tab of your post/page editor then paste the below code on the HTML tab/view and publish your post/page.

<div id="flatuarlina"><ul class="flatui"><li style="background: #5C97BF;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #5C97BF</span><br />
</li>
<li style="background: #4B77BE;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #4B77BE</span><br />
</li>
<li style="background: #1F3A93;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #1F3A93</span><br />
</li>
<li style="background: #2574A9;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #2574A9</span><br />
</li>
<li style="background: #67809F;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #67809F</span><br />
</li>
<li style="background: #34495E;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #34495E</span><br />
</li>
<li style="background: #3A539B;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #3A539B</span><br />
</li>
<li style="background: #1E8BC3;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #1E8BC3</span><br />
</li>
<li style="background: #6BB9F0;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #6BB9F0</span><br />
</li>
<li style="background: #22313F;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #22313F</span><br />
</li>
<li style="background: #336E7B;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #336E7B</span><br />
</li>
<li style="background: #19B5FE;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #19B5FE</span><br />
</li>
<li style="background: #89C4F4;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #89C4F4</span><br />
</li>
<li style="background: #2C3E50;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #2C3E50</span><br />
</li>
<li style="background: #3498DB;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #3498DB</span><br />
</li>
<li style="background: #22A7F0;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #22A7F0</span><br />
</li>
<li style="background: #94E0EE;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #94E0EE</span><br />
</li>
<li style="background: #52B3D9;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #52B3D9</span><br />
</li>
<li style="background: #59ABE3;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #59ABE3</span><br />
</li>
<li style="background: #26A65B;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #26A65B</span><br />
</li>
<li style="background: #1E824C;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #1E824C</span><br />
</li>
<li style="background: #00B16A;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #00B16A</span><br />
</li>
<li style="background: #2ABB9B;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #2ABB9B</span><br />
</li>
<li style="background: #4DAF7C;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #4DAF7C</span><br />
</li>
<li style="background: #03A678;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #03A678</span><br />
</li>
<li style="background: #26C281;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #26C281</span><br />
</li>
<li style="background: #019875;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #019875</span><br />
</li>
<li style="background: #3FC380;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #3FC380</span><br />
</li>
<li style="background: #16A085;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #16A085</span><br />
</li>
<li style="background: #2ECC71;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #2ECC71</span><br />
</li>
<li style="background: #C5EFF7;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #C5EFF7</span><br />
</li>
<li style="background: #C8F7C5;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #C8F7C5</span><br />
</li>
<li style="background: #049372;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #049372</span><br />
</li>
<li style="background: #36D7B7;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #36D7B7</span><br />
</li>
<li style="background: #66CC99;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #66CC99</span><br />
</li>
<li style="background: #1BA39C;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #1BA39C</span><br />
</li>
<li style="background: #1BBC9B;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #1BBC9B</span><br />
</li>
<li style="background: #65C6BB;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #65C6BB</span><br />
</li>
<li style="background: #BFBFBF;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #BFBFBF</span><br />
</li>
<li style="background: #ABB7B7;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #ABB7B7</span><br />
</li>
<li style="background: #DADFE1;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #DADFE1</span><br />
</li>
<li style="background: #95A5A6;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #95A5A6</span><br />
</li>
<li style="background: #C5DCE2;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #C5DCE2</span><br />
</li>
<li style="background: #BDC3C7;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #BDC3C7</span><br />
</li>
<li style="background: #EEEEEE;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #EEEEEE</span><br />
</li>
<li style="background: #D2D7D3;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #D2D7D3</span><br />
</li>
<li style="background: #F0E2C5;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #F0E2C5</span><br />
</li>
<li style="background: #EB9532;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #EB9532</span><br />
</li>
<li style="background: #E67E22;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #E67E22</span><br />
</li>
<li style="background: #F27935;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #F27935</span><br />
</li>
<li style="background: #F9BF3B;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #F9BF3B</span><br />
</li>
<li style="background: #F7CA18;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #F7CA18</span><br />
</li>
<li style="background: #F9690E;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #F9690E</span><br />
</li>
<li style="background: #F39C12;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #F39C12</span><br />
</li>
<li style="background: #D35400;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #D35400</span><br />
</li>
<li style="background: #F4D03F;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #F4D03F</span><br />
</li>
<li style="background: #F5AB35;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #F5AB35</span><br />
</li>
<li style="background: #EB974E;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #EB974E</span><br />
</li>
<li style="background: #F2784B;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #F2784B</span><br />
</li>
<li style="background: #F4B350;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #F4B350</span><br />
</li>
<li style="background: #E87E04;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #E87E04</span><br />
</li>
<li style="background: #E74C3C;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #E74C3C</span><br />
</li>
<li style="background: #CF000F;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #CF000F</span><br />
</li>
<li style="background: #C0392B;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #C0392B</span><br />
</li>
<li style="background: #D64541;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #D64541</span><br />
</li>
<li style="background: #EF4836;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #EF4836</span><br />
</li>
<li style="background: #96281B;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #96281B</span><br />
</li>
<li style="background: #D91E18;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #D91E18</span><br />
</li>
<li style="background: #E26A6A;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #E26A6A</span><br />
</li>
<li style="background: #FF0000;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #FF0000</span><br />
</li>
<li style="background: #F22613;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #F22613</span><br />
</li>
<li style="background: #E08283;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #E08283</span><br />
</li>
<li style="background: #9B59B6;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #9B59B6</span><br />
</li>
<li style="background: #8E44AD;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #8E44AD</span><br />
</li>
<li style="background: #BE90D4;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #BE90D4</span><br />
</li>
<li style="background: #BF55EC;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #BF55EC</span><br />
</li>
<li style="background: #9A12B3;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #9A12B3</span><br />
</li>
<li style="background: #913D88;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #913D88</span><br />
</li>
<li style="background: #722D6A;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #722D6A</span><br />
</li>
<li style="background: #740A4E;"><span class="kodebesar"><span class="kodekecil">Kode Warna</span> #740A4E</span><br />
</li>
</ul></div><style scoped="" type="text/css">/* Flat UI Color by www.arlinacode.com */ #flatuarlina ul.flatui{position:relative;display:table;width:100%;text-align:center;color:#fff;font-size:12px;margin:auto;position:relative;padding:0} #flatuarlina ul.flatui li{position:relative;display:flex;float:left;width:25%;min-height:160px;padding:4%;list-style:none;background:#444;text-align:center;font-family:inherit;color:rgba(255,255,255,);font-size:1.1rem;margin:auto;font-weight:500;backface-visibility:hidden;transition:all .3s cubic-bezier(1,0.015,0.295,1.225)} #flatuarlina ul.flatui li:hover{z-index:4} #flatuarlina ul.flatui li:before{content:'';display:block;position:absolute;top:0;left:0;right:0;bottom:0;background:;z-index:1;opacity:0;visibility:hidden;transform:scale(0.4)} #flatuarlina ul.flatui li:hover:before{opacity:1;visibility:visible;transform:scale(1.0)} #flatuarlina ul.flatui li:after{content:'Salin kode warna';display:block;position:absolute;padding:10px 0;font-weight:400;font-size:.8rem;left:0;right:0;bottom:0;opacity:0;color:rgba(255,255,255,.5);visibility:hidden;transform:translate(0,30px);transition:all .3s cubic-bezier(1,0.015,0.295,1.225);transition-delay:.1s} #flatuarlina ul.flatui li:hover:after{opacity:1;visibility:visible;transform:translate(0,-10px);z-index:1;transition-delay:.8s} #flatuarlina ul.flatui li .kodebesar{width:100%;padding:0;display:block;float:none;margin:auto;clear:both;z-index:3} #flatuarlina ul.flatui li .kodekecil{width:100%;padding:0;display:block;float:none;margin:0 auto 10px auto;font-weight:400;font-size:.8rem;clear:both;z-index:3} @media screen and (max-width:800px){#flatuarlina ul.flatui li{width:33.3%;line-height:normal}} @media screen and (max-width:640px){#flatuarlina ul.flatui li{width:50%}} @media screen and (max-width:480px){#flatuarlina ul.flatui li{width:100%}} .content-areapix {width:100%;} .sidebar-widget-areapix {display:none;} </style>

Now if you want to see the demo of this flat UI color picker just click on the below demo button then you see the full demo of this tool.
DEMO

Last word

Now after this tool adding done just add this below HTML code on the HTML view of your post/page.

Tool create by <a href="http://seokingtools.com/" target="_blank">SeokingTools Tutorial</a>.

Now you are on the last of this article thanks for reading this article.

How to install flat UI color picker on Blogger

08:07 blogger

HTML CONVERTER TOOLS

CODE WAS ENCODED BELOW:

HTML CONVERTER TOOLS

02:18

JavaScript Decoding Tools

To use this tool, paste the encrypted js into the frame, then click on the appropriate encoding for successful decoding tool. You can try them one by one until you succeed!

There are 2-layer, 3-layer coding segments ... then people decode the first layer below, then copy the pasted paragraph to paste it again to decode the code.

Decode JavaScript

None Eval _Number Array URL Encode Packer Javascript Obfuscator My Obfuscate

Beautify Highlight

Please select the appropriate encoding!

JavaScript Decoding Tools

02:03

How To Make Blog Articles Cannot Be Copy Paste In Specified Sections

How To Make Blog Articles Can Not Be Copy Paste In Specified Sections  - Good afternoon friend blogger, in this article I will give a post about Anti Copaser . Why can be called anti-copaser? Because this prevents duplicate content, content theft, and many more from certain parties who are not responsible without the publisher's approval.
Who also who is not upset about their own content is stolen by irresponsible parties? I also don't want that to happen. Because it will harm the publisher who has thought about what articles they will post.

This happens from the era of predecessor bloggers to today's bloggers, it is often triggered because the novice blogger or lazy blogger who is confused to post an article of each of them. We recommend that if you want to duplicate someone's content at least include the source, because it will create a reciprocal relationship that is mutually beneficial both from the duplicator and the publisher himself.



Therefore to prevent people who are not responsible for copying and pasting our article, this time I will provide a solution, namely by applying an anti-copas method or script. Take it easy, this script can still be copied on certain parts, namely the Quote section.

How To Make Blog Articles Cannot Be Copy Paste In Specified Sections

04:28

How to Change the Position of Anchor Ads Ads Under the Mobile Version

SeoKingTools.com - Google AdSense is an advertising program owned by Google which is currently popular and until now there is no one who can surpass Google AdSense, even though there are many advertising programs that appear as alternatives to Google AdSense , but in fact Google AdSense is still the star.

Anchor ads or what we call automatic ads have terms that are not too complicated like Matched Content ads, Macthed content ads are special ads for blog publishers who flock to get these ads because they have a different appearance than other adsense ads.

How to Change the Position of Anchor Ads Ads Under the Mobile Version

1. Please login to your Adsense by using the link below, then enter the Dashboard menu or Google Adsense homepage.

https://www.google.com/adsense/login

2. Enter the Ads menu, then click Summary

3.Click Get the CodeAnchor Advertising [AUTO ADVERTISING]

4.Then please copy the Adsense code by clicking Copy Code Snippet and Place itABOVEcode </head> Edit your Blogger HTML template.

5. Please clickSAVEand Wait for a few minutes to appear at the bottom of the Mobile User.

How To Change Anchor Ads Under Mobile Version

1. Please enter the Blogger Dashboard
2. Go to the menu THEMEand click Edit HTML
3. Next look for the code </head> and paste the JS code below exactly ABOVEthe code.

<script>
  (adsbygoogle = window.adsbygoogle || []).push({
    enable_page_level_ads: true,
    overlays: {bottom: true}
  });
</script>

4. Then click SAVEand done.

How easy is it not for the tutorial How to Change the Position of Anchor Ads Ads Under the Mobile Versionfor those of you who have problems or questions about bloggers, please comment in the comments column below this article.

How to Change the Position of Anchor Ads Ads Under the Mobile Version

03:21 adsense, Anchor Ads, Mobile Version

How to Make Download, Demo and Buy Now Buttons on Blogger

SeokingTools.com - On this occasion I will give a tutorial how How to Make Download, Demo and Buy Now Buttons on Blogger with CSS SVG to make blogs more quickly accessible, which is certain make your blog more cool and nice to look at and certainly make visitors more comfortable on your blog.
In addition this button has a very cool Hover which is a transition animation and color replacement besides that this button has an antique slide when you try to click the button. This icon must use Awesome Fonts and if you don't use it you can switch to SVG. How to Make Download, Demo and Buy Now Buttons on Blogger 1. Please log in to your blogger.com account using your Gmail
2. Go to the menu THEME > click Edit HTML 3. Next look for the code ]]></b:skin> and paste the code below exactly ABOVE the code.

/* Tombol Download SeoKingTools.com */
#btn-keren {margin: 10px auto;
text-align: center;}
#btn-keren br {display: none;}
.btn-keren1, .btn-keren2, .btn-keren3 {position: relative;display: inline-block;height: 50px;width: 200px;line-height: 50px;padding: 0;border-radius: 50px;background: #fdfdfd;border: 2px solid #009688;margin: 10px;transition: .5s}
.btn-keren2 {border: 2px solid #3f51b5;}
.btn-keren3 {border: 2px solid #d83500;}
.btn-keren1:hover {background-color: #009688;}
.btn-keren2:hover {background-color: #3f51b5;}
.btn-keren3:hover {background-color: #d83500;}
.btn-keren1:hover span.circle, .btn-keren2:hover span.circle2, .btn-keren3:hover span.circle3 {left: 100%;margin-left: -45px;background-color: #fdfdfd;}
.btn-keren1:hover span.circle{color: #009688;}
.btn-keren2:hover span.circle2 {color: #3f51b5;}
.btn-keren3:hover span.circle3 {color: #d83500;}
.btn-keren1:hover span.title, .btn-keren2:hover span.title2, .btn-keren3:hover span.title3 {left: 40px;opacity: 0;}
.btn-keren1:hover span.title-hover, .btn-keren2:hover span.title-hover2, .btn-keren3:hover span.title-hover3 {opacity: 1;left: 40px;}
.btn-keren1 span.circle, .btn-keren2 span.circle2, .btn-keren3 span.circle3 {display: block;background-color: #009688;color: #fff;position: absolute;float: left;margin: 5px;line-height: 55px;height: 40px;width: 40px;top: 0;left: 0;transition: .5s;border-radius: 50%;}
.btn-keren2 span.circle2 {background-color: #3f51b5;}
.btn-keren3 span.circle3 {background-color: #d83500;}
.btn-keren1 span.title,.btn-keren1 span.title-hover, .btn-keren2 span.title2,.btn-keren2 span.title-hover2,.btn-keren3 span.title3, .btn-keren3 span.title-hover3 {position: absolute;left: 90px;text-align: center;margin: 0 auto;font-size: 16px;font-weight: bold;color: #009688;transition: .5s;}
.btn-keren2 span.title2,.btn-keren2 span.title-hover2 {color: #3f51b5;left: 80px;}
.btn-keren3 span.title3,.btn-keren3 span.title-hover3 {color: #d83500;left: 80px;}
.btn-keren1 span.title-hover, .btn-keren2 span.title-hover2, .btn-keren3 span.title-hover3 {left: 80px;opacity: 0;}
.btn-keren1 span.title-hover, .btn-keren2 span.title-hover2, .btn-keren3 span.title-hover3 {
color: #fff;
}

4. Please click SAVE, snext please make a new post and to apply the code please copy the code below and paste it in the HTML menu (Not Compose)

<div id="btn-keren">
<a href="#" class="btn-keren1" target="_blank">
<span class="circle"><svg style="width:24px;height:24px" viewBox="0 0 24 24"> <path fill="currentColor" d="M21,14H3V4H21M21,2H3C1.89,2 1,2.89 1,4V16A2,2 0 0,0 3,18H10L8,21V22H16V21L14,18H21A2,2 0 0,0 23,16V4C23,2.89 22.1,2 21,2Z" /> </svg></span>
<span class="title">Demo</span>
<span class="title-hover">Click here</span>
</a>
</div>

<div id="btn-keren">
<a href="#" class="btn-keren2" target="_blank">
<span class="circle2"><svg style="width:24px;height:24px" viewBox="0 0 24 24"> <path fill="currentColor" d="M5,20H19V18H5M19,9H15V3H9V9H5L12,16L19,9Z" /> </svg></span>
<span class="title2">Download</span>
<span class="title-hover2">Click here</span>
</a>
</div>

<div id="btn-keren">
<a href="#" class="btn-keren3" target="_blank">
<span class="circle3"><svg style="width:24px;height:24px" viewBox="0 0 24 24"> <path fill="currentColor" d="M17,18C15.89,18 15,18.89 15,20A2,2 0 0,0 17,22A2,2 0 0,0 19,20C19,18.89 18.1,18 17,18M1,2V4H3L6.6,11.59L5.24,14.04C5.09,14.32 5,14.65 5,15A2,2 0 0,0 7,17H19V15H7.42A0.25,0.25 0 0,1 7.17,14.75C7.17,14.7 7.18,14.66 7.2,14.63L8.1,13H15.55C16.3,13 16.96,12.58 17.3,11.97L20.88,5.5C20.95,5.34 21,5.17 21,5A1,1 0 0,0 20,4H5.21L4.27,2M7,18C5.89,18 5,18.89 5,20A2,2 0 0,0 7,22A2,2 0 0,0 9,20C9,18.89 8.1,18 7,18Z" />
</svg></span>
<span class="title3">Buy Now</span>
<span class="title-hover3">Click here</span>
</a>
</div>

5. If you only want to install one or two of the above buttons, for example, only the demo button, please delete the others from the tag <a href='...> To </a> For example, as shown below.

<div id="btn-keren">
<a href="#" class="btn-keren1" target="_blank">
<span class="circle"><svg style="width:24px;height:24px" viewBox="0 0 24 24"> <path fill="currentColor" d="M21,14H3V4H21M21,2H3C1.89,2 1,2.89 1,4V16A2,2 0 0,0 3,18H10L8,21V22H16V21L14,18H21A2,2 0 0,0 23,16V4C23,2.89 22.1,2 21,2Z" /> </svg></span>
<span class="title">Demo</span>
<span class="title-hover">Click here</span>
</a>
</div>

6. When finished you can see the demo yourself on your website or through the demo below.

Demo

How easy is it not for the tutorial How to Make Download, Demo and Buy Now Buttons on Blogger easily, if you have questions about bloggers please comment in the comments column below this article.

How to Make Download, Demo and Buy Now Buttons on Blogger

18:24