Sunday, November 25, 2012

Cara Membuat Form Kontak di Blog


Postingan kali ini adalah Cara Membuat Form Kontak di Blog . From Kontak ini gunanya untuk mempermudah pengunjung memberi kritk/saran pada blog. Dengan kata lain kedua pihak antara pemilik suatu blog/website dan pengunjung suatu blog/website dapat menjaga privacy masing-masing karena contact form ini. Selain itu, memasang contact form juga berfungsi untuk menghindari spam yang dikirim melalui email.
Contoh yang saya buat dibawah ini:

Bila mau membuat From Kontak silahkan klik link berikut ini disini

Semoga Cara Membuat Form Kontak di Blog ini bermanfaat. Terimakasih







Cara Membuat Form Kontak di Blog, Tutorial Membuat Form Kontak di Blog, Tips Membuat Form Kontak di Blog, Cara Membuat Form Kontak di Blog dengan Mudah, How to Create a Contact Form in Blog, Tutorials Make Contact Form on the Blog, Tips to Make Contact Form on the Blog, How to Create a Contact Form in Blog with Ease

Monday, November 19, 2012

Menampilkan Widget Pada Halaman Tertentu

Menampilkan Widget Pada Halaman Tertentu

Cara Menampilkan Widget Pada Halaman Tertentu
1. Login ke Blogger.
2. Di halaman Dasbor, kita pilih Rancangan.
3. Kemudian pilih Edit HTML
4. Beri tanda centang pada Expand Template Widget.


Cara menampilkan widget pada halaman awal (homepage) saja.

Sisipkan kode <b:if cond='data:blog.url == data:blog.homepageUrl'> di bawah kode <b:includable id='main'>
Dan kode penutup </b:if> di bawah kode <b:include name='quickedit'/>
Contoh:

<b:widget id='HTML4' locked='false' title='TULISAN TERPOPULER' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>

<b:include name='quickedit'/>
</b:if>
</b:includable>
</b:widget>

HTML dengan id HTML4 yang judulnya TULISAN TERPOPULER akan hanya tampil di halaman awal (homepage) dan tidak tampil di halaman postingan.

Cara menampilkan widget pada halaman postingan saja

Sisipkan kode <b:if cond='data:blog.pageType == &quot;item&quot;'> di bawah kode <b:includable id='main'>
Dan kode penutup </b:if> di bawah kode <b:include name='quickedit'/>
Contoh:

<b:widget id='HTML7' locked='false' title='TULISAN TERBARU' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>

<b:include name='quickedit'/>
</b:if>
</b:includable>
</b:widget>

HTML dengan id HTML7 yang judulnya TULISAN TERBARU akan hanya tampil di halaman postingan saja dan tidak tampil di halaman awal.

Kumpulan Code Blockquote

Apa itu Blockquote ? Blockquote adalah kalimat berisi kutipan dari suatu sumber yang di blok pada satu kotak yang memiliki arti penting.


Contohnya seperti dibahwa ini:

Code 1
.post blockquote {
margin : 0 20px; padding: 60px 30px 40px 20px;
background : #F1F8FE url(http://3.bp.blogspot.com/_7wsQzULWIwo/SwhrZYtvrRI/AAAAAAAACRs/Q0k6eaIjnys/s400/owl.png) no-repeat 350px 5px;
font: normal .9em "comic sans ms", Courier,"Times New Roman", Times, serif;
color : #000; border-left: 8px dotted #DAB547;
}

.blockquote p {
margin: 0; padding-top:10px;
}
Cara Edit Blockquote dan kodenya | Turial Vicahya™
Code 2
.post blockquote {
margin : 0 20px; padding: 70px 20px 20px 40px;
background : #E4EAFE url(http://3.bp.blogspot.com/_7wsQzULWIwo/Swb4cWgxCUI/AAAAAAAACN8/k2V4tUcGx14/s400/angular-purple.gif) no-repeat top left;
font: bold 1em Helvetica, verdana, Georgia, "Times New Roman", Times, serif;
color : #000; border-bottom : 5px solid #435388;
}

.post blockquote p {
margin: 0; padding-top:10px;
}
Cara Edit Blockquote dan kodenya | Turial Vicahya™
Code 3
.post blockquote {
margin : 0 20px; padding: 10px 20px 25px 20px;
background : #9FCFFF url(http://1.bp.blogspot.com/-Htz3jfbcSXM/TbEp4OcNKII/AAAAAAAAAew/Qmrl3_Gm1KQ/s1600/block22.gif) no-repeat right bottom;
font: bold .9em "comic sans ms", arial, Helvetica,verdana, Georgia;
color : #484848;
border: 5px dashed #fff;
}

.post blockquote p {
margin: 0; padding-top:10px;
}
Cara Edit Blockquote dan kodenya | Turial Vicahya™
Code 4
.post blockquote {
background: #F3F3F1 url(http://3.bp.blogspot.com/_7wsQzULWIwo/Swb5Jv9YD4I/AAAAAAAACPc/BJ-zgoLMJXw/s1600/comma-side-orange1.gif);
background-position:; background-repeat:repeat-y;
margin: 0 20px;
padding: 20px 20px 10px 45px; font-size: 0.9em;
font: italic 1.2em Georgia, "Times New Roman", Times, serif;
}

