Membuat Meta Tag Description Otomatis

Membuat Meta Tag Description Otomatis - Menurut saya meta tag description sebaiknya kita setting secara manual karena cara manual ini direkomendasikan  oleh blogger akan tetapi sangatlah menyebalkan jika kita harus membuat meta tag description secara terus menerus saat membuat artikel baru.

Maka dari itu saya akan memberikan tutorial cara membuat meta tag destription secara otomatis tanpa perlu repot-repot lagi nantinya. Sebelumnya sobat harus memastikan bahwa opsi meta description blog sobat tidak aktif.
  • Membuat Meta Tag Description Otomatis
  • Login Blogger.com
  • Masuk template dan edit template
  • Cari </title> masukan kode dibawah tepat dibawah </title>
<meta expr:content='data:blog.pageName + &quot; dari blog &quot; + data:blog.title + &quot; dengan judul &quot; + data:blog.pageName' name='description'/>
  • Kemudian simpan template

Sekian Membuat Meta Tag Description Otomatis semoga bermanfaat.

Membuat Featured Random Post Slider Keren

Membuat Featured Random Posts Slider Keren - Random Posts Slider adalah widget yang berfungsi menampilkan potingan tertentu pada home page atau halaman depan blog kita yang biasanya berupa gambar dan teks judul postingan artikel tertentu.

Ini merupakan feature yang dikembangkan oleh contohblog dan feature yang terbilang cukup diminati oleh para blogger terutama untuk blog berita atau blog majalah. Featured Random Posts Slider ini pun telah di setting agar menjadi responsive jadi lebih keren tentunya.

Membuat Featured Random Posts Slider Keren

  • Login Blogger.com
  • Masuk menu template kemudian edit tamplate
  • Kemudian copas kode dibawah ini tepat diatas kode </head>
<!-- Featured Random Posts Slider Start -->
<style type='text/css'>
#slides{overflow:hidden}
#slides ul,#slides li{padding:0;margin:0;list-style:none;position:relative}
#slides ul{height:250px}
#slides li{display:none;background-color:white;padding:4px;margin-top:0;position:absolute}
#slides li:nth-child(1),#slides li:nth-child(2),#slides li:nth-child(3),#slides li:nth-child(4){display:block}
#slides li:nth-child(1){width:49.5%;height:100%}
#slides li:nth-child(2){left:50.3%;width:24.5%;height:49.5%}
#slides li:nth-child(3){left:75.5%;width:24.5%;height:49.5%}
#slides li:nth-child(4){left:50.3%;top:51%;height:49%;width:49.7%}
#slides img{width:100%;height:100%}
#slides h4{position:absolute;bottom:20px;width:96%;padding:0 10px;margin:0 -5px;font-size:16px;z-index:3;color:white;text-shadow:0 1px 2px #918F8F}
#slides li:nth-child(3) h4,#slides li:nth-child(2) h4{font-size:14px}
#slides .label_text{display:none;position:absolute;z-index:3;bottom:10px;width:100%;padding:0 10px;margin:0 -5px;font-size:9px;color:white}
.randomnya .overlayx{position:absolute;top:0;left:0;border:4px solid white;width:97%;height:97%;z-index:2;background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRZMjvVQe347YmrWjCYHvfdJeIIwjtSJ-hXe3SCF0hPh2TZkmfmPqXJKVjV_alS985GVqYo0DjZlF9vKNnO_L7bf6Vu-gElAJiwppck_u1yBwbF4TBp8_x_KaYGBDfBuZuGUAlsjfZ1F4/s1600/linebg-fade.png);background-position:50% 50%;background-repeat:repeat-x}
#slides li:nth-child(1) .overlayx{background-position:0 0}
#slides .label_text span{margin-right:2px}
#slides li:nth-child(2) .autname,#slides li:nth-child(3) .autname{display:none}
#slides .cmnum{position:absolute;background-color:#7C7C7C;padding:2px 3px;display:block;top:-5px;right:10px}
#slides .cmnum::after{content:&quot;&quot;;width:0;height:0;border-width:1px 4px;border-style:solid;border-color:#7C7C7C #7C7C7C transparent transparent;position:absolute;top:100%;right:0}
ul.randomnya li:hover .overlayx{-ms-filter:&quot;progid:DXImageTransform.Microsoft. Alpha(Opacity=10)&quot;;filter:alpha(opacity=10);-khtml-opacity:0.1;-moz-opacity:0.1;opacity:0.1}
#slides li{-webkit-transition:all .4s ease-in-out;-moz-transition:all .4s ease-in-out;-o-transition:all .4s ease-in-out;-ms-transition:all .4s ease-in-out;transition:all .4s ease-in-out}
#slides {font-family:Arial,sans-serif}
#top-main{position:relative}
#top-main .widget{border:none;padding:1px}
#top-main h2{position:absolute;left:-9999px}
#buttons{position:absolute;bottom:0;right:0;display:none}
#buttons a{display:inline-block;text-indent:-9999px;background-color:white;width:25px;height:17px;margin:0 0 0 7px;border:1px solid #CECECE;position:relative}
#prev::before,#next::before{content:&quot;&quot;;width:0;height:0;border-width:5px 9px;border-style:solid;border-color:transparent #535353 transparent transparent;position:absolute;top:50%;margin-top:-5px;margin-left:-15px;left:50%}
#next::before{border-color:transparent transparent transparent #535353;margin-right:-15px;right:50%;margin-left:auto;left:auto}

