Showing posts with label Tutorial Blog. Show all posts
Showing posts with label Tutorial Blog. Show all posts

Cara Membuat Judul Artikel Postingan Muncul Pada Header Blog/Website

Cara Membuat Judul Artikel Postingan Berada Pada Header Blog/Website

Rachmatalamsyah.com - Jika Anda berkunjung ke blog ini berarti Anda sedang mencari cara agar judul artikel yang Anda buat bisa muncul pada judul blog (muncul di header blog). Kata master SEO Ricky Pratama, trik ini memang ampuh untuk membuat blog kita menjadi SEO. Saya pikir juga cara ini memang bisa dibilang ampuh dan tidak ada efek samping negatifnya. Jadi Cara ini bisa jadi Rekomendasi buat agan-gan yang mau meningkatkan Jurus SEO nya. Tidak usah panjang Lebar Berikut akan saya jelaskan bagaimana Cara Membuat Judul Artikel Postingan Berada Pada Header Blog/Website.

Cara Membuat Judul Artikel Postingan Berada Pada Header Blog/Website

1. Login ke blogger.com, jika sudah
2. Pilih Template → Edit HTML
3. Cari kode <b:include name='title'/> , agar lebih mudah tekan tombol (F3) di kolom Edit HTML
4. Biasanya akan ada 3 kode seperti itu, coba satu-persatu, jika gagal tekan (Ctrl+Z) untuk undo
5. Ganti kode <b:include name='title'/> dengan script di bawah ini :
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:include name='title'/>
<b:else/>
<data:blog.pageName/>
</b:if>
 6. Selesai, Simpan dan Lihat Hasilnya

Nah Setelah mengikuti Langkah-langkah Cara Membuat Judul Artikel Postingan Muncul Pada Header Blog/Website diatas maka sobat saat ini bisa membuka Postingan dan lihat Artikel Judul Postingan yang sobat buka akan muncul tepat di Judul Blog/Website sobat dan jika klik ke Home/Beranda maka Judul Blog/Website sobat yang akan muncul Kembali . 

Sekian Tips Blog dan Seo tentang Cara Membuat Judul Artikel Postingan Muncul Pada Header Blog/Website. Semoga Bermanfaat.



Download Template Nubie Banget Responsive tanpa Credit Link

Nubie Banget Responsive
Rachmatalamsyah.com - Pada kesempatan kali ini saya akan membagikan sebuah Template yang saat ini saya gunakan yaitu Template Nubie Banget yang sangat Responsive dan Mobile Friendly. Template ini sangat cocok untuk didaftarkan pada Program Google Adsense karena didalamnya sudah di sediakan Widget Tab Banner GA ukuran 720x90 sebanyak 2 Widget di  Tata Letak dan tepatnya di Bagian bawah Header/diatas Judul Postingan dan di Footer. 


Untuk Template yang akan saya bagikan di sini adalah template Nubie Banget Responsive tanpa Credit Link, jadi sudah di setting khusus tanpa susah-susah lagi mencari Kredit Link sang Pemilik template dan untuk Demonya adalah Website ini sendiri ya. Baik tanpa berlama-lama lagi berikut akan saya berikan Spesifikasi dari Template Nubie Banget Responsiv.

Spesifikasi Template Nubie Banget Responsive 



Download Template Nubie Banget Responsive tanpa Credit Link (tunggu beberap detik hingga link download muncul ) :

Atau klik :
https://tusfiles.net/8us1a1aifjf7
 Itulah salah satu Template Responsive yang dapat digunakan saat mengikuti Program Google Adsense atau saat Pendaftaran agar website sobat cepat di Approve. Semoga Bermanfaat !

Catatan : Jika Link download diatas tidak Bekerja, Silahkan Berkomentar lewat kolom dibawah dengan menyertakan Email anda untuk saya kirimkan Link Download Template diatas.

Cara Mencekal Atau Mengatasi Jingling Auto Visitor Pada Blog