.post blockquote p {
margin: 0; padding-top: 10px;
}
Cara Edit Blockquote dan kodenya | Turial Vicahya™
Code 5
.post blockquote {
background: #484B52 url(http://3.bp.blogspot.com/_7wsQzULWIwo/Swb5J3xbxyI/AAAAAAAACPk/gxR76OhXXaw/s1600/green-black-side.gif) ;
background-position:;
background-repeat:repeat-y;
margin: 0 20px;
padding: 20px 20px 20px 50px; color:#C7CACF;
font: normal 0.9em Helvetica, verdana, serif, Georgia, "Times New Roman";
}

.post blockquote p {
margin: 0; padding-top: 10px;
}
Cara Edit Blockquote dan kodenya | Turial Vicahya™
Code 6
.post blockquote {
margin : 0 20px; padding: 20px 60px 80px 20px;
background : #FEE4E3 url(http://1.bp.blogspot.com/_7wsQzULWIwo/Swb4ckuuUwI/AAAAAAAACOE/lJfkdjco3aw/s400/angular-right.gif) no-repeat bottom right;
font: bold italic 1em Georgia, verdana, Helvetica, "Times New Roman", Times, serif;
color : #000; border: 1px solid #DDD;
}

.post blockquote p {
margin: 0; padding-top:10px;
}
Cara Edit Blockquote dan kodenya | Turial Vicahya™
Code 7
.post blockquote {
margin : 0 20px; padding: 70px 20px 30px 20px;
background : #E7E5DC url(http://3.bp.blogspot.com/_7wsQzULWIwo/SwhrY8vdJeI/AAAAAAAACRc/8Ed9vrlWWGo/s400/block3331.gif) no-repeat top;
font: bold .9em Helvetica, "comic sans ms",Courier,"Times New Roman", Times, serif;
color : #343434;
border-left : 7px solid #FF7802;
border-right : 7px solid #FF7802;
border-bottom : 7px solid #FF7802;
}

.post blockquote p {
margin: 0; padding-top:10px;
}
Cara Edit Blockquote dan kodenya | Turial Vicahya™
Code 8
.post blockquote {
background-position:-10px -7px;
border: 1px dashed #FFC600;
margin: 20px 10; padding: 0 20px 0 50px;
background: url("http://3.bp.blogspot.com/_jM8-wHc3NKY/TR3MwDiXB1I/AAAAAAAAAQo/Fi8TGwkSRNQ/s1600/quote.png") 5% no-repeat #FFF8DD;
}
Cara Edit Blockquote dan kodenya | Turial Vicahya™
Code 9
.post blockquote {
padding-left:30px;
padding-right:5px;
background:url(http://www.darkfalltournament.com/images/blockquote.png) no-repeat 0 .0em;
color:#444;
font-style:italic;
text-align:left;
margin:1em 20px;
}
Cara Edit Blockquote dan kodenya | Turial Vicahya™
Code 10
.post blockquote {
background-color: #666;
color: #fff;
font-weight: bold;
padding: 10px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
}
Cara Edit Blockquote dan kodenya | Turial Vicahya™
Code 11
blockquote{width: 90%;background:#FFF; padding:5px 15px; margin:5px; color:#555; border:1px solid #C1C1AE; line-height:150%; font-size:12px;border: 1px solid #eee;
-webkit-box-shadow: 8px 8px 16px 4px rgba(0,0,0, 0.4);
-moz-box-shadow: 8px 8px 16px 4px rgba(0,0,0, 0.4);
box-shadow: 8px 8px 16px 4px rgba(0,0,0, 0.4);
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;}

Cara Edit Blockquote dan kodenya | Turial Vicahya™

Cara menambahkan blockquote pada template adalah sebagai berikut : 
  •  Login pada dashboard blogger anda.
  • Pilih Rancangan > Edit HTML, centang Expand widget template.
  • Carilah kode ]]></b:skin> pada template anda.
  • Copy kode css blockquote diatas dan paste tepat diatas kode ]]></b:skin>.
  •  Save template anda.

Untuk cara membuat blockquote pada postingan sangat mudah, cara manualnya adalah teks yang dikutip harus diapit dengan kode blockquote pembuka <blockquote> dan kode blockquote penutup </blockquote>. Trus kalo mau yang otomatis, pada saat berada dalam panel postingan blogger tinggal diblok saja teks yang mau dijadikan blockquote kemudian klik simbol quotation atau tanda petik, maka teks yang dijadikan blockquote akan di-indentasi (menjorok kedalam) secara otomatis.

Cara Membuat Scroll Pada Bagian Kotak Komentar Blog




