BLOG RANGGA

Artisteer 4.3.0.60745 ??Artisteer 4.3.0.60745 telah di sempurnakan dari versi sebelum nya dari bug dan tambahan lainya , Artisteer 4.3.0.60745 adalah sebuah sofware yang sangat cocok untuk profesional ataupun pemula  untuk membuat website template , blogger template, Tumblr Theme , Wordpress Theme tanpa harus mengerti bahasa program Web seperti program CSS, HTML, PHP dan sebagai nya , dengan sofware Artisteer ini pengguna nya tidak perlu lagi mendesain tema atau template menggunakan Adobe Dreamwaver ataupun Adobe Photoshop karena di Artisteer4.3.0.60745 sudah tersedia template dan icon yang tampilan yang sangat menarik dan bagus dengan banyak pilihan tampilan yang sangat menarik dan bagus buat tampilan website template , blogger template, Tumblr Theme , Wordpress Theme sesuai yang di terangkan di website resmi nya Artisteer

Artisteer adalah produk otomatisasi desain web pertama dan satu-satunya yang secara instan membuat templat situs web dan tema blog yang tampak fantastis

• Desain blog yang luar biasa dan templat web keren dalam hitungan menit
• Ekspor ke Blogger, Joomla, Wordpress, dan produk CMS lainnya
• Tidak perlu belajar Photoshop, CSS, HTML atau teknologi lainnya
• Menyenangkan dan mudah digunakan!
• Pratinjau, unduh, dan edit contoh situs web dan templat online!

Kalau buat pemula sangat cocok sekali karena menggunakan cukup klik dan klik sesuai tampilan yang di inginkan yang jelas menurut pengalaman saya sendiri Sofware ini sangat User friendly tapi sayang tool ini di gunakan berbayar dengan harga yang tertera di bawah ini

•  HOME & EDITION + THEMLER PERSONAL BUY $49.95
• STANDARD EDITION+THEMLER BUSINESS BUY $129.95
• STANDARD EDITION+THEMLER PRO BUY $199.95

Tapi di sini saya akan berbagi sofware ini secara gratis buat yang ingin mencoba menggunakan tool ini dengan versi full nya lengkap dengan patch dengan mendowload melalui link di bawah ini

Semoga berguna dan bermanfaat dan kalau ada link yan eror tolong di baritahukan supaya bisa di perbaiki secepat nya

Karena google code sudah menghapus fasilitas untuk mengupload file hosting javascript (js.) Banyak pengguna google code yang kebingungan dimana harus mengupload file javascript nya apalagi yang mempunyai link back . Tapi siapa sangka google masih menyediakan fasilitas upload file javascript melalui google drive dan upload file host di google drive yang ternyata lebih mudah dan cepat di bandingkan dengan menggunakan google code .
Disini saya akan berbagi cara menggunakan upload file sebagai contoh saya menggunakan code javascript untuk di upload di google drive

• Hal utama untuk bisa masuk untuk menggunakan google drive yaitu harus mempunyai akun dulu di google , untuk membuat akun di google bisa dengan berkunjung ke link ini . 
  
• Selanjut nya masuk atau langsung login ke google drive melalui link ini .
  
• Klik " buat " untuk membuat folder , nama foldernya bisa di buat dengan keinginan lalu klik buat untuk menyimpan folder .
  
• Untuk menggunakan folder yang telah di buat tadi klik tanda panah yang ada tepat di samping folder .
  
• Pilih file yang mau di upload atau di unggah sebagai contoh saya mengupload file js. Yang ada di My document .
  
• Setelah file js tadi terupload atau terunggah 100 % selanjut nya klik 'berbagi' Untuk mengatur opsi supaya kode nya bisa di lihat diweb atau blog .
  
• ubah lah opsi nya menjadi “publik di web“ Cara mengunakan kode nya buat blog yaitu copy code yang tampil dan pastekan sementara dulu di notepad .
  
• Selanjut nya contoh menggunakan code nya untuk hosting yaitu mengambil code di tandai yang sudah di pastekan di notepad tadi Gabungkan url nya sehingga kode menjadi seperti contoh kode di bawah ini .
  

url yang di berikan google drive  https://drive.google.com/file/d/0B-YDILnfw4VqWkpZQWlDbll6Yms/edit?usp=sharing 

https://googledrive.com/host/masukan kode yang di tandai warna merah disini

sehingga kode nya menjadi seperti dibawah ini

https://googledrive.com/host/0B-YDILnfw4VqWkpZQWlDbll6Yms

Supaya menjadi kode widget uang bertaburan di blog gabungan seperti ini