@media only screen and (min-width:768px) and (max-width:999px){
  #slides ul{height:200px}
  #slides h4{font-size:15px}
  #slides li:nth-child(3) h4,#slides li:nth-child(2) h4{font-size:11px}
  }
@media only screen and (max-width:767px){
  #slides ul{height:200px}
  #slides h4{font-size:15px}
  #slides li:nth-child(3) h4,#slides li:nth-child(2) h4{font-size:11px}
}
@media only screen and (max-width:479px){
  #slides ul{height:450px}
  #slides li:nth-child(1){width:100%;height:49.5%}
  #slides li:nth-child(2){left:0;top:50%;width:49.5%;height:24.5%}
  #slides li:nth-child(3){left:50.5%;top:50%;width:49.5%;height:24.5%}
  #slides li:nth-child(4){left:0;top:75%;height:24.5%;width:100%}
}
</style>
<script type='text/javascript'>
//<![CDATA[
function RandomPost(a){(function(e){var i={blogURL:"",MaxPost:4,RandompostActive:true,idcontaint:"#randompost",ImageSize:100,loadingClass:"loadingxx",pBlank:"http://1.bp.blogspot.com/-htG7vy9vIAA/Tp0KrMUdoWI/AAAAAAAABAU/e7XkFtErqsU/s1600/grey.gif",MonthNames:["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"],tagName:false};i=e.extend({},i,a);var h=e(i.idcontaint);var b=i.blogURL;var d=i.MaxPost*600;if(i.blogURL===""){b=window.location.protocol+"//"+window.location.host}h.html('<div id="buttons"><a href="#" id="prev">prev</a><a href="#" id="next">next</a></div><div id="slides"><ul class="randomnya"></ul></div>').addClass(i.loadingClass);var g=function(z){var t,k,r,o,x,A,s,w,y,u,n="",v=z.feed.entry;for(var q=0;q<v.length;q++){for(var p=0;p<v[q].link.length;p++){if(v[q].link[p].rel=="alternate"){t=v[q].link[p].href;break}}for(var m=0;m<v[q].link.length;m++){if(v[q].link[m].rel=="replies"&&v[q].link[m].type=="text/html"){r=v[q].link[m].title.split(" ")[0];break}}if("media$thumbnail"in v[q]){x=v[q].media$thumbnail.url.replace(/\/s[0-9]+\-c/g,"/s"+i.ImageSize+"-c")}else{x=i.pBlank.replace(/\/s[0-9]+(\-c|\/)/,"/s"+i.ImageSize+"$1")}k=v[q].title.$t;u=v[q].published.$t.substring(0,10);o=v[q].author[0].name.$t;A=u.substring(0,4);s=u.substring(5,7);w=u.substring(8,10);y=i.MonthNames[parseInt(s,10)-1];n+='<li><a target="_blank" href="'+t+'"><div class="overlayx"></div><img class="random" src="'+x+'"/><h4>'+k+'</h4></a><div class="label_text"><span class="date"><span class="dd">'+w+'</span><span class="dm">'+y+'</span><span class="dy">'+A+'</span></span><span class="autname">'+o+'</span><span class="cmnum">'+r+"</span></div></li>"}e("ul",h).append(n)};var c=function(o){Total_Posts_Number=o.feed.openSearch$totalResults.$t;if(Total_Posts_Number<=i.MaxPost){i.MaxPost=Total_Posts_Number}var j=[];while(j.length<i.MaxPost){var q=Math.ceil(Math.random()*Total_Posts_Number);var p=false;for(var n=0;n<j.length;n++){if(j[n]==q){p=true;break}}if(!p){j[j.length]=q}}var m="/-/"+i.tagName;if(i.tagName===false){m=""}if(i.RandompostActive===true){for(var l=0;l<i.MaxPost;l++){e.ajax({url:b+"/feeds/posts/default"+m+"?start-index="+j[l]+"&max-results=1&orderby=published&alt=json-in-script",success:g,dataType:"jsonp",cache:true})}}else{e.ajax({url:b+"/feeds/posts/default"+m+"?max-results="+i.MaxPost+"&orderby=published&alt=json-in-script",success:g,dataType:"jsonp",cache:true})}};var f=function(){if(i.tagName===false){e.ajax({url:b+"/feeds/posts/default?max-results=0&alt=json-in-script",success:c,dataType:"jsonp",cache:true})}else{e.ajax({url:b+"/feeds/posts/default/-/"+i.tagName+"?max-results=0&alt=json-in-script",success:c,dataType:"jsonp",cache:true})}e(window).bind("load",function(){setTimeout(function(){var k=5000;var l=setInterval("rotate()",k);e("#slides li:first").before(e("#slides li:last"));e("#prev").click(function(){e("#slides li:first").before(e("#slides li:last"));return false});e("#next").click(function(){e("#slides li:last").after(e("#slides li:first"));return false});e("#slides").hover(function(){clearInterval(l)},function(){l=setInterval("rotate()",k)});function j(){e("#next").click()}h.removeClass(i.loadingClass)},d)})};e(document).ready(f)})(jQuery)};
//]]>
</script>
<!-- Featured Random Posts Slider End -->
  •  Kemudian copas kode dibawah ini tepat dibawah kode <div class='main-wrapper'>
