Cara menghilangkan beranda diblog

Menghilangkan beranda diblog yang saya maksud adalah link dibawah artikel dengan achor text "Beranda".Banyak alasan kenapa kita harus menghapus link beranda pada bagian bawah halaman postingan blog blogger ini.

Jika kamu menginginkan link beranda tersebut ditiadakan,begini caranya:

Masuk ke edit HTML > centang expand template widget dan jangan lupa backup template dulu.
Lalu temukan sebaris code seperti dibawah ini,gunakan CTRL+F supaya lebih mudah.

<b:if cond='data:blog.homepageUrl != data:blog.url'>
      <a class='home-link' expr:href='data:blog.homepageUrl'><data:homeMsg/></a>
      <b:else/>
      <b:if cond='data:newerPageUrl'>
        <a class='home-link' expr:href='data:blog.homepageUrl'><data:homeMsg/></a>
      </b:if>
    </b:if>
Lihat pada code yang saya kasih warna merah,hapuslah code yang berwarna merah tersebut. Sekarang simpan template kamu,lalu coba buka halaman postingan dan lihat  bagian bawah. Pastikan bahwa link beranda pada halaman blog kamu sudah tidak ada,semoga berhasil!

Cara membuat blog wordpress

Blog wordpress disini adalah wordpress versi self hosting yaitu yang menggunakan CMS (Content Management System) open source yang dikembangkan oleh wordpress.org.

Versi lainnya dari blog  wordpress adalah blog wordpress gratis dari wordpress.com,dan ini sangat mudah sehingga tidak perlu dibahas lagi.Jika kamu marasa malas menghosting blog sendiri kamu bisa bikin di wordpress.com,namun kamu harus membayar agar mendapat fitur yang lebih banyak.

Menggunakan CMS wordpress hosting sendiri bisa menjadi pilihan jika kamu ada dana untuk blog kamu.Dana untuk membayar sewa hosting sekaligus dana untuk sewa domain yang harus diperpanjang setahun sekali.Saya tidak menganjurkan hosting gratisan,namun tidak masalah jika hanya untuk pembelajaran saja.

Banyak keistimewaan jika kamu bikin blog wordpress self hosting,diantaranya;

• Wordpress adalah CMS yang paling banyak digunakan dan paling mudah.
• Wordpress adalah CMS opensource sehingga kamu bebas bereksplorasi dengan blog kamu.
• Banyak aplikasi buatan pihak ke 3 mendukung Wordpress yang disebut dengan plugin.
• Mendukung PHP karena selain bisa menggantikan javascript,dengan PHP kamu bebas bereksplorasi dengan aplikasi blog.PHP bekerja pada server sehingga blog lebih ringan daripada yang menggunakan aplikasi javascript.
• Blog lebih aman dari banned karena memang berada dalam kuasa penuh kamu,namun dari sisi celah keamanan harus lebih diperhatikan agar tidak diretas orang.

Langkah langkah membuat blog wordpress hosting sendiri.

• Sewa hosting dan domain (1paket) melalui jasa hosting atau menyewa dedicated server sendiri.
• Tentu saja lebih baik menyewa hosting dan domain melalui jasa hosting dulu jika masih pemula,karena memakai dedicated server selain lebih mahal,kamu harus memiliki pengetahuan tentang ini.
• Jika sudah merasa butuh untuk menyewa server,kamu bisa upgrade lain waktu apabila diperlukan.
• Jika kamu menyewa hosting,biasanya jasa hosting sudah menyediakan fitur yang dikenal dengan softaculous.Softaculous adalah  fitur yang menyediakan autoinstaller /fantastico untuk banyak sekali CMS website.Dengan autoinstaller kamu hanya tinggal melakukan one click install untuk blog wordpress kamu,maka blog sudah jadi.Hal lebih lanjut bisa berkonsultasi kepada penyedia hosting,bahkan mereka ada yang mau sekaligus menginstallkan blog WP kamu.
• Bog sekarang sudah jadi,tinggal kamu memilih template sesuai dengan tema kesukaan melalui admin area dan mulailah posting.Beragam plugin yang dibutuhkan juga tersedia dan bisa langsung diinstall melalui admin area.