<script src="https://googledrive.com/host/0B-YDILnfw4VqWkpZQWlDbll6Yms" type="text/javascript"/></script> 

Untuk melihat hasil dari kode di atas silahkan di tes di halaman HTML blog sobat seperti apa jadi fungsi kode dari google drive.
Cara di atas bisa juga di gunakan untuk code HTML , CSS dan JavaScript yang bisa anda coba sendiri.

Blog di copas atau copy paste memang menjengkelkan sekali apalagi blog tersebut mendapat posisi bagus di atas blog yang telah dicopas karena si tukang copas gembira di atas jerih payah orang lain , untuk mengatasi hal tersebut jangan sampai terjadi ada cara nya supaya artikel blog tidak bisa di copas yaitu dengan memasang script anti klik kanan atau copy paste dengan cara sebagai berikut ;
1. Login ke Blogger
2. Klik Tata Letak

3. Klik lagi Tambahkan Gadget

4. Pilih HTML/JavaScript

5. Masukan kode Script di bawah ini ke halaman HTML/JavaScript

<script> var message="Maaf,, Untuk sementara dilarang klik kanan !!";
///////////////////////////////////
function clickIE4(){if (event.button==2){alert(message);return false;}} function clickNS4(e){if (document.layers||document.getElementById&&!document.all){if (e.which==2||e.which==3){alert(message);return false;}}} if (document.layers){document.captureEvents(Event.MOUSEDOWN);document.onmousedown=clickNS4;} else if (document.all&&!document.getElementById){document.onmousedown=clickIE4;} document.oncontextmenu=new Function("alert(message);return false")</script>

6. Terakhir klik simpan

Buka halaman blog untuk melihat hasil nya , dan kalau tidak berhasil silahkan tinggal kan pertanyaan di kolom komentar

Pada postingan kali ini saya akan berbagi tentang Tutorial Blogger yaitu Cara Membagi Dua Kolom Pada Postingan Blog yaitu dalam satu halaman postingan akan terbagi dan terpisah menjadi dua kolom .
Penasaran tentang cara nya ?? langsung saja ke TKP nya dengan cara sebagai berikut :
1. Login dulu dengan Account Blogger yang telah sobat buat
2. Pilih Buat Entri Baru atau klik Icon Pena
3. Lalu pilih HTML pada halaman postingan blog dan masukan kode di bawah ini kehalaman tersebut
Kode Script Artikel 2 Kolom

<table border="0" cellspacing="10" style="width: 500px;">
<tbody>
<tr>
<td valign="top" width="250">kolom artikel 1...</td>
<td valign="top" width="250">kolom artikel 2...</td>
</tr>
</tbody></table>

4. Lalu Klik Compose dan ganti tulisan kolom artikel 1...dan kolom artikel 2...dengan artikel postingan sobat
5. Terakhir Publikasikan postingan sobat .
Keterangan : 
Kode yang di tandai warna biru ( 10 , 500px dan 250 )silahkan ganti dengan ukuran dengan menyesuaikan dengan ukuran lebar halaman postingan sobat

1. Login dulu ke Blogger
2. Pilih Template di dasbor blog
3. Klik Edit HTML
4. Selanjut nya cari code </head> dan tambahkan code script di bawah ini di atas / sebelum code </head>

<style>#Hengky img{-moz-transition:all .8s ease-in-out;-ms-transition:all .8s ease-in-out;-o-transition:all .8s ease-in-out;-webkit-transition:all .8s ease-in-out;transition:all .8s ease-in-out;} #Hengky img:hover{ -o-transform: scale(1.3) rotate(360deg); -moz-transform: scale(1.3) rotate(360deg); -webkit-transform: scale(1.3) rotate(360deg);}</style>

5. Untuk selanjut nya memasang gambar nya di postingan blog atau gadged blog yaitu dengan memasang kode di bawah ini di halaman HTML postingan blog atau halaman HTML Gadged blog

<div id="Hengky">
<a href="http://sphotos-a.xx.fbcdn.net/hphotos-ash4/p206x206/480039_422560754446839_1421935342_n.jpg">
<img src="http://sphotos-a.xx.fbcdn.net/hphotos-ash3/p206x206/576205_421587091210872_394466854_n.jpg" /></a>
</div>

Keterangan :  

• Ganti kode Url gambar yang ditandai warna merah dengan kode Url gambar yang ingin sobat ganti 

6. Terakhir Publikasikan kalau sobat memasang nya di halaman HTML postingan blog dan Klik simpan kalau sobat memasang nya di halaman HTML Gadged blog .