Rachmatalamsyah.com - Jigling Sebuah program / Software dari cina untuk webmaster untuk mendapatkan traffick hits di situs Web mereka sebagai pertukaran lalu lintas oleh Auto Visitor dan tidak Real Human, Jigling adalah aplikasi java PC kecil yang akan membantu lalu lintas situs Anda dan meningkatkan peringkat alexa. Tapi jika Anda menjalankan Google Adsense di situs Anda maka saya tekankan untuk tidak menggunakan aplikasi jigling atau Google Adsense anda akan di Banned, dan disini saya akan menjelaskan bagaimana cara mencegah atau mencekal aplikasi jigling dari orang-orang yang tidak bertanggung jawab.

Cara Mengatasi Jingling Auto Visitor pada Blog , Cara Mengatasi JINGLING atau auto Visitor blog , Cara Mengatasi Jingling BOT Auto Visitor Pada Blog , Cara mengatasi Blog dari jingling / auto visitor bot
Cara Mencekal Atau Mengatasi Jingling Auto Visitor Pada Blog

Efek Samping Menggunakan Aplikasi Jigling :
  • Jika anda blogger sejati tetapi anda menggunakan jigling berarti sama saja anda menipu diri sendiri karena blog anda akan di kunjungi hanya oleh robot bukan dari Real Human.
  • Akun Google Adsense anda akan langsung di banned.

Cara Mengati Blog Kita Di Jigling Oleh Orang Yang Tidak Bertanggung Jawab :

1. Silahkan anda login ke akun blog anda terlebih dahulu.

2. Setelah itu langsung menuju Setelan >> Preferensi Penulusuran >> Robot.txt Khusus >> Edit.

3. Copy semua kode di bawah ini :

User-agent: Mediapartners-Google
Disallow:
User-agent: Googlebot
Allow: /
Disallow: /search
User-agent: *
Disallow: /

4. Lalu letakkan atau paste kode di atas kedalam kolom Robot,txt Khusus, lalu klik save. Lihat gambar di bawah

Cara Mengatasi Jingling Auto Visitor pada Blog , Cara Mengatasi JINGLING atau auto Visitor blog , Cara Mengatasi Jingling BOT Auto Visitor Pada Blog , Cara mengatasi Blog dari jingling / auto visitor bot


Hanya sampai disitu saja artikel pendek saya tentang bagaimana Cara Mencekal Atau Mengatasi Jingling Auto Visitor Pada Blog lebih dan kurang silahkan anda berkomentar untuk memberikan solusi yang terbaik.


Cara membuat Link Sumber ketika postingan Blog di copy

Cara membuat Link Sumber ketika postingan Blog di copy
Cara membuat Link Sumber ketika postingan Blog di copy
Rachmatalamsyah.com - Tentu para blogger sering merasa kesal dengan ulah pengunjung blog yang main copy paste artikel tanpa meletakkan link sumbernya. Dan itulah yang mungkin terjadi di blog saya, setelah sekitar satu bulan tidak blogging. Oke, kali ini saya akan membagikan tips agar para copaster (orang yang suka copy paste) menyertakan link sumber artikel tanpa diminta, alias secara otomatis. Tidak percaya? Lihat preview kerjanya pada gambar di bawah ini :


Berikut ada kode script membuat Link Sumber :