<!-- Featured Random Post Slider Start -->
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<div id='top-main'>
 <b:section class='main' id='top-main1' preferred='yes'/>
</div>
</b:if></b:if>
<!-- Featured Random Post Slider End -->
  • Simpan Template
  • Klik Tataletak/Layout
  • Add Gadget diatas Blog Post  kemudian Add HTML/JavaScript dan copas kode dibawah
<div id="randompostxx"></div>
<script type='text/javascript'>
//<![CDATA[
$(document).ready(function () {
RandomPost({
MaxPost:4,
RandompostActive:false,
idcontaint:"#randompostxx",
ImageSize:200,
tagName:"Label"
});
});
//]]>
</script>
  • Klik simpan dan beres.
 Sekian cara Membuat Featured Ramdom Post Slider Keren semoga bermanfaat.

Membuat Halaman 404 Not Found di Blog

Mungkin halaman 404 Not Found atau "halaman tidak ditemukan" bukanlah sesuatu yang penting tetapi, mungkin sobat pernah membagikan url artikel blog sobat di sosial media seperti facebook, twitter, youtube atau lain sebagainya. Akan tetapi lain soalnya jika artikel yang sobat bagikan sudah sobat hapus maka yang akan terjadi bila ada pembaca/pengunjung yang mengakses halaman tersebut akan menjumpai halaman yang kosong. Hal demikian dapat membuat pengunjung anda merasa bingun dan berakibat meninggalkan blog sobat.

Maka dari itu halaman 404 Not Found pada blog sangat bermanfaat untuk memberitahukan pada pengunjung bahwa postingan atau halaman yang sedang dicari tidak ada atau sudah dihapus. Silahkan sibak bagaimana cara membuatnya.

Membuat Halaman 404 Not Found di Blog
  • Masuk akun Blogger.com
  • Kemudian klik Template -> Edit Template
  • Cari kode "]]></b:skin>" kemudian tarus script dibawah tepat diatas ]]></b:skin>