Semoga artikel ini bermanfaat dan kalau ada waktu tinggal kan komentar tentang postingan ini untuk memastikan kode nya berfungsi atau tidak berfungsi di blog sobat .

Udah lama gak posting membuat Alexa blog ini semakin membengkak , supaya langsing lagi saya akan membuat sebuah postingan tentang tutorial blogger dengan pilihan judul Cara Membuat Headline News Animasi Di Blog yang berguna untuk mempermudah user melihat artikel terbaru di blog tanpa harus membuka Sitemap blog .

tampilanya cukup unik dan menarik pada blog seperti gambar diatas , kalau sobat ingin melihat secara detail tampilanya bisa dilihat melalui link ini http://lapautemplate.blogspot.com/ dan kalau sobat memang tertarik untuk mencoba silahkan ikuti tutorial nya di bawah ini :

1. Login dulu ke Account kepunyaan sobat
2. Pilih Tata Letak di dasbor blog
3. Klik salah satu Tambahkan Gadget
4. Lalu pilih HTML/JavaScript
5. Copy code Script dibawah ini dan pastekan kehalaman HTML/JavaScript

<script type="text/javascript">var hn_url_blog = "http://blog-rangga.blogspot.com/";var hn_jumlah_post = 15;var hn_warna_latar = "#FAF8F8";var hn_warna_garis = "#FD0606";var hn_posisi = "top";var hn_tampilkan_judul = true;var hn_backlink = true;</script> <script src="https://blograngga.googlecode.com/files/rangga_Headline-animasi.js"> </script>

Keterangan :

• Ganti http://blog-rangga.blogspot.com/ dengan Url kepunyaan sobat.
• Ganti 15 dengan jumlah link yang ingin di tampilkan
• Ganti warna latar atau backgroud widget FAF8F8. 
• Ganti warna garis FD0606
• Ganti posisi top sesuai dengan posisi yang di inginkan

6. Terakhir Simpan kode untuk melihat hasil nya diblog sobat

Terima kasih telah membaca artikel ini , semoga artikel ini bermanfaat dan berguna ......

Kolom atau tabel pada blog biasa nya berguna pada untuk memisahkan tulisan penting atau kode tertentu pada sebuah artikel pada blog/web dan kali ini saya akan berbagi Cara membuat kolom atau tabel teks dengan tombol  Select All pada blog yang berguna buat User untuk memblok kode yang ada di dalam tabel , tabel yang di lengkapi cocok di gunakan untuk meletakan link ataupun kode script karena cukup dengan dengan menekan tombol Select All kode otomatis akan terblok dan siap di copy seperti contoh yang saya gunakan pada halaman Tukar Link Otomatis Blog. Cara membuat nya yaitu dengan memasang kode di bawah ini :

<form name="copy"><div align="center"><input value="Select All" onclick="javascript:this.form.txt.focus();this.form.txt.select();" type="button"/></div><p style="text-align: center;"><textarea style="padding: 3px; width: 300px; height: 50px;" name="txt">Ganti dengan teks atau kode sobat </textarea></p></form>

Keterangan 

1. Ganti dengan teks atau kode sobat adalah tulisan atau teks di dalam tabel
2. padding: 3px; adalah jarak tulisan dengan pinggir kolom
3. width: 300px; adalah lebar atau panjang kolom 
4. height: 50px; adalah tinggi dari kolom atau tabel 

Semoga artikel ini berguna dan bermanfaat untuk yang telah berkunjung ke blog ini .

  Komentar pada suatu blog sangat berguna untuk meningkatkan peringkat blog di mata Search Engine yang dapat meningkatkan visitor atau kunjungan pada suatu blog dan buat seorang blogger memberi komentar juga sangat berguna untuk meningkatkan kunjungan blog karena dapat meningkatkan silaturahmi atar sesama blogger , tapi hati-hati pada saat berkomentar pada blog lain jangan meninggal kan link yang mengandung spam karena bisa membuat marah si empunya blog karena tidak tidak suka blog nya di kotori link external .

Sudah seminggu setelah postingan sebelum nya CARA MEMBUAT TULISAN BERJALAN SEPERTI DIKETIK PADA BLOG akhirnya update postingan lagi dengan judul Cara Memasang Jam Pada Blog  , Jam berguna untuk mengetahui waktu dalam kita melakukan kegiatan baik saat kita mau bekerja beristirahat dan sebagai nya , lalu apa hubungan nya pada blog ? Jam pada blog berguna untuk mengingatkan waktu kita beristirahat dan waktu bekerja karena jiwa seorang blogger sering melupakan waktu baik waktu istirahat , bekerja dan sebagai nya pada saat melakukan kegiatan blogger. jadi jam pada blog juga berguna karena bisa membawa manfaat buat orang lain dan diri sendiri untuk mengingatkan waktu selain berguna untuk mempercantik blog . supaya jam yang tepat waktu ada di blog yaitu dengan memasang widget nya yang biasa nya cocok di pasang di sidebar blog dan juga bisa di pasang di tempat lain di blog.
Supaya tidak berlama-lama lebih baik kita langsung saja pada cara nya :

