Blogger
Tampilkan postingan dengan label Blogger. Tampilkan semua postingan
Tampilkan postingan dengan label Blogger. Tampilkan semua postingan

Tutorial Cara Melindungi Blog dari Copy Paste mudah & terbaru 2017

Juli 11, 2017 Add Comment
Halo semua, di artikel saya kali ini saya akan membahas tentang Tutorial Cara Melindungi Blog dari Copy Paste mudah & terbaru 2017 untuk menjaga blog anda dari Copy Paste.
Langsung saja simak caranya dibawah ini.

 
Caranya sangat mudah dan simple agar blog anda terlindungi dari tindakan Copy Paste, langsung saja ikuti langkah - langkah berikut dibawah ini.

1. Pertama - tama buka Blogger > Masuk Te Tema
2. Kemudian klik Edit HTML 
3. Lalu cari Kode <body>
4. Lalu gantilah Kode <body> dengan kode berikut dibawah ini.
<body oncontextmenu='return false' onmousedown='return false' onselectstart='return false'>


Baca juga :
Mudah Kan, Sekian artikel saya Kali ini tentang Tutorial Cara Melindungi Blog dari Copy Paste mudah & terbaru 2017.
Terima kasih sudah mampir & semoga bermanfaat

Tunggu Artikel Kami Berikutnya

Jangan Lupa Komentarnya.

Tutorial Cara Membuat Efek Loading Simple di Blog dengan Mudah

Juli 08, 2017 Add Comment
Halo semua, pada artikel saya kali ini saya akan membahas tentang Tutorial Cara Membuat Efek Loading Simple di Blog dengan Mudah 
Bantu saya untuk mengembangkan website saya dengan meninggalkan Komentar 
Yuk, simak langsung saja di bawah ini.

Tutorial Cara Membuat Efek Loading Simple di Blog dengan Mudah


Baca juga :

Oke, sekarang kita akan memulai Tutorial Cara Membuat Efek Loading Simple di Blog dengan Mudah  dengan mengikuti langkah - langkah dibawah ini!

Berikut Bagaimana Tutorial Cara Membuat Efek Loading Simple di Blog dengan Mudah:

1. Pertama - tama Buka Blogger > Template > Edit HTML, Salin dan simpan HTML berikut ini tepat di atas kode </head> atau diatas </body> 
<script type='text/javascript'>
//<![CDATA[
var loader = function () {
  var c, d, e, f, g, h, k = {
      width: "100%",
      height: "2px",
      zIndex: 9999,
      top: "0"
    },
    l = {
      width: 0,
      height: "100%",
      clear: "both",
      transition: "height .3s"
    };
  c = function (a, b) {
    for (var c in b) a.style[c] = b[c];
    a.style["float"] = "left"
  };
  f = function () {
    var a = this,
      b = this.width - this.here;
    0.1 > b && -0.1 < b ? (g.call(this, this.here), this.moving = !1, 100 == this.width && (this.el.style.height = 0, setTimeout(function () {
      a.cont.el.removeChild(a.el)
    }, 100))) : (g.call(this, this.width - b / 4), setTimeout(function () {
      a.go()
    }, 16))
  };
  g = function (a) {
    this.width =
      a;
    this.el.style.width = this.width + "%"
  };
  h = function () {
    var a = new d(this);
    this.bars.unshift(a)
  };
  d = function (a) {
    this.el = document.createElement("div");
    this.el.style.backgroundColor = a.opts.bg;
    this.here = this.width = 0;
    this.moving = !1;
    this.cont = a;
    c(this.el, l);
    a.el.appendChild(this.el)
  };
  d.prototype.go = function (a) {
    a ? (this.here = a, this.moving || (this.moving = !0, f.call(this))) : this.moving && f.call(this)
  };
  e = function (a) {
    a = this.opts = a || {};
    var b;
    a.bg = a.bg || "#2e51a2";
    this.bars = [];
    b = this.el = document.createElement("div");
    c(this.el,
      k);
    a.id && (b.id = a.id);
    b.style.position = a.target ? "relative" : "fixed";
    a.target ? a.target.insertBefore(b, a.target.firstChild) : document.getElementsByTagName("body")[0].appendChild(b);
    h.call(this)
  };
  e.prototype.go = function (a) {
    this.bars[0].go(a);
    100 == a && h.call(this)
  };
  return e
}();
var loader = new loader();
loader.go(30);
loader.go(60);
loader.go(100);
//]]>
</script>
2. Save Template
Untuk mengganti Warna Harap diganti pada Kode diatas yang sudah saya tandai
Baca juga :
Terima kasih sudah mampir & semoga bermanfaat