Untuk Cara Membuat Scroll Pada Area Komentar ,kita dapat mengikuti langkah-langkah di bawah ini :
  1. Masuk ke akun blogger >> Lalu klik rancangan >> lalu klik Edit HTML.
  2. Untuk jaga-jaga adanya kesalahan dalam pengeditan, sebaiknya download dulu template kamu.
  3. Kemudian cari kode berikut #comments-block{ . Gunakan tombol Ctrl+F untuk mempermudah pencarian. (Jangan lupa sebelumnya centang Expand Widget dan salin template anda untuk jaga-jaga). Sehingga kode lengkapnya sepeti ini :

    #comments-block{border:0px dotted #ccc;width:569px;margin:1.3em 0 1.5em;line-height:1.6em}

  4. Selanjutnya kita menghapus kode {border:0px dotted #ccc; dan ganti dengan kode max-height:300px;border:1px solid #eee;overflow:auto; Sehingga hasil kodenya itu berbentuk seperti ini :
    #comments-block{max-height:300px;border:1px solid#eee;overflow:auto;width:569px;margin:1.3em 0 1.5em;line-height:1.6em}

    Keterangan :
    Tinggi scroll adalah 300 px ,sedangkan tebalnya border adalah 1 px ,untuk warna border adalah yang #eee . Hal-hal itu dapat di ganti dengan selera masing-masing.

Sunday, November 18, 2012

Cara Memindahkan Blog Lama Ke Blog Baru (Ekspor Import Blog)

Cara memindahkan blog lama ke blog baru - Tutorial ekspor dan import blog ini bertujuan untuk membuat salinan atau backup data blog dan juga menjadi solusi apabila blog kebetulan terhapus dengan sendirinya tanpa anda ketahui apa penyebabnya, jadi anda masih punya salinannya / backup data blog anda. Jika anda sudah bosan atau lagi bermasalah dengan blog yang sudah lama anda buat dan ingin menggantinya dengan blog baru, mudah caranya. Mungkin dengan cara memindahkan seluruh postingan blog lama ke blog baru, blog anda akan tampil lebih fresh dengan wajah baru. Sebenarnya postingan ini, tata caranya sama dengan postingan saya sebelumnya tentang cara backup postingan blog. Bagaimana cara import post blog ke blog baru? Ok simak tutorial dibawah ini :
memindahkan blog lama ke blog baru

Langkah cara pindah post blog ke blog baru :

1. Login ke Blogger
2. Pada Dashboard => Klik Setting / Setelan
3. Klik Other/Lainnya
3. Pilih Export / Ekspor Blog
4. Pilih Download blog, biasanya hasil downloadnya berextensi .xml, contoh : blog-09-09-2012.xml
5. Kalau sudah selesai download, simpan dulu hasil file download

Langkah selanjutnya
1. Masuk ke blog yang baru anda
2. Pada Dashboard => Klik Setting
3. Klik Other/Lainnya
4. Lalu pilih Impor Blog
5. Lalu pilih file yang sudah didownload dan masukkan kode privasi pada kotak yang dibawahnya
6. Jangan lupa centang "Terbitkan semua entri yang diimpor secara otomatis"
7. Kemudian klik unggah / Impor Blog

Semoga informasi singkat tentang memindahkan blog lama ke blog baru ini dapat bermanfaat, happy blogging.

Wednesday, November 14, 2012

Tips Agar Web Blog Tidak Bisa Di Open Source

 Saya akan memberikan tips agar blog atau website tidak bisa di view open source, Ctrl+U, Ctrl+A, Ctrl+C. Awal mulanya penasaran dengan blog atau website orang yang tidak bisa di view open source tersebut, dengan penasaran saya cari dan akhirnya ketemu cara tersebut.
Untuk pengguna Blogger caranya sebagai berikut:
- Login
- Pengaturan
- Edit html dan cari kode <body>- Lalu ganti kode tersebut dengan kode dibawah ini.

<body oncontextmenu='return false;' onkeydown='return false;' onmousedown='return false;'>

Sedangkan untuk Wordpress
- Login- Appearance
- Editor
- Header.php
- Cari kode <body>
- Lalu ganti dengan kode di atas.

Jadi untuk penggunaannya
oncontextmenu='return false;' = untuk tidak bisa di klik kanan
onkeydown='return false;' = untuk tidak bisa menggunakan Ctrl+U
onmousedown='return false;' = untuk tidak bisa mengcopy teks dengan kursor


Jadi ini bisa menggunakan salah satu , atau dua atau ketiganya sekaligus. hehe
Saya udah coba berhasil, tapi tidak diterapkan hanya sebuah pengalaman saja. saya suka bt kalo nyari bahan tugas malah gak bisa dicopy, justru itu saya tidak menggunakannya.

Tapi untuk contoh biar tau coba gunakan postingan ini menggunakan Ctrl+U, Ctrl+A, Ctrl+C yang tidak Bisa Di Open Source dan coba ganti potingan yang lain milik saya pasti bisa. Karena saya menerapkan hanya di postingan ini saja.
Cukup sekian Tips Agar Web Blog Tidak Bisa Di Open Source Terima Kasih.