/*Desain Halaman 404 Error Not Found
----------------------------------------------- */
#error-page {
background-color:#e9e9e9;
position:fixed !important;
position:absolute;
text-align:center;
top:0;
right:0;
bottom:0;
left:0;
z-index:99999;
}
#error-inner {
margin:11% auto;
}
#error-inner .box-404 {
width:200px;
height:200px;
background:#21afa4;
color:#fff;
font-size:80px;
line-height:200px;
border-radius:10px;
margin:0 auto 50px;
position:relative;
}
#error-inner .box-404::after {
content:&quot; &quot;;
width:0;
height:0;
bottom:-8px;
border-color:#21afa4 transparent transparent;
border-style:solid;
border-width:9px 9px 0;
position:absolute;
left:47%;
}
#error-inner h1 {
text-transform:uppercase;
}
#search-box{position:relative;width:350px;margin:10px auto}
#cse-search-box{height:30px;border-radius:2px;background-color:#fff;overflow:hidden;border:1px solid #bbb}
#search-text{font-size:12px;color:#ddd;border-width:0;background:transparent}
#search-box input[type=&quot;text&quot;]{width:85%;padding:5px 20px 12px 0;color:#666;outline:none}
#search-button{position:absolute;top:0;right:0;height:32px;width:20px;margin-top:10px;font-size:14px;color:#fff;text-align:center;line-height:0;border-width:0;background:url(http://1.bp.blogspot.com/_C6KkooKXCEw/TIBqtV6pdmI/AAAAAAAAGyM/QUBsym_R9V0/s200/search-c.png) no-repeat;cursor:pointer}
#error-inner p {
line-height:0.7em;
font-size:15px;
}
  •  Masukkan juga kode berikut diatas kode </body>
<b:if cond='data:blog.pageType == &quot;error_page&quot;'>
<div id='error-page'>
<div id='error-inner'>
<div class='box-404'>404</div>
<h1>Halaman tidak ditemukan</h1>
<p>Kemungkinan halaman telah dihapus, atau Anda salah menulis URL</p>
<p>Kembali ke <a expr:href='data:blog.homepageUrl'><data:blog.title/></a></p>
<div id='search-box'>
<form action='/search' id='cse-search-box' method='get'>
<input id='search-text' name='q' onblur='if(this.value==&apos;&apos;)this.value=this.defaultValue;' onfocus='if(this.value==this.defaultValue)this.value=&apos;&apos;' type='text' value='Cari di sini ...'/>
<button id='search-button' type='submit'/>
</form>
</div>
</div>
</div>
</b:if> 
  •  Untuk penutupan klik SIMPAN dan beres.
Sekian Membuat Halaman 404 Not Found di Blog. semoga bermanfaat.

Memulai Menjadi Seorang Blogger

Salah satu keajaiban dari menjadi seorang adalah bahwa setiap orang di segala usia dapat menjadi seorang blogger dan mungkin hambatan yang dialami oleh seorang blogger pemula adalah tentang script, cara mendesain dan yang paling umum keluhkan adalah tentang koneksi internet. Saya mungkin kurang begitu mengetahuinya tapi yang saya tahu bermain blogger itu semudah bermain Lego.

Yang sobat harus miliki adalah kreativitas. Sama halnya ketika kita bermain Lego maka, menjadi blogger juga harus memiliki kreativitas yang tinggi karena sadar atau tidak sadar kita dituntut untuk selalu memberikan suguhan artikel yang menarik untuk para pembacanya.

Kemudian yang kedua adalah soal fasilitas dan kemampuan dalam scripting code atau mendesain tampilan. Ini mungkin yang menjadi alasan sobat untuk malas terjun ke dalam dunia blogger, karena banyak yang berfikir bahwa untuk menjadi seorang blogger kita harus memiliki fasilitas yang memadai seperti seperangkan PC termasuk internet kemudian kita harus paham tentang script code dan bisa mendesain, ini adalah anggapan yang salah.

Untuk menjadi seorang blogger, sobat tidak harus memiliki fasilitas yang cukup ataupun kemampuan scripting yang memadai karena, semua itu tidak terlalu penting. Kita dapat memanfaatkan fasilitas yang sudah ada seperti, jika kita inginkan desain layout yang bagus kita tinggal mendownloadnya saja. Sudah banyak web atau blog yang memberikan template secara gratis dan kita tinggal memilihnya sesuai keinginan kita saja.

Kemudian soal PC dan koneksi internet. Sekarang banyak warnet-warnet yang memberikan fasilitar internet cepat dengan harga yang murah atau fasilitas free wifi, sobat dapat memanfaatkan hal tersebut untuk sekedar mengupdate artikel di blog sobat.

Hal yang terpenting dalam blogging adalah kreatifitas yang besar, bukan tentang fasilitas atau sebagainya. Jadi sudah tidak ada alasan lagi bagi sobat untuk tidak atau malas menjadi seorang blogger.