1. Ambil jam nya dulu secara gratis melalui link ini http://www.clocklink.com/index.php
2. Pilih gallery seperti contoh gambar di bawah ini
3. Pada halaman gallery pilih jam pada menu sesuai dengan keinginan yang ingin di tampilkan di blog seperti gambar di bawah ini .
4. Setelah ketemu jam yang di inginkan klik View HTML Tag yang terdapat tepat di bawah jam yang di inginkan.
5. Untuk menyamakan waktu dengan tempat berada klik Select by City dan pilih kota yang terdekat dengan tempat di mana posisi berada .
6. Setelah watktu nya sesuai ambil kode dengan cara di copy code HTML nya .
7.  Pastekan kode nya ke halaman HTML Javascript Gadged blog .
8. Terakhir simpan kode supaya jam berfungsi di blog .

Semoga artikel ini bisa memberikan hal yang positif dan berguna bagi orang lain amin .....

Salah satu cara menjaring pengunjung blog yaitu dengan cara memodifikasi tampilan blog supaya terlihat bagus dan indah untuk dipandang bisa saja dengan menggunakan membuat tulisan berjalan seperti di ketik seperti contoh teks yang ada diatas postingan ini .
Supaya kode nya berfungsi yaitu dengan cara menyisipkan kode Script di dalam kolom dibawah ini ke dalam halaman HTML Javascript pada blog , baik pada halaman HTML postingan blog , Halaman HTML Gadget dan pada HTML Template blog .

<script language="JavaScript">
var text="CARA MEMBUAT TULISAN BERJALAN SEPERTI DIKETIK PADA BLOG";
var delay=10;
var currentChar=1;
var destination="[none]";
function type()
{
//if (document.all)
{
var dest=document.getElementById(destination);
if (dest)// && dest.innerHTML)
{
dest.innerHTML=text.substr(0, currentChar)+"<blink>_</blink>";
currentChar++;
if (currentChar>text.length)
{
currentChar=1;
setTimeout("type()", 5000);
}
else
{
setTimeout("type()", delay);
}
}
}
}
function startTyping(textParam, delayParam, destinationParam)
{
text=textParam;
delay=delayParam;
currentChar=1;
destination=destinationParam;
type();
}
</script>
<b></b>
<br />
<div 0px="" 10px="" arial="" color:="" ff0000="" font:="" id="textDestination" margin:="" style="background-color: white;">
</div>
<script language="JavaScript">
javascript:startTyping(text, 50, "textDestination");
</script>

Keterangan : Teks yang ditandai warna merah ganti dengan teks tulisan yang ingin di tampilkan

Kalau ingin membuat tulisan nya berjalan biasa naik dan turun dan sebagai nya kalau ada waktu silahkan kunjungi halaman tutorial nya melalui link ini CARA MEMBUAT TULISAN BERGERAK BUAT BLOG

Untuk memenuhi jawaban dari permintaan sobat pengunjung Blog Rangga pada postingan sebelum nya pada judul post  Cara Membuat Slide Show Foto / Gambar Pada Postingan Blog yang meminta supaya di bagikan Cara Membuat Slideshow Photo Menggunakan Tombol Navigasi Pada Postingan Blog , kali ini saya mencoba untuk memenuhi permintaan itu seperti contoh slideshow nya dibawah ini

Supaya slideshow nya berfungsi seperti di atas saya menggunakan kode yang saya dapat dari postingan nya Mas Noer Cholis yang mempunyai website keren http://www.carabuatwebgratis.com/ yaitu dengan langkah2 sebagai berikut :

1. Login dulu ke blogger.
2. Pilih Template di dasbor blog.
3. Pilih Edit HTML 
4. Centang dulu Expand Template Widget.
5. cari kode </head> gunakan Ctrl+F untuk memudahkan pencarian kode 
6. Pasang kode di bawah ini sebelum kode </head>

 7. Simpan Template
 8. Copy kode di bawah ini dan pastekan ke halaman HTML Gadget atau Halaman HTML Postingan blog sobat