Hal lain untuk cara tips dan trik blog wordpress,kita bahas pada posting selanjutnya.

Cara membuat autoreadmore blogspot terbaru tanpa javascript

Auto readmore untuk blogspot model yang ini paling banyak diminati karena kesadaran akan pentingnya sebuah blog yang memiliki akses loading yang ringan.Loading blog ringan dimana disukai oleh visitor serta mesing pencari seperti google.
Kebanyakan template yang menggunakan auto readmore masih menggunakan javascript sehingga menambah beban loading halaman index blog.Artinya,loading blog sama beratnya jika tanpa menggunakan auto readmore.
Autoreadmore tanpa javascript ternyata jauh lebih ringan sehingga tidak percuma jika blog menggunakan fitur ini.Semua gambar thumbnail dan potongan artikel yang ditampilkan autoreadmore ini adalah benar benar ukuran yang dikompresi,itulah alasan kenapa menjadi lebih ringan.

Tag/script  autoreadmore ini memanfaatkan tag dari blogger sendiri.Dan salah satu keistimewan adalah tambahan  thumbnail default.Maksudnya yaitu jika postingan blog tidak ada foto(img) nya, maka thumbnal pengganti akan  muncul sebagai thumbnail default.Mirip sama wordpress gituloooh,,,,,.

Kerenkan?,,,,,,,,Kenapa tidak dicoba?,,,,,,,

Berikut langkah memasang autoreadmore tanpa javascript :

1.Login dasboard > Template > Edit HTML > Expand template widget,
backup dulu template kamu.

Jika template blogger kamu masih standard dan belum menggunakan autoreadmore,maka temukan dulu tag <data:post.body/> pada urutan yang pertama sendiri.Gunakan CTRL+F.

Jika template kamu sudah menggunakan autoreadmore yang versi javascript,maka cari code yang kira kira seperti berikut;


<data:post.body/>
<b:else/>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<div expr:id='&quot;summary&quot; + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);
</script>
<span id='showlink' style='float:right;padding-top:5px;'><a expr:href='data:post.url'> Readmore &#187;</a></span>
</b:if>

2.Jika code diatas sudah ketemu,maka replace dengan code berikut;

<data:post.body/>
<b:else/>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:post.thumbnailUrl'>
    <a expr:href='data:post.url' expr:title='data:post.title'><img alt='thumbnail' class='post-thumbnail' expr:src='data:post.thumbnailUrl'/></a>
<b:else/>
    <a expr:href='data:post.url' expr:title='data:post.title'><img alt='thumbnail' class='post-thumbnail' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJ0tMBYVqB9ceZ7WNsyNSrsZ1hv_Gs2CaPoNXAgkS4kBr5wB12VTRT_gBptcq1wTdO87FmMfJMhJvoalATnReAEq4N8YAArTw6oLY-z8V_gHldDAnRbKeraDamqTafzXKhMwSpargEqPZ0/'/></a>
</b:if>
<div class='post-snippet'><data:post.snippet/></div>
<a expr:href='data:post.url' expr:title='data:post.title'> Readmore &#187;</a>
</b:if>


 Jika sebelumnya template kamu menggunakan autoreadmore versi javascript maka temukan dan hapus script javascript yang terletak diatas code </head> berikut.Kira kira script JS nya seperti ini;

<script type='text/javascript'>var thumbnail_mode = &quot;no-float&quot; ;
summary_noimg = 385;
summary_img = 285;
img_thumb_height = 150;
img_thumb_width = 200;
</script>
<script type='text/javascript'>
//<![CDATA[
function removeHtmlTag(strx,chop){
if(strx.indexOf("<")!=-1)
{
var s = strx.split("<");
for(var i=0;i<s.length;i++){
if(s[i].indexOf(">")!=-1){
s[i] = s[i].substring(s[i].indexOf(">")+1,s[i].length);
}
}
strx = s.join("");
}
chop = (chop < strx.length-1) ? chop : strx.length-2;
while(strx.charAt(chop-1)!=' ' && strx.indexOf(' ',chop)!=-1) chop++;
strx = strx.substring(0,chop-1);
return strx+'...';
}
function createSummaryAndThumb(pID){
var div = document.getElementById(pID);
var imgtag = "";
var img = div.getElementsByTagName("img");
var summ = summary_noimg;
if(img.length>=1) {
imgtag = '<span style="float:left; padding:0px 10px 5px 0px;"><img src="'+img[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span>';
summ = summary_img;
}

var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML,summ) + '</div>';
div.innerHTML = summary;
}
//]]>
</script>