Tunggu Artikel Kami Berikutnya

Jangan Lupa Komentarnya.

Tutorial Cara Membuat Iklan Disamping Related Post

Juli 07, 2017 Add Comment
Halo semua, pada artikel saya kali ini saya akan membahas tentang Tutorial Cara Membuat Iklan Disamping Related Post yang akan membantu sobat blogger untuk menambah daya tariknya tersendiri
Yuk, simak langsung saja di bawah ini.

 

Baca juga :

Tutorial Cara Membuat Iklan Disamping Related Post

Langsung saja ikuti langkah - langkah dibawah ini:

Cara Membuat Iklan Disamping Related Post

1. Pertama - tama buka Blogger > Template > Edit HTML, kemudian ikuti saja gambar berikut dibawah ini.
 

lalu,
 
2. Kemudian cari Related Post di template kalian dan hapus, kalian bisa temukan related post di atas atau bawah </article>, lihat gambar
 
Jangan Lupa Hapus CSS & Javascript Related Post-nya

3. Jika Sudah dihapus kemudian simpan HTML berikut ini tepat di atas kode </article> 
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style>
#related-posts h4{margin:20px auto 0;font-size:15px;border-bottom:2px solid #333;}
#related-posts h4 span{padding:3px 10px;background:#333;color:#fff;}
#related-posts h4 span:after{float:right;content:&quot;\f097&quot;;font-family:fontawesome;color:#444}
#related-posts ul{list-style: none; margin: 0; max-width: 400px; width: 400px; max-height: 300px;overflow: auto;float: right;}
#related-posts ul li a{padding:4px 10px;background:#555;width:100%;border-left:5px solid #444;border-right:5px solid #444;color:#eee;display:inline-block}
#related-posts ul li{margin:2px auto;}
#related-posts ul li a:hover{color: #FFF;background:tomato;border-color:#d83619;text-decoration:none;}
.iklan{float:left;max-width:300px;max-height:300px;overflow:hidden;margin: 3px 7px;}  
@media screen and (max-width:700px){#related-posts ul{width: 100%;float: none;}.iklan{float:none;margin:10px auto}}
</style>
<script type='text/javascript'>
//<![CDATA[
var relatedTitles=new Array();var relatedTitlesNum=0;var relatedUrls=new Array();function related_results_labels(json){for(var i=0;i<json.feed.entry.length;i++){var entry=json.feed.entry[i];relatedTitles[relatedTitlesNum]=entry.title.$t;for(var k=0;k<entry.link.length;k++){if(entry.link[k].rel=='alternate'){relatedUrls[relatedTitlesNum]=entry.link[k].href;relatedTitlesNum++;break;}}}}
function removeRelatedDuplicates(){var tmp=new Array(0);var tmp2=new Array(0);for(var i=0;i<relatedUrls.length;i++){if(!contains(tmp,relatedUrls[i])){tmp.length+=1;tmp[tmp.length-1]=relatedUrls[i];tmp2.length+=1;tmp2[tmp2.length-1]=relatedTitles[i];}}
relatedTitles=tmp2;relatedUrls=tmp;}
function contains(a,e){for(var j=0;j<a.length;j++)if(a[j]==e)return true;return false;}
function printRelatedLabels(){var r=Math.floor((relatedTitles.length-1)*Math.random());var i=0;document.write('<ul>');while(i<relatedTitles.length&&i<20){document.write('<li><a href="'+relatedUrls[r]+'">'+relatedTitles[r]+'</a></li>');if(r<relatedTitles.length-1){r++;}else{r=0;}
i++;}
document.write('</ul>');}
//]]>
</script>
<div id='related-posts'>
<h4><span>Related post :</span></h4>
<div class='iklan'>
<!-- Isi Iklan -->
<img src='https://s15.postimg.org/rk9cdjfob/banner.jpg'/>
</div>
<!-- End Iklan -->
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=10&quot;' type='text/javascript'/></b:if></b:loop>
<script type='text/javascript'> removeRelatedDuplicates(); printRelatedLabels();
</script>
</div>
</b:if>

3. Save Template.

Sekian artikel saya Kali ini tentang Tutorial Cara Membuat Iklan Disamping Related Post.
Terima kasih sudah mampir & semoga bermanfaat
Tunggu Artikel Kami Berikutnya
Jangan Lupa Komentarnya.

Tutorial Cara Membuat Widget Recent Post Style Disc by Label

Juli 06, 2017 Add Comment
Halo semua, pada artikel saya kali ini saya akan membahas tentang Tutorial Cara Membuat Widget Recent Post Style Disc by Label langsung saja di bawah ini.

Tutorial Cara Membuat Recent Post Style Disc by Label

Ok, postingan yang akan saya bagikan sekarang yaitu membuat Widget Widget Recent Post Style Disc by Label, widget ini mungkin akan bermanfaat untuk kalian yang mempunyai blog dengan niche Lagu/Ost.
Sebelum kita mulai silahkan cek dulu javascript seperti dibawah ini di template kalian yang letaknya ada di atas </head> 


<script src='https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js' type='text/javascript'/>

Widget Recent Post Style Disc by Label

1. Langkah pertama yaitu buka Blogger > Tema > Edit HTML, kemudian tambahkan css berikut ini & letakkan dibawah <style>

2. Jika sudah kemudian silahkan Save Tema. 
/* CSS Recent Post Ost - Arleth98
   ======================================= */
ul.bungkusin-ostnya{list-style:none;margin:0;line-height:normal}
li.post-ostnya{position:relative;float:left;width:115px;text-align:center;font-size:10px;margin:5px 4px}
img.postingan-ost{padding:0;background:#000;margin:2px auto;border-radius:50%;border:1px solid #333}
.showpost_rilis{font-size:10px;float:left}
.recent-details a{float:right;font-size:10px}
.title-ost{border-bottom:0;font-weight:bold;font-family:sans-serif;text-transform:none;line-height:normal;font-size:11px;overflow:hidden;text-align:center;width:100%;height:26px;margin:0;padding:0}
.title-ost a{float:none!important;text-align:center}
li.post-ostnya a{position:relative;float:right}
.da{padding:8px;width:0;border-radius:50%;position:absolute;text-align:center;top:35%;z-index:999999;right:40%;border:2px solid #C7C7C7;background:#222}

3. Kemudian silahkan buka Tata Letak > Add Widget > HTML/Javascript, dan simpan javascript dibawah ini. 
<script type="text/javascript" src='https://cdn.rawgit.com/Arleth98/Js/8cb66fe6/Recent-post-ost.js'></script>
<script type="text/javascript">
var posts_no = 5;
var showcommentpostnya = false;var showrelease_ostnya = false;var showimage_ostnya = true;
document.write('<script src=\"\/feeds\/posts\/default\/-\/Ost?orderby=published&alt=json-in-script&callback=showpost_ost\"><\/script>');
</script>
<noscript>Your browser does not support JavaScript!</noscript>
Tag, Keterangan = (posts_no = 5;, Silahkan Ganti No 5 untuk menampilkan Jumlah postnya)
Tag, Keterangan = (Ost, Ganti Dengan Label Postnya)
 
Demo Bisa kalian lihat di bawah ini

Bila lebar dan tinggi tidak sesuai dengan blog kalian,
Silahkan Atur langsung dibagian CSS nya yang sudah saya Markup.
Terima kasih sudah mampir & semoga bermanfaat
Tunggu Artikel Kami Berikutnya
Jangan Lupa Komentarnya.
Langganan: Postingan (Atom)

Kategori

Kategori