<div id="carousel-container">
<div id="carousel">
<div class="carousel-feature">
<a href="http://blog-rangga.blogspot.com/2013/03/cara-hidup-pintar-dengan-tablet-pc.html">
<img alt="Blog Rangga" class="carousel-image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiG4ubPorw_zXx83S6PCRGgikiPjhAa85FW6nV2JrI8eou34Xz5Z14trUgVK13jI_iw0BfDjw1K7jTKp-kOYVI05N_zvQ7JeFsIW0_CNANogQaegH7R5HNkATVJW1fOoFDsD3N0bTFRKTwV/s1600/Blog+Rangga.jpg" title="Cara Membuat Slideshow Photo Menggunakan Tombol Navigasi Pada Postingan Blog" /></a>
<br />
<div class="carousel-caption">
Acer kembali meluncurkan produk baru nya yang sangat luar biasa yaitu  yang menyatukan Tablet PC dengan netbook yang menyatukan dua gadget sekaligus yang sangat mudah di bawa kemanapun sangat cocok untuk semua kalangan dan pekerjaan
 </div>
</div>
<div class="carousel-feature">
<a href="http://blog-rangga.blogspot.com/2013/02/cara-memasang-readmore-otomatis-dengan.html">
<img alt="Image Caption" class="carousel-image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgVh4j77lnbF5ekE7-fK60MYGAFRGmQEK56OM8j6l4jI-KzkcSv9bARFcIxabU2wlAF7373sA4xTJ-5rPXHbIdDHYni1ilLZSGw7DcU3cjHWx9c51lm9f7fOh6nSG0K8t2ImY5iMYSCLULu/s1600/Blog+Rangga.jpg" /></a>
<br />
<div class="carousel-caption">

blog rangga

Cara Membuat Readmore Otomatis Pada Blog Dengan Teks pernah saya bagikan di blog sebelum nya dan kali ini masih tutorial yang sama yaitu Cara Memasang

</div>
</div>
<div class="carousel-feature">
<a href="http://blog-rangga.blogspot.com/2013/02/download-gratis-skin-dan-aimp-terbaru.html">
<img alt="Image Caption" class="carousel-image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhKcCGyKsW5POJT5lUUM8TNtZEU5FPRjfMpntbTvi0MY8SLPOqOzwpvgm2HO0QLjS6GEZs3mrTQ5Q0MYlza8WJLKy5UbEkHQMJn7TaibTPwcDylYh-7kZWRzGIEDdF2zUEM9YeX6lsiC2Il/s1600/Blog+Rangga.jpg" /></a>
<br />
<div class="carousel-caption">

Aplikasi Audio Player yang satu ini memang tidak di ragukan lagi kualitas nya , selain hadir dengan berbagai macam tampilan nya yang menarik AIMP juga menghasilkan suara yang

</div>
</div>
<div class="carousel-feature">
<a href="http://blog-rangga.blogspot.com/2013/02/cara-memasang-widget-back-top-icon.html">
<img alt="Image Caption" class="carousel-image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi7mDBCnFD2WZgC6ovHMs_srNCSx_1_NM7W6DyV3DTkiZE8tNy7YShz4aaopeG2L36oXB0SkmHBtavGwUEg3T8wIbPDs0XExvKWCB3ZpGa3hNvoAAXo8nKDjycmOyR2LAccm1X6LGORB9Oj/s1600/Blog+Rangga.jpg" /></a>
<br />
<div class="carousel-caption">

Widget ini berguna untuk mempercepat kembali ke halaman bahagian atas dengan hanya mengklik icon Back Top , Cara Memasang Widget Back Top Icon Animasi Pada Blog ini

</div>
</div>
<div class="carousel-feature">
<a href="http://blog-rangga.blogspot.com/2013/01/cara-memasang-kamera-cctv-di-blog.html">
<img alt="Image Caption" class="carousel-image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEggd_py-saUYkJ_VNNj0fCBKcypTkPcc6eh0Y-R-h9OWoc9TsOKdpsdTOZzwAnSzUCK1JTntogXMCM48LTR14e65Tj8wZTldQ-OWrvZltla5eIsP6-ebgeZ_BO5FFV2kvaNSwlriA97eMv8/s1600/Blog+Rangga+copy.jpg" /></a>
<br />
<div class="carousel-caption">

Kamera CCTV di gunakan untuk memantau setiap kegiatan di suatu tempat seperti di Mall , Toko , Rumah Dll supaya aman dan bisa melihat dengan detail semua kejadian yang telah di

</div>
</div>
</div>
<div id="carousel-left">
<img src="https://github.com/bkosborne/jQuery-Feature-Carousel/raw/master/images/arrow-left.png" /></div>
<div id="carousel-right">
<img src="https://github.com/bkosborne/jQuery-Feature-Carousel/raw/master/images/arrow-right.png" /></div>
</div>