3.Pasang code CSS berikut ini diatas code  ]]></b:skin>

.post-thumbnail{width:100px;height:90px;float:left;overflow:hidden;margin:5px 10px 5px 5px}
.post-snippet:before{content:attr(data-snippet)}

4.Simpan template Kamu

You Are Done!

Cara membuat fungsi scrool pada widget

Fungsi scrool pada widget blogspot berikut saya contohkan jika digunakan untuk widget Popular Post atau Entri Populer.Jika kamu ingin menghemat tempat disidebar kamu yang full widget sehingga tidak memanjang banget maka kamu perlu cara ini.


Pada dasarnya sama jika anda ingin menambahkan fungsi scroll ini untuk widget blogspot yang lain,misalnya arsip,recent posts,label dll.Yang berbeda mungkin hanya tempat menyisipkannya saja.Baca :Bagaimana cara membuat CSS scrollbar

Baiklah,begini langkah untuk membuat fungsi scrool popular post;
Widget Popular Post harus sudah dibikin dulu dan beri Nama pada widget nya,misalnya disini kamu beri nama Popular posts.
lalu masuk Dasbor > Template > Edit  HTML > Expand template widget.
Cari Nama widget popular posts yang kamu bikin tadi yaitu Popular posts,biar mudah pergunakan CTRL+F.

Berikut ini code widget Popular Posts lengkapnya jika tadi sudah ketemu;

<b:widget id='PopularPosts1' locked='false' title='Popular posts' type='PopularPosts'>
<b:includable id='main'>
  <b:if cond='data:title'><h2><data:title/></h2></b:if>
<div class='widget-content' style='overflow:auto; height:250px'>
  <div class='widget-content popular-posts'>
    <ul>
      <b:loop values='data:posts' var='post'>
      <li>
        <b:if cond='data:showThumbnails == &quot;false&quot;'>
          <b:if cond='data:showSnippets == &quot;false&quot;'>
            <!-- (1) No snippet/thumbnail -->
            <a expr:href='data:post.href'><data:post.title/></a>
          <b:else/>
            <!-- (2) Show only snippets -->
            <div class='item-title'><a expr:href='data:post.href'><data:post.title/></a></div>
            <div class='item-snippet'><data:post.snippet/></div>
          </b:if>
        <b:else/>
          <b:if cond='data:showSnippets == &quot;false&quot;'>
            <!-- (3) Show only thumbnails -->
            <div class='item-thumbnail-only'>
              <b:if cond='data:post.thumbnail'>
                <div class='item-thumbnail'>
                  <a expr:href='data:post.href' target='_blank'>
                    <img alt='' border='0' expr:height='data:thumbnailSize' expr:src='data:post.thumbnail' expr:width='data:thumbnailSize'/>
                  </a>
                </div>
              </b:if>
              <div class='item-title'><a expr:href='data:post.href'><data:post.title/></a></div>
            </div>
            <div style='clear: both;'/>
          <b:else/>
            <!-- (4) Show snippets and thumbnails -->
            <div class='item-content'>
              <b:if cond='data:post.thumbnail'>
                <div class='item-thumbnail'>
                  <a expr:href='data:post.href' target='_blank'>
                    <img alt='' border='0' expr:height='data:thumbnailSize' expr:src='data:post.thumbnail' expr:width='data:thumbnailSize'/>
                  </a>
                </div>
              </b:if>
              <div class='item-title'><a expr:href='data:post.href'><data:post.title/></a></div>
              <div class='item-snippet'><data:post.snippet/></div>
            </div>
            <div style='clear: both;'/>
          </b:if>
        </b:if>
      </li>
      </b:loop>
    </ul>
    <b:include name='quickedit'/>
  </div>  </div>
