Cara Membuat Kotak Text Area

Adapun kode untuk membuat Kotak Text Area tersebut adalah seperti di bawah ini:

<textarea name="code" ro<p align="center"ws="6" cols="30"> disini tempat untuk menyimpan kode html/javascript atau pesan anda</textarea></p>

A. Cara Pasang di SideBar Blog:

1. Login ke Blogger, kemudian pilih Tata Letak --> Element Halaman;
2. Klik Tambah Gadget lalu pilih HTML/Java Script;
3. Copy dan paste kode di atas pada tempat yang disediakan;
4. Sebelum disimpan Anda bisa mengatur ukuran kotak sesuai keinginan yaitu dengan merubah angka pada rows untuk tinggi kotak dan pada cols untuk lebar kotak.
5. Terakhir Simpan dan lihat hasilnya.

Contoh :

disini tempat untuk menyimpan kode html/javascript atau pesan anda

B. Cara Pasang di Postingan:

Cara memasang pada postingan itu sangat mudah, Anda cukup memasukan kode di atas sesuai keinginan Anda dan sebelum mempublish postingan Anda harus pastikan dahulu bahwa pada menu Post Option postingan pilih Tafsirkan HTML yang diketik, selanjutnya klik Publish, selesai.

Merubah Ukuran Gambar di Blog

Gambar yang akan dipasang di halaman blog tentu harus melalui proses upload terlebih dahulu. Setelah gambar selesai diupload maka akan didapat link gambar sebagai berikut:

           <img src='URL gambar">

Apabila ingin membuat gambar tadi menjadi link yang mengarah ke blog anda, maka susunannya menjadi :

<a href='URL Blog Anda'><img src='URL gambar "></a>

Dari susunan kode seperti tersebut di atas, gambar yang muncul masih menampilkan ukuran yang sebenarnya. Sehingga bila tempat yang tersedia di blog lebih sempit dari gambar akan menimbulkan masalah baru...Cara mengatasinya, gambar harus diatur.  

Kode yang diperlukan adalah kode width dan height

(width=lebar, height=tinggi). Sedangkan penempatan kodenya seperti ini :

 

         <img src='URL gambar' width='100' height='80'>

 

Atau bila ingin membuat gambar tadi menjadi link yang mengarah ke blog anda, maka susunannya menjadi :

<a href='URL Blog Anda'><img src='URL gambar' width='100' height='80'></a>

Catatan:

Untuk mengatur (memperbesar/memperkecil) ukuran gambar, ubahlah angkanya sesuai yang dikehendaki.

Cara Membuat Spoiler Pada Sidebar atau Postingan

Dengan Spoiler kita bisa menghemat tempat dll. Cara membuatnya  sama saja tinggal menggunakan kode HTML  seperti di bawah ini :

<div style="margin-bottom: 2px;">Judul Spoiler
<div style="margin-top: 5px; text-align: center;"><input value="Buka" style="margin-top: 5px; width: 60px; font-size: 10px;" onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = ''; this.innerText = ''; this.value = 'Tutup'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Buka'; }" type="button"> </div>
<div style="border: 1px inset ; margin: 0px; padding: 6px;"><div style="display: none;"> Silahkan masukan Isi Spoiler disini,  Bisa teks atau gambar / foto  </div></div></div>

Perhatikan tulisan berwarna merah, itu bisa diganti sesuai keinginan. dan isi pokok dari spoiler bisa berupa teks atau gambar.....................................

contoh spoiler

Mengenal Sedikit Kode Dasar HTML

Berikut ini saya akan menyebutkan berbagai macam kode HTML dasar yang perlu diketahui.

1	<br>	Turun satu baris kebawah(enter) / Kursor dan kalimat dibelakangnya turun 1 baris kebawah
2	<big>isi tulisan</big>	Membuat tulisan menjadi sedikit lebih besar
3	<font color=”warna tulisan“>isi tulisan</font>	Mewarnai tulisan. Ganti warna tulisan dengan salah satu pilihan yang ada : red, blue, yellow, green, brown, gold, purple
4	&nbsp;	Menambah 1 spasi karena ada kemungkinan penggunaan 2 spasi tidak akan terbaca pada beberapa engine blog
5	<font size=”ukuran tulisan“>isi tulisan</font>	Mengganti ukuran tulisan. Bisa digunakan apabila kode pada no. 2 tidak sesuai dengan keinginan kita
6	<strong>isi tulisan</strong> atau <b>isi tulisan</b>	Untuk menebalkan tulisan. Fungsi sama dengan ”’isi tulisan”’ atau tombol ‘cetak tebal’
7	<p>	Kursor dan kalimat dibelakangnya turun satu setengah baris kebawah
8	<u>isi tulisan</u>	Membuat garis bawah tulisan
9	<small>isi tulisan</small>	Membuat tulisan menjadi sedikit lebih kecil
10	<s>isi tulisan</s>	Membuat garis mencoret pada tulisan
11	<pre>isi tulisan</pre>	Membuat tulisan tetap pada keadaan yang kita inginkan, misalnya untuk urutan berjejer kebawah
12	<center>isi tulisan</center>	Membuat tulisan berada di tengah halaman
13	<blink>isi tulisan</blink>	Membuat tulisan tampak berkedip