9. Klik simpan untuk melihat hasil nya di blog

Keterangan :

• Kode yang di tandai warna merah adalah kode URL gambar
• Kode yang di tandai warna merah adalah Link tautan gambar
• Kode yang di tandai warna kuning adalah deskripsi atau judul gambar

Semoga artikel ini bermanfaat dan selamat berexperiment ........

Cara Membuat Readmore Otomatis Pada Blog Dengan Teks pernah saya bagikan di blog sebelum nya dan kali ini masih tutorial yang sama yaitu Cara Memasang Readmore Otomatis Dengan Gambar Pada Blog yaitu dengan langkah-langkah sebagai berikut :

1. Login dulu ke Blogger
2. Pilih Template
3. Klik Edit HTML
4. Centang dulu Expand Widget Template .
5. Cari kode </head> gunakan control F untuk memudahkan pencarian kode </head> pada template.
6. Lalu hapus kode </head> dan ganti dengan kode di bawah ini

</head><script type='text/javascript'> var thumbnail_mode = &quot;no-float&quot; ; summary_noimg = 430; summary_img = 340; img_thumb_height = 100; img_thumb_width = 120; </script> <script src='http://blograngga.googlecode.com/files/read-moreotomatis.js' type='text/javascript'/>

7. Selanjut nya cari kode <data:post.body/> atau <p><data:post.body/></p>ganti kode tersebut dengan kode di bawah ini

<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 class='rmlink' style='float:right;padding-top:20px;'>
<a expr:href='data:post.url'><img alt='Read More..' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj9YjnzdyvclJRGe2poltq9P4Z4wh_TyYZxch5eevV2yieicgGWwYiI8KkG_28YdsmqlMG6lV6igTSOTJjtCLCV3f4Ch1UP8vXmgruWoS2NwizeQBrVhfwWE8_s6z3dGq-HS8Ie0UejPraV/s1600/blog+rangga+readmore.png'/></a></span>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if>

8. Terakhir Save Template untuk melihat hasil nya

Sebelum nya Blog Rangga pernah berbagi  Cara Menambah Halaman Gadget Diatas Header Blog dan untuk kali ini masih serupa tapi tak sama yaitu Cara Menambah 3 Kolom Gadged Di Bawah Header Blog , kolom di bawah header blog ini kebanyakan di manfaat kan sebagai sarana untuk tempat memasang iklan ppc dan iklan lain nya .

Supaya gadged bisa di tambah 3 kolom di bawah header blog kita harus sedikit menambahkan kode pada HTML Template blog yaitu dengan langkah -langkah sebagai berikut :

1. Login dulu ke Blogger
2. Pilih Template lalu klik Edit HTML
3. Simpan Template untuk berjaga-jaga seandai nya ada salah pengeditan 
4. Centang Expand Template Widget dulu
5. Cari kode ]]></b:skin>  Gunakan Ctrl+F untuk memudahkan pencarian kode
6. Pastekan kode di bawah ini tepat di atas kode ]]></b:skin>

<div id='box3' style='width: 35%; float: left; margin:0; text-align: left;'>
<b:section class='box-widget' id='col3' preferred='yes' style='float:left;'/>
</div> 

7.Selanjutnya Cari  salah satu kode ini <div id='main-wrapper'> atau <div id="main-outer"> atau <div class='main-outer'>
8. Paste kan kode di bawah ini di sebelum  kode di atas.

<div id='box-kolom-widget'>
<div id='box1' style='width: 35%; float: left; margin:0; text-align: left;'>
<b:section class='box-widget' id='col1' preferred='yes' style='float:left;'/>
</div>
<div id='box2' style='width: 30%; float: left; margin:0; text-align: left;'>
<b:section class='box-widget' id='col2' preferred='yes' style='float:left;'/>
</div>
<div id='box3' style='width: 35%; float: left; margin:0; text-align: left;'>
<b:section class='box-widget' id='col3' preferred='yes' style='float:left;'/>
</div>
<div style='clear:both;'/>
</div>

9. Klik Simpan untuk melihat hasil nya di blog.

Bingung dimana iklan mau di pasang karena terlalu banyak widget dan iklan yang telah terpasang di blog itulah yang sering di alami oleh blogger pada  saat mengatur posisi iklan ppc di blog .

Solusi memasang iklan di blog bisa di tempat kan dibawah judul postingan blog karena judul posting termasuk tempat strategis memasang iklan karena tempat tersebut sangat mudah terlihat oleh pengunjuang blog .