</b:includable>
</b:widget>

Code yang berwarna merah adalah code CSS scroolbar yang perlu kamu sisipkan.Untuk mengatur tingginya bisa kamu sesuaikan dengan kebutuhan Kamu yaitu height: 250px;

Cobalah bereksplorasi untuk widget yang lain,caranya sama walaupun tempat menyisipkannya yang mungkin berbeda.
Jika widget adalah HTML/Javascript (Contoh: memasang recent post terbaru) kamu cukup menambahkan code yang berwarna merah diatas cukup didalam widget HTML/Javascript nya saja.

Bagaimana cara membuat CSS scrollbar

Scroolbar adalah bagian elemen yang bisa digeser naik atau turun dengan menggunakan mouse.
Apakah gunanya scroolbar?....
Scroolbar biasanya dipakai jika seorang webmaster bermaksud untuk menghemat tempat dihalaman situsnya yang dirasa  terbatas.Ya,,maksudnya untuk menghemat tempat,terutama untuk widget pada blog.
Jika blog kamu memiliki tempat pada sidebar yang terbatas,agar tidak terlalu memanjang kebawah kamu bisa memanfaatkan css scrollbar ini untuk widget blog.

Cara memasang CSS scrollbar

<div style="width: 190px; height: 190px; overflow: auto; padding: 5px">
Konten berada disini...
</div>


Demo

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aliquam erat volutpat. Praesent tempus rutrum wisi. Proin dui libero, tempor non, mattis nec, imperdiet a, nulla. Nunc hendrerit, metus eget sodales interdum, ipsum felis lacinia elit, vel bibendum nunc ligula ac wisi. Donec vitae neque. Nam quis ante ut est viverra aliquet. Vestibulum dui. Phasellus ultricies elit nec nibh. Sed pede tortor, tincidunt a, vestibulum id, posuere quis, eros. Vestibulum quam. Nullam augue. Nullam eleifend turpis a augue. Aenean vestibulum. Quisque et velit eu diam consequat nonummy. Nullam volutpat enim et pede.
Fusce pretium. Sed sodales arcu eu nulla. Nunc dapibus dui nec tortor. Ut hendrerit dolor sit amet pede. Proin sit amet lorem. Vestibulum quis ligula. Quisque leo libero, pharetra at, porttitor at, mollis imperdiet, magna. Donec venenatis neque quis arcu. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Ut enim nibh, euismod et, gravida id, euismod et, lacus. Praesent consectetuer velit non neque. Nulla vehicula, arcu tincidunt vehicula ullamcorper, neque sapien iaculis ipsum, sit amet suscipit mi pede vitae augue. Cras tempor, arcu molestie porta pharetra, pede ipsum faucibus nisl, sit amet eleifend urna ante vel nibh. Cras egestas bibendum mauris. Etiam sit amet risus a magna sagittis faucibus.
In ante. Nunc aliquet tincidunt sem. Morbi vestibulum lectus eget tortor. Integer volutpat. Mauris vitae erat quis neque tempor faucibus. Duis mattis. Duis nec magna. Aliquam tristique mattis lorem. Morbi gravida. Nunc malesuada velit id enim. Nullam sit amet dolor eget orci dignissim imperdiet. Morbi viverra neque vitae magna. Sed nonummy. Sed nunc risus, dignissim consectetuer, hendrerit vel, dapibus at, risus. Mauris id neque sit amet augue pretium blandit. Sed sit amet nunc. Sed fermentum tristique nibh. Proin pellentesque tincidunt risus. Aenean erat. In blandit aliquam massa.

Recent post thumbnail blogspot terbaru

Recent post thumbnail berikut bisa kamu coba terapkan untuk blog Kamu.Selain code yang lebih disederhanakan,thumbnail yang ditampilkan adalah versi gambar kompresi dari album gambar postingan.Itulah kenapa kita sebut sebagai recent post thumbnail blogger yang memiliki loading ringan.

Cara pemasangan code Recent post thumbnail:

