Dokumen tersebut memberikan panduan lengkap untuk membuat website menjual properti menggunakan blogger secara gratis. Langkah-langkahnya meliputi mendaftar akun blogger, mengunduh template khusus properti, mengisi konten seperti informasi produk dan kontak, serta mengedit tampilan situs dengan unsur navigasi dan pencarian.
Cara berjualan property melalui blogspot atau google blogger toko online blogspot
1. 1
DAFTAR ISI
Judul Isi Halaman
Setting Dasar Template Property 1
Membuat Menu Halaman Navigasi 17
Membuat Halaman Contact Form 19
Membuat Halaman Cara Order 25
Merubah Header Blogspot 29
Kunjungi situs
www.membuat-toko-online-gratis.blogspot.com guna mendapatkan full access
www.toko-onlineblogspot.info
ebook ini lengkap dengan bonus template dan tool toko online anda.
2. www.toko-onlineblogspot.info
CARA MENJUAL PROPERTY SECARA ONLINE MELALUI INTERNET MENGGUNAKAN
BLOGSPOT ATAU GOOGLE BLOGGER
CONTOH WEBSITE PROPERTY
CARA PALING MUDAH DAN MURAH TANPA HARUS BELI DOMAIN DAN HOSTING
www.toko-onlineblogspot.info
Anda ingin mendapatkan template blogger yang bisa menjual property seperti contoh blog di atas? Maka
baca petunjuk di bawah ini satu persatu dengan pelan dan jangan terburu-buru. E-book ini adalah e-book
gratis berisi panduan lengkap tentang cara membuat website yang bisa menjual property atau
menyewakannya kepada calon investor.
Dilihat dari penampilannya website di atas sudah sangat professional dan layak untuk menjual atau
menyewakan property seperti rumah, ruko, toko, gudang dan tanah kepada calon customer atau calon
investor anda. Keunggulan lainya dari blogger adalah bebas biaya domain dan hosting karena semuanya
sudah di sediakan secara GRATIS oleh GOOGLE dengan berbagai macam fasilitas yang mampu mengalahkan
hosting berbayar karena bandwith-nya yang unlimited, SEO friendly, USER friendly dan kapasitas
penyimpanan yang nyaris tanpa batas.
Segala penyalahgunaan ebook ini bukanlah tanggung jawab penulis dengan situs resminya yaitu www.toko-
onlineblogspot.info Ebook ini adalah ebook gratis dan tidak untuk diperjual belikan.
www.toko-onlineblogspot.info Page 1
3. www.toko-onlineblogspot.info
Langkah pertama:
Daftar di www.mail.google.com atau di www.mail.yahoo.com guna mendapatkan email.
Langkah kedua:
www.toko-onlineblogspot.info
Daftar di www.blogger.com guna mendapatkan account blogspot, sehingga dengannya
anda bisa mempunyai blog dengan penampilan setara dengan website professional
untuk menjual atau menyewakan property rumah, ruko, gudang, toko, tanah kepada
calon investor.
Klik SIGN UP dan lakukan registrasi. Setelah proses registrasi selesai maka anda akan di
bawa menuju laman berikut:
www.toko-onlineblogspot.info Page 2
4. www.toko-onlineblogspot.info
Klik “Create a Blog” untuk memulai membuat blog. Pilih “Language” >>>> English
www.toko-onlineblogspot.info
Isi “Blog title” kemudian “Blog address(URL) dan masukkan kode “Type the two words”
kemudian klik “CONTINUE”
www.toko-onlineblogspot.info Page 3
5. www.toko-onlineblogspot.info
www.toko-onlineblogspot.info
Pilih “Simple” dan jangan “Dynamic Views” karena akan sulit untuk di edit template-nya
menjadi template property. Lanjutkan dengan click “CONTINUE”
Klik “START BLOGGING”
Kemudian Copy kode di bawah ini:
[gambar disini]
<p><strong>INFORMASI DETAIL</strong></p>
<style type="text/css">.nobr br{display: none}</style>
<div class="nobr">
www.toko-onlineblogspot.info Page 4
7. www.toko-onlineblogspot.info
<td width="311">:</td>
</tr>
<tr>
<td width="200" bgcolor="#F7F7EF">Telepon</td>
<td>:</td>
</tr>
<tr>
<td width="200" bgcolor="#F7F7EF">Email</td>
<td>:</td>
</tr>
</table>
</div>
(Kode bisa di dapatkan dari “Notepad” yang saya sertakan pada saat anda mengunduh “Template” dari situs berikut ini:
http://www.toko-onlineblogspot.info/2012/01/template-iklan-property-rp200000.html
Dan masukkan ke dalam Setting >> Formatting >> Post Template
Sebelumnya, atur dulu jumlah posting yang nantinya akan muncul:
Isikan “Show at most” dengan angka “6” sehingga postingan yang tampil adalah 6 (enam) postingan
www.toko-onlineblogspot.info
sehingga Nampak rapi.
Masukkan kode yang anda dapatkan ke dalam kolom “Post Template”
Kemudian klik “SAVE SETTINGS”
www.toko-onlineblogspot.info Page 6
8. www.toko-onlineblogspot.info
Selanjutnya masuklah ke “Design” >> “Edit HTML” >> Choose File (pilih file xml yang bisa anda download di
sini http://www.toko-onlineblogspot.info/2012/01/template-iklan-property-rp200000.html ) Kemudian
setelah anda pilih, selanjutnya klik “Upload”
Taruh file “TemplatePropertyBlogger.xml” ke dalam folder yang mudah di cari. Selanjutnya setelah file anda
sorot / pilih, klik “Open”
www.toko-onlineblogspot.info
Selanjutnya klik “Upload” dan jangan lupa untuk di “Delete Widget”
www.toko-onlineblogspot.info Page 7
9. www.toko-onlineblogspot.info
Klik “DELETE WIDGETS” dan “SAVE”
Tips
Guna mempermudah SEO / terindex Google search engine sehingga website anda mudah di cari maka
jangan lupa masuk ke dalam “Settings” >>> “Basic” >>> Dan isi “Title” dan “Description” website anda
dengan kata kunci yang paling di gemari kaum netter.
www.toko-onlineblogspot.info
Langkah selanjutnya adalah posting produk:
www.toko-onlineblogspot.info Page 8
10. www.toko-onlineblogspot.info
www.toko-onlineblogspot.info
Masuk melalui menu “Posting” dan kemudian akan muncul halaman seperti tampak dalam gambar di atas.
Isikan informasi produk se detail mungkin. Yang terpenting adalah masukkan gambar rumah, ruko, gudang,
atau tanah yang akan anda jual atau sewakan.
Pilih gambar dari data dalam hardisk komputer anda.
Hasilnya:
www.toko-onlineblogspot.info Page 9
11. www.toko-onlineblogspot.info
www.toko-onlineblogspot.info
Jangan lupa isi “Title” secara lengkap seperti contoh di atas. Upload gambar, kemudian jangan lupa isi
“Lables” (lihat contoh sebagai permisalan), setidaknya memuat TIGA HAL: Rumah (jenis barang), min150
Juta (harga) dan Dijual (dijual atau disewakan/ status barang dagangan)
Selanjutnya, Isikan posting minimal 6 (enam) postingan awal.
Supaya menjadi seperti ini website dibawah ini, maka langkah-langkahnya adalah sebagai berikut:
www.toko-onlineblogspot.info Page 10
12. www.toko-onlineblogspot.info
Copy kode dibawah ini:
tomygumilar <a href="ymsgr:sendIM?ms0fii"><img style="border:none" width="64"
src="http://opi.yahoo.com/online?u=tomygumilar&m=g&t=1" height="16" /></a><br />
Phone 081334427229
Ganti “tomygumilar” dengan id yahoo messenger anda. Juga nomor telpun ganti dengan nomor anda. Dan
masukkan ke “Design” >>> “Page Elements” >>> “Customer Service”
www.toko-onlineblogspot.info
www.toko-onlineblogspot.info Page 11
13. www.toko-onlineblogspot.info
Jangan lupa “SAVE”
Selanjutnya masukkan kode dibawah ini kedalam widget “Tipe Properti” Langkahnya seperti saat
memasukkan kode “Customer Service”:
www.toko-onlineblogspot.info
<div class='widget-content list-label-widget-content'>
<ul>
<li><a href="http://jual-properti-murah.blogspot.com/search/label/Rumah">Rumah</a></li>
<li><a href="http://jual-properti-murah.blogspot.com/search/label/Tanah">Tanah</a></li>
<li><a href="http://jual-properti-murah.blogspot.com/search/label/Ruko">Ruko</a></li>
<li><a href="http://jual-properti-murah.blogspot.com/search/label/Apartemen">Apartemen</a></li>
<li><a href="http://jual-properti-murah.blogspot.com/search/label/Gudang">Gudang</a></li>
<li><a href="http://jual-properti-murah.blogspot.com/search/label/Kantor">Kantor</a></li>
</ul>
LABEL
</div>
Jangan lupa untuk mengganti “kode warna hijau” dengan kode anda sendiri menjadi:
http://jualsewarumahtanah.blogspot.com/ tambahkan /search/label/(nama label) yang
anda isikanpada saat posting (HATI-HATI JANGAN SAMPAI KELIRU huruf besar atau
kecil-nya pada saat anda posting harus sama dengan kode yang anda masukkan)
www.toko-onlineblogspot.info Page 12
14. www.toko-onlineblogspot.info
www.toko-onlineblogspot.info
Selanjutnya copy kode di bawah ini:
<form>
<select onchange="window.open(this.options[this.selectedIndex].value,'_self')" name="menu" size="1">
<option />--------- Pilih ---------
<option value="http://jual-properti-murah.blogspot.com/search/label/min150jt " />< 150 juta
<option value="http://jual-properti-murah.blogspot.com/search/label/150jt-500jt" />150 jt s/d 500 jt
<option value="http://jual-properti-murah.blogspot.com/search/label/500jt-1M" />500 jt s/d 1 M
<option value="http://jual-properti-murah.blogspot.com/search/label/1M-5M" />1 M s/d 5 M
<option value="http://jual-properti-murah.blogspot.com/search/label/5Mplus" />> 5 M
</select>
</form>
Ulangai langkah di atas.
Selanjutnya copy juga kode di atas ke dalam widget “Harga” seperti gambar dibawah ini:
www.toko-onlineblogspot.info Page 13
15. www.toko-onlineblogspot.info
www.toko-onlineblogspot.info
Terakhir copy pula kode di bawah ini :
<form>
<select onchange="window.open(this.options[this.selectedIndex].value,'_self')" name="menu" size="1">
<option />--------- Pilih ---------
<option value="http://jual-properti-murah.blogspot.com/search/label/dijual" />Dijual
<option value="http://jual-properti-murah.blogspot.com/search/label/disewakan" />Disewakan
</select>
</form>
Terakhir copy pula tersebut kedalam widget “Status” seperti gambar di bawah ini :
www.toko-onlineblogspot.info Page 14
16. www.toko-onlineblogspot.info
www.toko-onlineblogspot.info
Jangan lupa untuk selalu “SAVE” setiap edit yang anda lakukan.
Masukkan kode:
<a href="http://www.toko-onlineblogspot.info" target="_blank"><img style="border:none" width="173"
src="http://i55.tinypic.com/16ba99s.jpg" border="0" alt="MEDIA IKLAN ONLINE" vspace="3" /></a><br />
Untuk mengisi “widget” space iklan (optional) alias tidak wajib.
Menu “SERING DI LIHAT” akan muncul otomatis setelah kurang lebih 1 (satu)
minggu anda melakukan posting secara regular.
www.toko-onlineblogspot.info Page 15
17. www.toko-onlineblogspot.info
Untuk widget “SERING DILIHAT” akan muncul otomatis. Menu ini bisa anda setting melalui menu:
Design >> Page Elements >> Sering di Lihat.
www.toko-onlineblogspot.infoSELAMAT MENCOBA DAN SEMOGA SUKSES
Boleh menyebar luaskan ebook ini dengan syarat tidak boleh menghapus
identitas pengarang yaitu:
Tomy Gumilar, S.S.
Mobile Phone: 081334427229
Email: Tomygumilar.ss@gmail.com
Website: www.toko-onlineblogspot.info
www.toko-onlineblogspot.info Page 16
18. Cara Membuat Halaman Navigasi Pada Custom Template 17
Masuk ke blogger dan klik “NEW POST”
Selanjutnya klik “Edit Pages”
Kemudian klik “NEW PAGE”
Kemudian isi “Page Title” dan isi posting
melalu “Compose” setelah selesan klik
PUBLISH
www.toko-onlineblogspot.info Klik PUBLISH
Klik “No gadget” Kemudian klik “SAVE AND PUBLISH”
Klik KANAN pada ‘View Page’ kemudian
klik “Copy Link Location”
Klik “Design”
19. Masuk “Page Elements”
dan klik”Top Menu”
Masukkan link ke dalam “New Site URL”
Tulis ke dalam “New Site Name” NAMA
HALAMAN MISALNYA: CARA ORDER
Klik save
Halaman “CARA ORDER” sudah muncul
www.toko-onlineblogspot.info SELAMAT BERHASIL
Jika ada kesulitan klik http://www.toko-onlineblogspot.info dan pilih
“FORUM” atau hubungi saya di tomygumilar.ss@gmail.com atau SMS ke 081334427229
20. Cara Membuat Halaman Contact Form 19
Ketik di google
www.123contactform.c
om/contact-form-for-
blogger.html
Klik “SIGN UP”
Pilih Basic FREE klik “Sign Up”
Isi Username, Password,
Confirm password, contact
email. Hati-hati catat
username dan password
jangan sampai lupa.
www.toko-onlineblogspot.info Pilih Menu Contact Form. Klik gambar amplop surat.
Isi dalam “Form Name”
dengan nama “Hubungi Kami”
dll Klik “OK”
21. Klik “EDIT FIELD” kemudian “Preview” untuk melihat dan “Continue” jika sudah selesai melakukan
setting FORMAT. (BUTUH INTERNET KONEKSI YANG CEPAT)
Klik ‘ADD FIELD’ untuk
menambah format field. Misal
anda ingin mengetahui
website, alamat lengkap calon
customer anda dll
Isi Label dengan tulisan misalnya: Alamat Website
Label Style di pilih
Field Size isikan sesuai kehendak anda (isikan 60 jika menghendaki kotak
yang lebih lebar)
www.toko-onlineblogspot.info
Jumlah Rows dll (isikan 8 jika menghendaki ukuran kotak lebih tinggi)
Centang Options >>> Required jika anda mensyaratkan customer harus
mengisi field tersebut.
Klik tanda SILANG jika ingin menghilankan form yang tidak di kehendaki
22. Isi Show text dengan “Email anda sudah kami
terima. Terimakasih”
Centang “Send a copy of the completed form
to the sender” (OPTIONAL)
Jika menginginkan autoresponder maka
centang kolom “Send a confirmation message
to the sender”
Klik “Save”
Kemudian “Continue”
www.toko-onlineblogspot.info
Copy kode berikut (untuk memasang contact
form berbentuk “TOMBOL” atau jika
menghendaki berbentuk FORMAT MAKA
TERUSKANLANGKAH BERIKUT:
24. Masukkan Code Script ke dalam Edit Pages
>> Edit HTML
Janagn lupa isi “Page Title”
Pilih No gadget kemudian SAVE AND
PUBLISH
JANGAN LUPA KLIK KANAN “VIEW”
TERUS COPY LINK LOCATION
www.toko-onlineblogspot.info
Masuk di DESIGN >> Top Menu >> Edit
Isikan link pada “New Site URL”
dan ketik judul halaman “New Site
Name”
25. Cek penampilan blogger.
Kembali ke 123contactform dan
klik “Finished”
SELAMAT MENCOBA
DAN JANGAN LUPA KUNJUNGI
http://www.toko-onlineblogspot.info
www.toko-onlineblogspot.info
untuk mendapatkan update TUTORIAL dan update
DESIGN BLOGSPOT BARU!
26. 25
Cara Modifikasi Halaman Order
Masuk Blogger >> Posting >> Edit Pages >> New Page
Isi Page Title: Cara Beli
(contoh)
Isi Compose: Tata cara
pembelian
Klik “PUBLISH PAGE”
Isi cara pembelian produk
anda sehingga calon
www.toko-onlineblogspot.info customer tidak kebingungan
Pilih No gadget
Klik “SAVE AND PUBLISH”
27. Klik kanan “View Page” dan klik “Copy Link
Location”
www.toko-onlineblogspot.info Pindahkan ke
note pad
“ctrl+v”
Masuk “Design” >> “Page Elements” >> “Top Menu”
28. Copy “Link” dari note
pad kemudian
masukkan ke dalam
“New Site URL” dan
berilah nama pada
“New Site Name”
dengan nama yang
memudahkan
customer anda
melakukan transaksi.
Klik “SAVE”
Kembali ke “Design”
dan klik “Edit HTML”
JANGAN LUPA
www.toko-onlineblogspot.info
“Centang” Expand
Widget Templates
Cari kode ‘p/cara-
pemesanan.html’
ganti dengan ‘p/cara-
beli.html’ dari
notepad
29. Cari kode
<h2>Cara
Order</h2> dan
ganti tulisan
Kirim email………………… dengan informasi toko online anda sehingga calon customer anda tidak akan
merasa kebingungan.
JANGAN LUPA”SAVE TEMPLATE”
Kunjungi http://www.toko-onlineblogspot.info dan
dapatkan template toko online blogspot cocok untuk dagangan
www.toko-onlineblogspot.info
dalam negeri, luar negeri, produk sendiri, atau produk
affiliate Amazon, Clickbank, CJ, dan lain sebagainya
Hub: tomygumilar@yahoo.com
HP: 081334427229
30. 29
Cara Rubah Header Pada Template Custome: Toko Online Blogspot Fashion
Sebelumnya siapkan / buat header sendiri untuk menyesuaikan dengan tema toko online blogspot anda
dengan menggunakan software gratis XHeader. Klik “No Thanks” untuk mulai bekerja menggunakan
XHeader secara gratis atau beli 5000 template header harnya 47USD. Hitung sendiri berapa banyak bila
dirupiahkan!!!
Berikutnya, klik Load from template library jika anda sudah puas dengan template yang disediakan oleh
www.toko-onlineblogspot.info
XHeader. Namun, jika anda ingin membuat sendiri header anda, klik “Create a Blank Header” (cara ini
tidak saya ajarkan, namun saya yakin anda bisa coba utak athik sendiri). Banyak menu pilihan lainnya
seperti “Load an XHF FILE” dan “Load Image from Hard Disk”
31. Kemudian, akan muncul beragam pilihan template yang sudah di klasifikasan berdasarkan kategori-
kategori yang akan memudahkan anda memilih tema template berdasarkan kategori tersebut. Lihat
gambar berikut ini:
Sebagai contoh, saya mengambil kategori “Beauty” dan akan muncul seperti ini:
www.toko-onlineblogspot.info
Akan muncul beragam template header. Pilihlah yang paling mewakili tema toko online anda. Disini saya
memberikan contoh dengan memilih “Beauty3 029 jpg”
Kemudian pilih menu “Option” dan sorot “Resize Header” kemudian setting ukurannya menjadi 988 x
225 seperti gambar di bawah ini. Ingat ukuran ini besarnya berubah ubah sesuai dengan jenis template
toko online anda. Sebagai contoh, template yang di modifikasi adalah template bonus dari saya yaitu
template toko online “Fashion Blue 3 Kolom”
32. Isikan ukurannya pada field yang tersedia. 988 X 225 pixel. Selanjutnya akan muncul beberapa pilihan
kualitas header. Di dalam tutorial kali ini saya memberikan contoh kualitas “Superb”
www.toko-onlineblogspot.info
Jangan lupa untuk klik dua kali pada gambar dan simpan file ke dalam hardisk komputer. Simpan di
desktop supaya memudahkan anda mengingat letak file.
33. Tahapan selanjutnya adalah mengupload secara gratis file header ke dalam hosting. Tip dan trik saya
adalah letakkan gambar pada hosting gratis paling powerful sedunia karena aksesnya cepat dan
unlimited yaitu kedalam “new posting” www.blogger.com namun jangan di upload melainkan “simpan
sebagai draft” seperti gambar di bawah ini:
Selanjutnya klik “Original size” sehingga ukuran gambar tetap 988 X 225 pixel sebagaimana ukuran
gambar aslinya. Kemudian ambil link gambarnya seperti di bawah ini:
www.toko-onlineblogspot.info
Masuk ke Blogger >> Design >> Edit HTML >> Centang Expand Widget Templates
34. Untuk yang ukuran template “toko online fashion blue 3 kolom”
Cari Kode seperti gambar di bawah ini. Trik supaya bisa mencari dengan cepat, maka carilah dengan
cara “ctrl + f” dan masukkan header. Klik “next” hingga ketemu kode dibawah ini:
position: absolute;
z-index:-1;
top: 0;
left: 0;
width: 988px;
height: 225px;
background-image: url('http://lh4.ggpht.com/_ObmIb-
UmMEo/TcpvJ6GSp8I/AAAAAAAAAcQ/L25K5t4Sslk/Header.jpg');
background-repeat: no-repeat;
background-position: center center;
Ganti yang bercetak tebal dengan link HEADER tersebut dengan link yang barusan anda buat sehingga
menjadi:
position: absolute;
z-index:-1;
www.toko-onlineblogspot.info
top: 0;
left: 0;
width: 988px;
height: 225px;
background-image: url(‘http://2.bp.blogspot.com/-
l40fnlsUVGE/Tv2tl1tES3I/AAAAAAAAATc/aOezhYdwuBg/s1600/Header.jpg’
);
background-repeat: no-repeat;
background-position: center center;
Hasilnya yang semula:
Menjadi gambar di bawah ini:
35. Note: Usahakan tidak meletakkan gambar pada sisi kiri karena akan crash dengan “title” dan
“deskripsi” blog toko online anda. Tentunya ini sangat tidak menguntungkan anda dari segi SEO.
Tutorial di atas hanyalah ilustrasi saja.
Khusus template “toko online fashion pink 2 (dua) kolom”,
Cari Kode:
www.toko-onlineblogspot.info
div.art-Header-jpeg
{
position: absolute;
z-index:-1;
top: 0;
left: 0;
width: 788px;
height: 300px;
background-image:
url('http://img214.imageshack.us/img214/2289/headerbpn.jpg');
background-repeat: no-repeat;
background-position: center center;
}
Ganti yang bercetak tebal dengan link HEADER anda sendiri dengan ukuran 788 x 300
www.toko-onlineblogspot.info