Kalau sobat ingin memasang kode HTML iklan di bawah judul postingan blog cari saja kode <data:post.body/> dan tempatkan kode script iklan di bawah nya , kalau kode <data:post.body/> ada 3 atau 2 pilih kode <data:post.body/> yang kedua .

semoga berhasil ................

   Link new tab adalah link URL yang terbuka di tab baru tanpa menutup halaman utama , pada Postingan Selasa, 07 Februari 2012 yang lalu saya juga pernah berbagi Cara Membuat Link New Tab Otomatis Blog yaitu semua link  yang diklik pada blog akan membuka tab baru .

   Untuk postingan kali ini yaitu link URL yang ada pada komentar blog akan membuka tab baru pada saat di klik tanpa pengunjung meninggalkan halaman utama trik ini berguna untuk blog agar pengujung jangan meninggalkan halaman utama blog sobat pada saat membuka link pada komentar blog .

silahkan ikuti Cara Membuat Link Komentar Terbuka Di Tab Baru Blog di bawah ini :

• Login ke blogger

• Pilih Template

• Klik Edit HTML

• Centang Expand Template Widget

• Kemudian cari kode <a expr:href='data:comment.authorUrl' rel='nofollow'> biasanya sebelum kode <b:if cond='data:comment.authorUrl'> dengan menggunakan Ctrl+F

• Hapus kode ini  <a expr:href='data:comment.authorUrl' rel='nofollow'>dan sobat ganti dengan kode <a expr:href='data:comment.authorUrl' rel='nofollow' target='_blank'>

• Simpan tamplate dan buka salah satu link pada komentar blog untuk melihat hasilnya.

Semoga bermanfaat..........

Search engine seperti Bing sangat baik untuk membantu dalam meningkatkan SEO blog , salah satu cara nya yaitu harus mendaftar kan blog ke search engine dan memasang meta tag Bing di di template blog supaya blog terlacak oleh spider search engine Bing , Berikut Cara Mendaftarkan Blog dan Memasang Meta tag Bing di Blog :

• pertama login dulu dengan Bing -Webmaster Tools , kalau yang belum punya account bing Sign up dengan menggunakan Microsoft account

• Masukan url blog pada kolom Add Site lalu klik ADD untuk melanjutkan .

• Untuk mendapakan kode meta tag Bing isi kolom Add a sitemap dengan Url blog yang tadi di daftarkan dan klik ADD

• Copy kode di beri warna abu-abu dan pastekan di template blog centang dulu Expand Widget Tempalte sebelum meletakan dibawah kode <head> template kode yang sudah di copy dari halaman Bing

• Terakhir buat lah paling sedikit 5 postingan agar blog bisa terIndex oleh Bing .
Semoga berhasil dan terima kasih telah berkunjung ke blog ini ..........

Salah satu guna dari Menu Drop Down di Blog yaitu dapat menghemat ruang pada blog yaitu bisa untuk menempat kan banyak  link , artikel terkait , blog roll ,daftar isi blog dan sebagai nya di dalam nya yang pasti membuat sebuah blog lebih tampak rapi .
Bagaimana cara memasang nya di blog ? cara pasang nya bagi sobat yang ingin mencoba bisa dengan mengikuti langkah-langkah nya di bawah ini :

• Login dulu dengan account blogger sobat.

• Lalu pilih '' Page element " atau " Tata letak "di dasbor blog .

• Selanjut nya pilihatau "Add Page Element" atau " Tambah Gadget".

• Pilih " HTML/ Javascript " lalu copas code dibawah ini ke halaman tersebut.

<select onchange="document.location.href=this.options[this.selectedIndex].value;">
<option selected="selected" value="0">Arsip Blog</option>
<option value="Link Sobat Disini">Judul Link</option>
<option value="Link Sobat Disini">Judul Link</option>
</select>

  
Keterangan :
Text yang di stabilo hijau adalah ganti dengan link sobat .
Text yang di stabilo biru adalah tulisan yang untuk judul link dsb .
contoh nya dibawah ini sob :

<select onChange="document.location.href=this.options[this.selectedIndex].value;">
<option value="0" selected>Widget Blog</option>
<option value="http://blog-rangga.blogspot.com/2012/07/cara-pasang-widget-anti-virus-online-di.html"> Cara Pasang Widget Anti-Virus Online Blog </option>
<option value="http://blog-rangga.blogspot.com/2012/06/cara-pasang-widget-recent-comment-keren.html"> Cara Pasang Widget Comment di Blog </option>

Widget Blog Cara Pasang Widget Anti-Virus Online Blog Cara Pasang Widget Comment di Blog

 Kalau sobat ingin menambah atau memodifikasi kode nya bisa sobat kreasikan sendiri mungkin sobat lebih jenius lagi , Semoga bermanfaat .