1.Login ke dasboard blogger Kamu -> Add new widget HTML/Javascript dan paste code berikut;

<style type="text/css">
#recent-posts img{float:left;overflow:hidden;margin-right:10px;background:#FFF;width:40px;height:40px;padding:3px}
#recent-posts li a{font-weight:bold}
</style>
<div id='recent-posts'>
<script type='text/javaScript'>
var rcp_numposts=6;
var rcp_snippet_length=80;
var rcp_info='yes';
var rcp_comment='Comment';
var rcp_disable='';
function recent_posts(json){var dw='';a=location.href;y=a.indexOf('?m=0');dw+='<ul>';for(var i=0;i<rcp_numposts;i++){var entry=json.feed.entry[i];var rcp_posttitle=entry.title.$t;if('content'in entry){var rcp_get_snippet=entry.content.$t}else{if('summary'in entry){var rcp_get_snippet=entry.summary.$t}else{var rcp_get_snippet="";}};rcp_get_snippet=rcp_get_snippet.replace(/<[^>]*>/g,"");if(rcp_get_snippet.length<rcp_snippet_length){var rcp_snippet=rcp_get_snippet}else{rcp_get_snippet=rcp_get_snippet.substring(0,rcp_snippet_length);var space=rcp_get_snippet.lastIndexOf(" ");rcp_snippet=rcp_get_snippet.substring(0,space)+"&#133;";};for(var j=0;j<entry.link.length;j++){if('thr$total'in entry){var rcp_commentsNum=entry.thr$total.$t+' '+rcp_comment}else{rcp_commentsNum=rcp_disable};if(entry.link[j].rel=='alternate'){var rcp_posturl=entry.link[j].href;if(y!=-1){rcp_posturl=rcp_posturl+'?m=0'}var rcp_postdate=entry.published.$t;if('media$thumbnail'in entry){var rcp_thumb=entry.media$thumbnail.url}else{rcp_thumb="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJ0tMBYVqB9ceZ7WNsyNSrsZ1hv_Gs2CaPoNXAgkS4kBr5wB12VTRT_gBptcq1wTdO87FmMfJMhJvoalATnReAEq4N8YAArTw6oLY-z8V_gHldDAnRbKeraDamqTafzXKhMwSpargEqPZ0/"};}};dw+='<li>';
dw+='<div><a href="'+rcp_posturl+'" rel="nofollow" title="'+rcp_posttitle+'"><img alt="'+rcp_posttitle+'" src="'+rcp_thumb+'"/></a></div>';
dw+='<div><a href="'+rcp_posturl+'" rel="nofollow" title="'+rcp_snippet+'">'+rcp_posttitle+'</a></div>';if(rcp_info=='yes'){dw+='<span>'+rcp_postdate.substring(8,10)+'/'+rcp_postdate.substring(5,7)+'/'+rcp_postdate.substring(0,4)+' - '+rcp_commentsNum+'</span>';};dw+='<div style="clear:both"></div></li>';};dw+='</ul>';document.getElementById('recent-posts').innerHTML=dw;};document.write('<script type=\"text/javascript\" src=\"/feeds/posts/default?alt=json-in-script&max-results='+rcp_numposts+'&callback=recent_posts\"><\/script>');
</script>
</div>
Setting:
var rcp_numposts=6; 6 adalah jumlah judul yang ditampilkan.Tamabah atau kurangi jika menginginkan
var rcp_snippet_length=80; 80 adalah jumlah karakter dari title,dalam hal ini adalah cuplikan artikel.Ganti 80 dengan jumlah karakter sesuai dengan keinginan kamu.
var rcp_info='yes'; 'Yes' adalah jika ingin menampilkan Tanggal dan comments,jika tidak ingin maka ganti dengan 'no'
width:40px;height:40px; adalah ukuran panjang kali lebar thumbnail,ubah sesuai dengan keinginan.Defaultnya adalah 40px.
2.Simpan widget,dan lihat hasilnya.

Cara Membuat blog gratis