Anda pun juga dapat mengkombinasikan kode-kode tersebut untuk menciptakan teks yang lebih bervariasi. Ada juga yang perlu diketahui bahwa tidak semua website atau blog kompatibel dengan kode-kode tersebut.

Membuat Related Post Bergambar Dan Bergerak

langkah-langkahnya sebagai berikut :

1.Log in ke blogger.com dengan ID yang dimiliki

2.Klik Rancangan pada dashboard menu

3.Klik Edit HTML, jangan lupa memberi tanda centang pada "Expand Widget Templates"

4.Selanjutnya cari kode berikut </head>

5.Letakkan kode di bawah ini sebelum kode tersebut :

<!--Related Posts with thumbnails Scripts and Styles Start-->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style type="text/css">
#related-posts {
float:center;
text-transform:none;
height:100%;
min-height:100%;
padding-top:5px;
padding-left:5px;
}

#related-posts h2{
font-size: 1.6em;
font-weight: bold;
color: #585858;
font-family: Georgia, &#8220;Times New Roman&#8221;, Times, serif;
margin-bottom: 0.75em;
margin-top: 0em;
padding-top: 0em;
}
#related-posts a{
color:#FFFFCC;
}
#related-posts a:hover{
color:#000000;
}

#related-posts a:hover {
background-color:#d4eaf2;
}
</style>
<script src='http://blogergadgets.googlecode.com/files/relatedthumbs21.js' type='text/javascript'/>
</b:if>
<!--Related Posts with thumbnails Scripts and Styles End-->

6. Sekarang cari lagi kode dibawah :

<div class='post-footer-line post-footer-line-1'>

                       atau 

<p class='post-footer-line post-footer-line-1'>

masukan semua kode dibawah ini tepat dibawah salah satu dari kode diatas  no : 6

<!-- Marquee Nobi Related Posts with Thumbnails Code Start-->

<b:if cond='data:blog.pageType == &quot;item&quot;'>

<div id='related-posts'>

<b:loop values='data:post.labels' var='label'>

<b:if cond='data:label.isLast != &quot;true&quot;'>

</b:if>

<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_thumbs&amp;max-results=12&quot;' type='text/javascript'/></b:if></b:loop>

<h3><b>Related Posts</b></h3>

<marquee align='center' behavior='alternate' direction='left' onmouseout='this.start()' onmouseover='this.stop()' scrollamount='2' width='100%'>

<script type='text/javascript'>

var currentposturl=&quot;<data:post.url/>&quot;;

var maxresults=10;

var relatedpoststitle=&quot;&quot;;

removeRelatedDuplicates_thumbs();

printRelatedLabels_thumbs();

</script></marquee>

</div><div style='clear:both'/>

</b:if>

<b:if cond='data:blog.url == data:blog.homepageUrl'><b:if cond='data:post.isFirstPost'>

</b:if>

</b:if>

<!-- Marquee Nobi Related Posts with Thumbnails Code End-->

Langkah terakhir Simpan Template kemudian lihat hasilnya.

Memasang Meta Tag Di Blogspot

Dengan meta tag di blog anda, akan mempermudah mesin pencari untuk meng-indeks blog anda.. 

Caranya adalah : ..........................................................

1. Silahkan anda login ke akun blogger sedulur
2. Kemudian klik Rancangan >> Edit HTML [ jangan lupa untuk mencentang Expand Template Widget ]
3. Kemudian cari kode berikut [ untuk mempermudah pencarian tekan Ctrl+F atau F3 ]

   <b:include data='blog' name='all-head-content'/>

4. Kemudian copy kode berikut dan taruh tepat dibawah kode tadi :

   <meta content='Deskripsi Blog' name='description'/>
   <meta content='Kata Kunci Blog' name='keywords'/>
   <meta content='Nama Anda' name='author'/>

    
5. Keterangan : Ganti Text yang berwarna merah, sesuai intruksi berikut :
   Deskripsi Blog --> Penjelasan Tentang isi dari Blog sedulur
   Kata Kunci Blog --> Kata Kunci tentang Blog sedulur
   Nama Anda --> ya....nama sedulur, masa sih nama saya.....hehehe
   
6. Jika sudah simpan template...selesai.
   

Tambahan : jika memang anda masih bingung dalam peengisian Meta Tag. 

                     saya beri contoh Meta Tag dari Blog saya :

<meta content='Tempat Belajar Blogger, Bisnis online, Dan Tips Dunia Internet' name='description'/>
<meta content=' Tutorial Blogger Baru, Windows Tips, Tips Internet, Hacking Tips, Tips Usil, Tips Facebook, Download Software Penting' name='keywords'/>
<meta content=' gyanfs' name='author'/>

Semoga bermanfaat.

Link kita Muncul Setiap Artikel di Copy

Bagi teman2 yang tertarik untuk membuat "Copas Auto View Link"  maka caranya tidak sulit, karena kita tinggal menggunakan jasa web http://www.tynt.com/,, silahkan langsung buat akun di sana gratis lho. Sudah itu cara masang kode-nya gampang, biasanya nanti tman2 disuruh nyimpan kode yg tlah disediakan pada bagian sebelum kode tag </body> , yah pokoknya gampanglah.....

                                                          SELAMAT MENCOBA