Pada template bawaan blog biasa terdapat ruang kosong di bawah kotak komentar blog , menurut saya ruangan kosong dibawah kotak komentar dibawah blog tersebut kurang rapi dari segi tampilan blog ,walupun mungkin ada guna nya , saya juga tidak tahu maklum masih newbe so...he...he...

Dengan bantuan mbah google akhirnya  jadi juga saya  merubah tampilan di bawah kotak komentar di blog ini  biar lebih rapi dengan Cara Menghapus Ruang Kosong Di Bawah Kotak Komentar Blog yang bisa sobat lihat gambar nya sebelum dan sesudah di edit di bawah ini :





sebelum di edit





sesudah di edit

Kalau sobat mau mencoba juga cara ini silahkan ikuti langkah-langkah nya dibawah ini :

• Login Ke Blogger dengan akun sobat.
• Tata letak lalu ke Edit HTML.
• centang dulu Expand widgets template
• Cari Kode yang mirip dengan kode di bawah ini:

<a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src'/>,m,ndsb
      <iframe allowtransparency='true' class='blogger-iframe-colorize blogger-comment-from-post' frameborder='0' height='410' id='comment-editor' name='comment-editor' src='' style='display: none' width='100%'/>
    <b:else/>
      <h4 id='comment-post-message'><data:postCommentMsg/></h4>
      <p><data:blogCommentMessage/></p>
      <data:blogTeamBlogMessage/>

• Kalau sudah ketemu silahkan ubah code yang di stabilo biru height='410' dengan ukuran 220 hingga kodenya menjadi seperti ini height='220'.

• Simpan simpan/save template sobat.

• Buka pada kotak komentar di bawah postingan blog sobat untuk melihat hasil nya.

Gampangkan caranya sob ,......oh ya sob kalau ada yang tahu guna ruang kosong di bawah kotak komentar  blog tolong di kasih tau ya !

   Keterangan :Tinggi 220 bisa disesuaikan keinginan sobat

Pada postingan sebelumnya membahas Cara Membuat Link Bergerak Di Blog dan kali ini masih seputaran memodifikasi link pada blog yaitu Cara Menghilangkan garis bawah pada link blog
Setiap link tautan yang di lalui cursor pada template  standar bawaan blogger akan muncul garis pada link tersebut , mungkin sebagian sobat yang mau merubah tampilan blog dengan menghilangkan garis bawah tersebut , disini sobat dapat mempraktekan Cara Menghilangkan garis bawah pada link blog dengan mengubah sedikit kode CSS pada template blog sobat ,

Silahkan ikuti penjelasan nya di bawah ini :

• Login dulu ke blog sobat =>> rancangan
• klik edit HTML
• Back up/download template lengkap seandai nya terjadi kesalahan .
• Centang expad widget template di pojok atas.
• Perhatikan Kode CSS yang mirip di bawah ini pada kode HTML blog sobat ini biasa nya kode  ini adalah kode link  .

a:link {
color:#58a;
text-decoration:underline;
}

a:hover {
color:#c60;
text-decoration:underline;
}

a:visited {
color:#969;
text-decoration:underline;
}

• Jadi kode ini lah yang akan di modifikasi , cari kode ini underline pada blog rubah menjadi none nanti kode ini akan seperti ini contoh: text-decoration:none; dan silah kan sobat rubah satu persatu kode tersebut di blog sobat. 
• Lalu simpan tempalate sobat dan lihat hasil nya.

Kalau ada kesalahan saya mohon maaf dan tolong di kasih saran di kotak komentar , nanti akan saya perbaiki , maklum saya masih newbe sob......



SELAMAT MENCOBA

Cara Membuat Banner Flash Online ini lah judul postingan saya kali ini , kali ini saya akan berbagi cara mudah membuat banner flash secara online .
Cara ini sangat berguna buat pemula seperti saya , mudah-mudahan  tips trik ini bisa membantu sobat yang lain yang ingin membuat banner secara mudah dan gratis , silahkan kan ikuti langkah nya dibawah ini

• Siap kan komputer/laptop sobat.
• Lalu hubungkan koneksi sobat buat berselancar bagi yang tidak ada mohon bersabar ya !
• Kalau sudah silahkan kunjungi link ini http://www.flashvortex.com/index.php
• Mulai lah berkreasi secara gratis sesuai keinginan sobat .
• Copy paste kode di blog sobat hasil dari edit .
• Terakhir lihat hasil nya .

Contoh Hasil Edit Admin


Gampang kan cara nya .....!

SEMOGA BERMANFAAT