Salah satu mesin blog gratis paling mudah dan sekaligus juga mendapatkan banyak keuntungan lainnya adalah menfaatkan fasilitas dari blogger.com.
Gratis sepenuhnya ,tanpa ada versi trial ataupun versi berbayar,semua pemilik blog diblogger mendapatkan  fasilitas fitur yang sama.
Blogger dot com atau lebih dikenal dengan blogspot adalah platform blog/penyedia layanan khusus untuk membikin blog milik google.

Apa saja sih keuntungan bikin blog di blogspot

• Antarmuka yang relatif lebih mudah ,walaupun untuk orang yang baru saja menjejak pengalaman ini.
• Relatif lebih canggih dan lengkap dalam urusan  fitur.
• Dengan satu akun google,kita akan mendapatkan banyak fasilitas gratis lain sebagai penunjang,misalnya google webmaster tool dan google analistic.Google webmaster tool dan google analistic berguna untuk memonitor blog dan sebagai macam acuan untuk upaya optimasi perangkingan blog pada search engine.Anda juga akan mendapatkan fasilitas email gratis ,dimana hal ini adalah langkah awal untuk bisa menikmati fasilitas lain dari account google.
• Karena milik google,banyak rumor bilang bahwa blogspot prioritas pada hasil pencarian google.
• Lebih mudah jika ingin mendaftarkan blog monetise dalam program adsense milik google.
• Relatif lebih aman dari gangguan para hacker jahil.
• Blogger jarang sekali menonaktifkan account blog,kecuali pelanggaran yang dinilai sangat keras (baca TOS) .Jika anda hanya mengikuti program affiliasi dan promosi bisnis yang "wajar",akun blog saya kira akan ama- aman saja.Toh jika seandainya kena suspend,kitapun masih bisa menghadirkan kembali blog seperti sediakala,dg catatan jika Anda mengcustom domain blogspot.
• Kapan saja anda ingin melakukan customisasi domain,misalnya berubah menjadi namaanda.com sangat mudah.Customisasi domain blogspot tidak akan meninggalkan pengunjung blog Anda yang lama  karena otomatis redirect ke domain baru.
• Bebas mendesain template buatan sendiri sesuai selera.Semua penggunaan code HTML dan javascript di support .

Mungkin masih banyak keuntungan lainnya,namun beberapa pengalaman diatas saya kira sudah sangat menguntungkan sekali

Langkah dan Cara membuat blog di blogspot

1.Mendaftar kan email di google atau lebih dikenal dengan gmail,buka halaman google.com atau google.co.id
Lihat gambar:

Syarat mendaftar @gmail.com,sediakan nomer hp GSM anda,karena kode aktifasi biasanya akan dikirim melalui handphone.

2.Masuk ke situs www.blogger.com

Ada tiga langkah registrasi untuk memiliki akun blogger/blogspot yaitu; ciptakan akun > beri nama blog > pilih template.

a.Ciptakan akun
Berisi perintah untuk memasukkan data login anda ,dimana alamat @gmail yang sudah anda bikin tadi akan dipakai sebagai ID login.(Jika belum punya @gmail,tentunya bikin dulu)
b.Beri nama Blog
Berisi perintah untuk memilih nama blog yang anda kehendaki,hanya nama yang unik (tidak ada kembarannya) saja yang disetujui.Disetujui atau tidak nama blog yang akan anda pakai,akan langsung anda diketahui untuk kemudian mencari nama yang lainnya untuk blog Anda.
c.Pilih template
Berisi perintah untuk memilih template blog yang pertama kali,disana sudah ada daftar template yang bisa untuk anda pakai gratis.Untuk urusan template berikutnya,anda bisa mengganti dengan template blogspot sesuai keinginan.

Horee!!...........Blog anda sudah jadi!!

3.Setelah itu anda sudah bisa untuk memulai ngeblog,posting,mengatur tata letak (widget) ,mendesain blog sendiri,custom domain blog dan semua aktifitas ngeblog lainnya.

Dengan satu akun blogger tadi, selanjutnya Anda bisa membuat beberapa blog lagi dengan hanya melewati proses kedua dan proses ketiga saja.

Tutorial blogger selanjutnya bisa anda ikuti diblog ini,termasuk dasar dasar edit template HTML,widget dll.

Thx,may be usefull!!