<scripttype='text/javascript'gt;functionaddLink({vara=document.getElementsByTagName("body")[0];var b;b=window.getSelection();var c="<br/><br/>Source<ahref='"+document.location.href+"'gt;"+document.location.href+"</a><br/>Disalin dari Blog ku.";var d=b+c;var e=document.createElement("div");e.style.position="absolute";e.style.left="99999px";a.appendChild(e);e.innerHTML=d;b.selectAllChildren(e) window.setTimeout(function({a.removeChild(e)},0)}document.oncopy=addLink </script>

Jika dipasangkan pada template blog, dan ada pengunjung blog yang melakukan aksi copy paste, teks yang berwarna merah akan muncul pada bagian akhir artikel (seperti pada gambar). Gantilah teks yang berwarna merah sesuai dengan keinginan.

Cara memasangnya  dibawah ini :

1.   Seperti biasa, buka blogger, lalu masuk ke Template -> Edit HTML.
2.   Tekan ctrl+f, lalu cari kode
.
3.   Pastekan script diatas (diatas atau sebelum kode ), lalu klik Simpan.
4.   Ganti kata-kata pada kode yang berwarna Merah diatas sesuai keinginan anda

Script pun siap digunakan. Tidak percaya? Coba tes dengan cara copy paste salah satu artikel blog Anda. Selamat mencoba, dan jangan lupa untuk mengklik tombol Google + dibawah. Terima kasih, dan salam Blogger!

Cara membuat Loading Header Blog mirip Youtube

Cara membuat Loading Header Blog mirip Youtube
Loading Header di Youtube
Rachmatalamsyah.com - Pada kesempatan ini saya akan memberikan info bagaimana cara membuat loading blog bentuk garis merah pada header seperti yang ada di youtube dengan judul artikel kali ini adalah Cara membuat Loading Header Blog mirip Youtube. Baik,untuk membuat Loading header youtube ini sangat mudah tergantung dari proses / langkah-langkahnya. Untuk Demonya sendiri bisa di lihat pada website ini atau di Youtube.

Berikut langkah-langkah pembuatan Loading Header Blog mirip Youtube :

1. Login Blogger 

Masuk ke blogger kemudian klik Template > klik Edit Html

2. Pasang Kode Javascript

Letakkan kode dibawah ini diatas </head>. Kode dibawah ini terdapat Jquery dari ajax.googleapis.com. Agar berjalan dengan baik, kamu harus terkoneksi ke internet untuk memanggil kode Jquery dari google tersebut.

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
(function($){$("html").removeClass("v2");
$("#header").ready(function(){
$("#progress-bar").stop().animate({ width: "25%" },1500) });
$("#footer").ready(function(){
$("#progress-bar").stop().animate({ width: "75%" },1500) });
$(window).load(function(){
$("#progress-bar").stop().animate({ width: "100%" },600,function(){
$("#loading").fadeOut("fast",function(){
$(this).remove();
});
});
});
})(jQuery);
</script>

2. Letakkan Kode CSS

Masih dalam Edit Html Blog,kemudian Letakkan Kode CSS dibawah ini pada bagian b:skin / ></b:skin>  :

#loading {
position: fixed;
z-index: 9999;
top: 0;
left: 0;
width: 100%;
height: 10px;
line-height: 350px;
text-align: center;
padding-top:70px;
font:bold 50px Calibri,Arial,Sans-Serif;
color: #000000;
}
.v2 #loading {
display: none
}
#progress-bar {
position: absolute;
top: 0;
left: 0;
z-index: 9999;
background-color:#fd0000;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
filter: alpha(opacity=80);
opacity: 0.8;
width: 0;
height: 10px;
}
#loader {
top:0;
left:0;
width:100%;
height: 10px;
position:fixed;
display: block;
color:#FFCC66;
background: #000;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
filter: alpha(opacity=80);
opacity: 0.8;
}

3. Letakkan Elemen DIV

Fungsi elemen div sendiri adalah untuk menampilkan atau menjalankan kode CSS yang telah dipasang diatas,jadi pastikan anda masih dalam mode edit html dan letakkan  elemen div dibawah ini didalam elemen <body> :

<div id='loading'><div id='progress-bar'></div><div id='loader'></div></div>

4. Terakhir Silahkan klik Simpan Template 

Untuk melihat hasilnya tetap pada mode edit Html dan Cukup Klik Lihat Blog saja pada bilah sebelah sudut kiri blog,dan lihat hasilnya.

Cat : Anda bisa melakukan Modifikasi pada kode seperti merubah warna,ukuran dan kecepatan tapi untuk kecepatan mungkin sesuai dengan load blog anda sendiri.

Demikian informasi mengenai Cara membuat Loading Header Blog mirip Youtube semoga anda bisa menerapkannya di blog sesuai dengan langkah-langkah yang saya jelaskan diatas, Apabila ada pertanyaan silahkan tulis di bawah di kolom komentar.

Cara memasang Scroll pada Label,Popular Post dan Postingan di Blog

Cara memasang Scroll pada Label dan Popular Post di Blog
Cara memasang Scroll pada Label dan Popular Post di Blog
Rachmatalamsyah.com - Pada kesempatan yang berbahagia ini kita berjumpa kembali pada tulisan saya berikut ini dengan judul Cara memasang Scroll pada Label,Popular Post dan Postingan di Blog, scroll disini menurut saya sebagai suatu tamabahan alat untuk memudahkan pembaca melihat semua bagian pada Label dan Popular Pos si empunya blog,selain berfungsi untuk memudahkan juga berfungsi untuk memperpendek tampilan Label dan Popular Post yang mungkin sebelumnya memakan banyak ruang di Blog kita.

Nah untuk cara memasang alat Scroll ini cukup mudah karena hanya menempatkan beberapa kode pada template html blog kita, selain itu kode yang kita masukkan juga cukup ringan dan tidak membuat blog menjadi over/berat. Baik tanpa panjang lebar,berikut adalah penjelasannya :

Cara memasang Scroll pada Label,Popular Post dan Postingan di Blog

A. Memasang Scroll pada pada Label Blog

  1. Silahkan sobat masuk akun Blog sobat 
  2. Klik Template" kemudian "Edit Html"
  3. Kemudian Cari kode ]]></b:skin> (dengan menggunakan Control F) agar lebih cepat.
  4. Lalu Copy Kode di bawah ini dan Paste tepat diatas atau sebelum Kode ]]></b:skin> 
#Label .widget-content{
height:
200px;
width:auto;
overflow:auto;
}

Silahkan "Save/Simpan Template".

B. Memasang Scroll pada Popular Post Blog

Sebenarnya caranya  hampir sama cuma pada kode nya diubah tadi Label diganti menjadi Popular post. Berikut langkah-langkahnya :
  1. Silahkan sobat masuk ke akun akun Blog sobat 
  2. Klik Template" kemudian "Edit Html"
  3. Kemudian Cari kode ]]></b:skin> (dengan menggunakan Control F) agar lebih cepat.
  4. Lalu Copy Kode di bawah ini dan Paste tepat diatas atau sebelum Kode ]]></b:skin> 
#PopularPosts1 .widget-content
{height:170px;
width:auto; 
overflow:auto; 
}

Silahkan "Save/Simpan Template"

Cat : "Untuk kode yang berwarna biru bisa anda atur sesuai keinginan,itu adalah Height / tinggi dari widget Scroll tersebut,untuk width / lebar biarkan saja auto".

C. Memasang Scroll pada Postingan Blog

Caranya sangat mudah,anda tinggal memasukkan Kode Script dibawah ini kedalam postingan yang ingin dipasangi scroll :

<div style='padding: 5px; overflow: auto;width: auto; height:200px;border:1px solid #000000'>
LETAKKAN TULISAN SOBAT ATAU APAPUN DISINI
(Tulisan ditulis di Compose, sedangkan Kode di Tulis pada mode Edit HTML)

</div>

Keterangan:
  • Ingat, sobat harus tempatkan Kode pada mode Edit HTML, bukan Compose.
  • Untuk melihat dan mengecek berhasil atau tidak, silahkan sobat klik Compose.
  • height:200px; adalah ukuran lebar atas bawah kotak scroll, silahkan sobat ganti nilainya, seperti keinginan sobat.
  • width: auto; adalah ukuran otomatis lebar samping kotak scroll, silahkan sobat ganti dengan nilai pada auto, apabila ingin ukurannya disesuaikan seperti keinginan sobat.
  • border:1px solid adalah ukuran tebal garis kotak scroll, silahkan sobat ganti nilainya, seperti yang sobat inginkan.
  • #000000 adalah Kode warna pada garis kotak scroll, silahkan sobat ganti Kode warnanya seperti yang sobat inginkan. 

Demikian sedikit informasi mengenai, Cara memasang Scroll pada Label,Popular Post dan Postingan di Blog semoga bermanfaat dan semoga bisa berhasil terpasang di blog sobat. Jika bermanfaat silahkan tinggalkan komentar di kolom komentar blog ini.


Cara Membuat Kotak tempat Script di Postingan Blog

Cara Membuat Kotak tempat Script  di Postingan Blog

Rachmatalamsyah.com - Pada sesi kali ini kita akan membahas tentang Cara Membuat Kotak Tempat Script tampil di Postingan Blog, sebagaimana kita ketahui bahwa ketika meletakkan Srcript / kode Html lainnya kedalam postingan secara langsung maka hasilnya kurang indah dipandang mata,nah fungsi dari kotak script ini adalah sebagai tempat meletakkan Kode Sript yang ada dalam postingan dan juga membuat tampilan kode terlihat rapi juga enak dipandang.

Peraturan Pemasangan Kode Srcipt pada postingan adalah:

1. Anda harus mem-Parse terlebih dalu kode Script tersebut sebelum diletakkan dalam postingan, 
2. Anda bisa melakukan Parse di blog ini pada menu Tools dan pilih HTML PARSER, atau klik disini
3. Copy hasil parse kemudian letakkan pada Postingan anda,maka Script tersebut akan bisa tampil  dengan sempurna.

Kita kembali ke topik kita yaitu cara membuat Kotak Script di postingan Blog,cara ini terbilang cukup mudah dilakukan karena kita hanya menambahkan kode kotak Script kedalam postingan setelah itu kita tambahkan Kode Script yang ingin kita beri kotak tempat Script,bentuk,warna dan ukuran kotaknya juga bisa kita atur sesuai dengan keingininan.

Contoh Kotak tempat meletakkan Script :

1. Script- nya ada dalam kotak dibawah in :
 
<div style="border: 3px #1780dd Double; padding: 10px;background-color:#ffffff;
text-align: left;">
Letakkan Script disini </div>


2. Hasilnya dibawah ini :

Letakkan Script disini

Nah untuk cara pemasangannya cukup copy kode Script yang ada pada kotak nomor 1 diatas kemudian pastekan kedalam postingan lalu Ubah mode Compose ke Html lalu kembalikan lagi ke mode Compose dan hasilnya seperti kotak nomor 2 diatas. Selanjutnya silahkan letakkan Script yang sebelumnya telah di Parse dalam kotak hapus saja tulisan Letakkan Script disini terlebih dahulu, terakhir silahkan publish postingan dan lihat hasilnya.

Berikut Beberapa Model Kotak tempat meletakkan Script (Silahkan dicomot gan)


<div style="border: 1px solid #444; padding: 10px; background-color: #eaeaea; text-align: left;"> Kode Script Anda Di Sini </div>

<div style="border: 2px #1B1A76 dotted; padding: 10px; background-color:#c2c2c2; text-align: left;"> Kode Script Anda Disin </div>

<div style="border: 3px #5f200e double; padding: 10px; background-color: #82CAFA; text-align: left;"> Kode Script Anda Disini </div>

<div style="border: 2px #006400 inset; padding: 10px; background-color: #d5839f; text-align: left;">Kode Script Anda Disini </div>

<div style="-moz-border-radius: 10px; -webkit-border-radius: 10px; background-color: #a2c4c9; border-radius: 10px; border: 4px outset #fff; padding: 10px; t-align: left;">Kode Script Anda Disini</div>

<div style="-moz-border-radius: 10px; -webkit-border-radius: 10px; background-color: #6fa8dc; border-radius: 10px; border: 4px double #fff; padding: 10px; t-align: left;">Kode Script Anda Disini</div>

<div style="-moz-border-radius: 10px; -webkit-border-radius: 10px; background-color: #ffe599; border-radius: 10px; border: 2px dashed #aaa; padding: 10px; t-align: left;">Kode Script Anda Disini</div>

<div style="-moz-border-radius: 10px; -webkit-border-radius: 10px; background-color: #f3f3f3; border-radius: 10px; border: 4px solid #999; padding: 10px; t-align: left;">Kode Script Anda Disini</div>

<div style="-moz-border-radius: 10px; -webkit-border-radius: 10px; background-color: #f3f3f3; border-left: 5px solid #2288dd; border-radius: 10px; padding: 10px; t-align: left;">Kode Script Anda Disini</div>

Peraturan Pemasangan kode :
  1. Copy script box code dari beberapa jenis tampilan di atas
  2. Paste pada Menu Tab HTML Artikel Entri
  3. Ganti kode yang berwarna (Merah) yang bertulisan (Kode Script Anda Disini) dengan script yang anda inginkan
  4. Kreasi dengan beberapah bagian di bawah ini seperti :
    • Ganti ukuran sudut lengkungan : border-radius: 10px ada 3 ganti semua
    • Ganti warna background : background-color: #codewarna
    • Ubah ketebalan border / garis tepi kolom : border: 4px

Demikianlah pembahasan mengenai Cara Membuat Kotak tempat Script di Postingan Blog,Semoga artikel ini dapat bermanfaat dan bisa diterapkan di blog anda.Selamat Mencoba