Thứ Bảy, 12 tháng 1, 2013

Kelemahan Ngeblog Pakai Blogspot

Artikel kali ini hanya iseng aja, tapi bisa juga dibilang serius karena bisa menjadi salah satu pertimbangan teman-teman pengguna platform Blogger sebagai sarana aktivitas ngeblog. Jaman dahulu kala, ada dua orang sahabat karib Maskolis dan Helmi terlihat mereka lagi duduk-duduk di teras rumah sambil ngobrol ringan. Helmi kelihatan kesal terlihat dari mukanya yang ditekuk, usut punya usut ternyata dia lagi kesal karena perilaku Google yang dengan sepihak menghapus blog yang dikelolanya setelah hampir bertahan selama 1 abad lebih dikit. Dia kesal seperti seorang pesakitan yang divonis bersalah oleh hakim tanpa bisa mengajukan banding ke pengadilan yang lebih tinggi, dan permintaan grasi pun sepertinya juga sudah ditutup rapat-rapat karena sang presiden sibuk dengan segala keprihatinannya.

Setelah merenung di pinggir kali sambil jongkok, Maskolis berpendapat begini, bahwa platform Blogger sebenarnya tidak layak untuk dijadikan sarana berekspresi secara bebas. Banyak keterbatasan yang dimiliki Blogger sehingga seorang yang ahli dalam bidang IT khususnya bahasa pemrograman situs atau web, sangat mustahil memakai Blogger sebagai sarana untuk mengembangkan bakat dan keahliannya, ya ada beberapa sih yang nekat pakai Blogger, tapi biasanya mungkin karena keterbatasan ekonomi seperti yang nulis artikel ini. Ini pendapat subyektif penulis, silahkan setuju atau setuju sekali, alternatif pilihannya cuma itu.

Tulisan ini nanti arahnya bakal kemana-mana, nggak fokus pada topik yang dibahas, jadi harap maklum soalnya yang nulis agak kenthir, tapi nggak gila, buktinya masih bisa nulis artikel ini. Semoga yang baca betah, kalau nggak betah langsung aja kasih komentar kentut ini : nice posting Gan, ditunggu artikel selanjutnya, atau artikel yang menarik, ditunggu komen baliknya ya...!!!. Oke kita lanjutkan, sampai dimana tadi? Lihat gambar orang cantik pasti lebih semangat......

dian sastro
Sumber gambar : http://indonesiarayanews.com


Pengguna blogspot atau dikenal juga sebagai blogger mayoritas berasal dari beberapa negara berkembang di dunia, jika dilihat prosentase pengguna blogspot, 70% dari negara-negara yang secara ekonomi masih belum mapan termasuk negara kita yang tercinta ini tentunya. Seorang pengguna blogspot ibarat seperti anak kost, cuma bedanya blogger gratis.. eh nggak juga, paling tidak kita mesti beli komputer atau minimal barang elektronik yang bisa buat nulis elektrik seperti HP atau Ipad, juga kalau kita ngeblog di warnet mesti bayar sewa, kecuali penjaga warnet. Seorang anak kost akan memperoleh fasilitas kamar dan tempat tidur dari yang punya rumah, jelek atau bagus sebuah fasilitas tergantung berapa biaya sewa yang mesti dikeluarkan. Meskipun udah begitu, ruang lingkupnya tetep aja terbatas, misalnya untuk ngambil air di kulkas aja kadang ada yang harus minta ijin dulu, kita nggak boleh masuk ruang-ruang tertentu di rumah itu atau yang paling parah kalau rumah kost yang kamar mandi dan WC buat bareng-bareng sama yang lain... wuihhh ngeri-ngeri sedap, kata Sutan Bhatoegana.

"Lha terus apa hubungannya dengan seorang blogger?" tanya Helmi ke Maskolis.
"Nggak ada hubungannya sih, emang siapa yang bilang ada hubungannya?" jawab Maskolis.
"Lha itu alinea diatas, seorang blogger ibarat seperti anak kost! Berarti kan ada hubungannya?" tanya Helmi kesal.
"Makanya sabar dulu, ini juga lagi mikir, hubungannya kira-kira apa ya..?" jawab Maskolis sambil minum jamu tambah ganteng.

Jagi begini, seorang pengguna blogspot juga sama seperti anak kost, diberikan fasilitas yang mendukung kegiatan dalam rangka menyampaikan informasi secara online. Semuanya sudah tersedia gratis, kita tinggal pencet tombol ini dan itu semuanya beres. Tapi aktivitas itu dibatasi, Google sebagai induk semang dari rumah kost blogspot membuat beberapa peraturan yang harus dipatuhi oleh penggunanya. Pengguna Blogspot diperbolehkan memodifikasi kamar yang dia tempati dengan beberapa kondisi yang sudah ditentukan oleh aturan-aturan yang tidak bisa diganggu gugat.

Silahkan Anda sebagai blogger membuat kamar atau ruangan Anda seperti yang diinginkan, silahkan isi space-space kosong yang ada dalam kamar dengan barang-barang yang Anda perlukan. Tapi resiko ditanggung penumpang, iya maksudnya batasan-batasan ideal yang dibakukan oleh si induk semang sudah jelas, aturan baku yang dibuat semua pasti demi kemudahan dan kelangsungan hidup si pengguna. Seorang anak kost bisa saja menambahkan perabotan, seperti kulkas, TV, komputer atau lainnya dengan konsekuensi kamarnya menjadi semakin sempit dan sumpek, yang pasti sewa kamarnya juga bertambah karena penggunaan listrik yang lebih dan tentunya tanpa merusak atau menjebol ruang-ruang lain di kamarnya karena akan mengganggu anak kost lainnya.

Demikian juga pengguna blogger diperbolehkan menambah kode-kode yang diperlukan untuk menjadikan blognya menjadi lebih atraktif dengan catatan Anda tidak diperbolehkan mengurangi atau menambahkan beberapa kode fixed bawaan dari platform tersebut karena akan berakibat rusaknya struktur rumah blogger. Blog Anda memang akan keliatan lebih menarik tapi konsekuensinya blog Anda semakin lamban yang mungkin akan mengakibatkan Anda akan kehilangan beberapa persen dari sekian banyak pengunjung loyal karena tidak sabar untuk masuk ke ruangan Anda.

Seorang anak kost juga dipersilahkan mengajak teman masuk ke kamar tapi dengan batasan, tidak boleh terlalu malam atau terlalu sering bagi temen yang beda gender, atau menggunakan kamar sebagai sarana mencari penghasilan tambahan yang berlebihan, karena hal ini akan merugikan dan merusak citra rumah kost itu sendiri di mata tetangga lainnya. Google pun juga nggak bakalan mau kalau salah satu rumahnya dijadikan sebagai sarana ajang afiliasi program dengan situs atau web afiliasi lainnya. Program afiliasi hanya akan merugikan Google, karena dalam itung-itungan bisnis hal itu mematikan Google sebagai induk semang. Secara, Google juga punya program afiliasi sendiri  untuk mengeruk keuntungan dari pengguna internet.

Dari beberapa contoh kasus diatas jika ada yang dilanggar oleh penggunanya, akibat paling buruk adalah Anda akan diusir dari rumah kost, Anda bisa saja melakukan operasi plastik dengan membuat akun baru di blogger, tapi tanpa merubah perilaku blogging Anda, hal yang sama akan terjadi lagi di masa yang akan datang, dan itu akan berlanjut sampai Anda sadar bahwa kita tidak akan pernah bisa bertindak bebas selama fasilitas pendukung yang kita miliki belum sepenuhnya atas nama pribadi.

Penjelasan dangkal yang penuh dengan unsur subyektifitas dari Maskolis, belum bisa sepenuhnya diterima oleh Helmi. Maskolis melanjutkan argumennya lagi, coba sekarang bayangkan jika Anda punya rumah sendiri? Helmi membayangkan jika dia punya rumah sendiri, tentunya dia pasti akan bebas seperti seekor burung yang terbang di pagi hari. Mau dipakai buat apapun, itu rumah-rumah dia, bebas bereksprsi intinya tanpa harus takut diusir oleh pemiliknya.

Dengan semakin berkembangnya teknologi di bidang IT, tentunya hal ini akan berdampak pada teknologi terapan yang ada pada sebuah situs atau web. Sistem pengkodean misalnya, sekarang banyak sekali temuan baru pada kode-kode script untuk menjalankan sebuah fitur modern. Semuanya serba baru, mulai dari kode CSS, HTML maupun Javascript, dan lagi temuan kode-kode pembentuk fitur modern itu bisa dijalankan untuk semua CMS pembuat website termasuk Blogger sendiri. Bagi blog non blogger hal itu tidaklah menjadi masalah, karena tinggal diatur berapa kapasitas hosting yang mesti diperlukan untuk membentuk semua fitur modern tersebut, lha bagaimana dengan Blogger?

Melihat Helmi malahan tertidur, akhirnya Maskolis melanjutkan penjelasanya minggu depan.
Bersambung.... semoga tidak bermanfaat

Paling banyak dibaca orang kenthir : 
  1. Cara Membuat Blog Yang Menarik 
  2. Bagaimana Cara Memilih Nama Blog Yang Baik? 
  3. Bagaimana Agar Template Anda SEO Friendly? 
  4. Mengapa Komentar Tidak Harus Dibalas

Thứ Năm, 10 tháng 1, 2013

Inilah Template Toko Online Jelek Banget

Kemarin ada yang minta template Johny Sip Deh tapi tampilan warnanya ungu, yah akhirnya meskipun ungu salah satu warna yang saya tidak begitu suka karena dekat dengan pink kesannya feminim, saya kan laki jadi warnanya mesti macho. Saya mau cerita sebentar sebelum lanjut ke template yang mau saya bagikan, sebenarnya saya kalau nulis artikel pakai bahasa baku begini agak susah mesti mikir dua kali, penginnya sih nulis bahasa gaul. Misalnya tidak, nulisnya nggak, nanti jadi entar dan lain-lain, tapi nanti kalau yang datang orang luar mau translate ke bahasa mereka jadi kacau tidak bisa diterjemahkan.

Lanjut, template yang saya bagikan kali ini hanya modifikasi dari template sebelumnya. Setelah kemarin saya membagikan Johny Sip Deh template untuk blog toko online, karena ada beberapa pemakai template dari kaum Hawa yang mungkin agak kurang sreg dengan tampilan warnanya yang hitam seperti pantat penggorengan, apalagi kalau yang dijual adalah baju atau perlengkapan rumah tangga yang sifatnya Girly pasti kurang cocok. Saya akan berikan alternatif warna lain, ada dua jenis warna untuk template kali ini, yaitu Hijau dan Ungu (ungu apa pink ya?).

Template toko online kali ini saya kasih nama Johny Palelu Peang, nama itu saya ambil karena waktu hujan kemarin atap rumah bocor dan dengan sigap saya langsung membetulkan letak genteng yang melorot, tapi apa mau dikata, karena licin saya terpeleset dan terjatuh yang berakibat kepala saya agak peang dikit. Fiturnya sama dengan Johny Sip Deh, dengan tampilan slider yang berbeda dan tambahan fitur kategori produk di bawah postingan. Untuk lebih jelasnya silahkan perhatikan screenschot gambar di bawah ini :

blogger online store


blogger online store


Posting Artikel

Untuk membuat sebuah postingan, perhatikan struktur kode di bawah ini :
<div class="product_image">
<a class="cloud-zoom" href="url-image.jpg" rel="softFocus: true, position:'inside', smoothMove:2"><img border="0" class="item_thumb" src="url-image.jpg" /></a>
<span class="item_price">$00.00</span></div>
<div class="product_describe">
Description your product.............
</div>
Keterangan :
Warna merah : masukkan url gambar produk anda pada kedua kode warna merah diatas.
Warna kuning : harga produk
Warna biru : deskripsi dari produk

Kode diatas adalah kode yang harus anda awali dalam membuat postingan terbaru, dan untuk memudahkan agar Anda tidak berulang kali copy paste kode tersebut sewaktu membuat artikel terbaru, masukkan kode tersebut pada kolom post template. Masuk ke setting, pilih posts and comments >> post template. Klik add, setelah itu masukkan kode diatas pada kotak kosong seperti gambar dibawah, terakhir save setting.

Slider

Slider pada template ini menampilkan postingan terbaru, untuk mengaktifkan slider, masuk ke Layout kemudian pilih kolom kosong diatas Bawah Slider. Masukkan kode ini di dalamnya :
<div id='slider'>
<div id='loopedSlider'>
<div class='container'>
<script>
document.write("<script src=\"/feeds/posts/default?max-results="+numposts+"&orderby=published&alt=json-in-script&callback=showrecentposts\"><\/script>");
</script>
</div>
<a class='previous' href='#'></a>
<a class='next' href='#'></a>
<ul class='pagination'>
<script>
document.write("<script src=\"/feeds/posts/default?max-results="+numposts+"&orderby=published&alt=json-in-script&callback=showrecentposts0\"><\/script>");
</script>
</ul>
<script type='text/javascript'>
$(function(){
$('#loopedSlider').loopedSlider();
});
</script>
</div>
</div>

Setting Template

Untuk merubah setelan transaksi online pada template ini, cari kode berikut ini pada Edit HTML :
simpleCart.email = &#39;ncmajid@gmail.com&#39;;
simpleCart.checkoutTo = Email;
simpleCart.currency = IDR;
simpleCart.urlWebsite = &#39;http://johnysip-deh.blogspot.com&#39;;
simpleCart.taxRate  = 0.02;
simpleCart.shippingFlatRate = 3.25;
simpleCart.shippingQuantityRate = 1.00;
simpleCart.alamatPemilik = &#39;Alamat Anda &#39;;
simpleCart.noHP = &#39;081 xxxx xxxx&#39;;
simpleCart.urlFacebook = &#39;http://www.facebook.com/pages/your facebook&#39;;
simpleCart.urlTwitter = &#39;https://twitter.com/your twitter&#39;;
simpleCart.akunbank1 = &#39;Bank A&#39;;
simpleCart.norek1 = &#39;No Rekening&#39;;
simpleCart.namarek1 = &#39;Nama Pemilik Rekening Bank A&#39;;
simpleCart.akunbank2 = &#39;Bank B&#39;;
simpleCart.norek2 = &#39;No Rekening&#39;;
simpleCart.namarek2 = &#39;Nama Pemilik Rekening Bank B&#39;;
simpleCart.akunbank3 = &#39;Bank C&#39;;
simpleCart.norek3 = &#39;No Rekening&#39;;
simpleCart.namarek3 = &#39;Nama Pemilik Rekening Bank C&#39;;
simpleCart.akunbank4 = &#39;Bank D&#39;;
simpleCart.norek4 = &#39;No Rekening&#39;;
simpleCart.namarek4 = &#39;Nama Pemilik Rekening Bank D&#39;;
simpleCart.akunbank5 = &#39;Bank E&#39;;
simpleCart.norek5 = &#39;No Rekening&#39;;
simpleCart.namarek5 = &#39;Nama Pemilik Rekening Bank D&#39;;
simpleCart.akunbank6 = &#39;Bank F&#39;;
simpleCart.norek6 = &#39;No Rekening&#39;;
simpleCart.namarek6 = &#39;Nama Pemilik Rekening Bank D&#39;;
simpleCart.urlReferrer = &#39;http://www.maskolis.com&#39;;
simpleCart.businessName = &#39;Nama Toko Online Anda&#39;;
simpleCart.formatsmsKonfirmasi= &#39;(Nama, Email, Jumlah transfer, Bank Tujuan Transfer, Tanggal transfer)&#39;;
simpleCart.contohformatsmsKonfirmasi= &#39;Maskolis, email.maskolis@gmail.com, Rp 1.500.000, BCA, 12 Desember 2012 &#39;;
simpleCart.catatanTambahanInvoice= &#39;(Have a nice day for you and I hope you enjoy it)&#39;;
simpleCart.cartHeaders = [&quot;Name&quot;, &quot;thumb_image&quot; , &quot;Quantity_input&quot; ,   &quot;Total&quot;, &quot;remove&quot; ];

Ganti kode warna biru diatas dengan data Anda dan blog Anda.

Fungsi Reply Komentar

Untuk mengaktifkan fungsi reply pada kotak komentar pada kedua template ini cari Blog ID masing-masing demo template ini. Untuk Johny Palelu Peang : 2047062320562941851 dan Johny Pink Store : 5422099799591763959. Silahkan cari kode blog ID itu di Edit HTML pada template demo, kemudian ganti dengan Blog ID Anda masing-masing. Dan terakhir untuk widget popular post, centang hanya thumbnail, kotak snippet biarkan kosong.

Oya hampir lupa, untuk mengisi widget Bawah Slider dan Product Category tinggal ketik label pada kolom widget tersebut.

Kedua template ini tersedia untuk dua pilihan sistem pembayaran online, yang satu menggunakan invoice email seperti yang terlihat pada demo, dan menggunakan pembayaran melalui Paypal (demonya nggak ada karena kebanyakan bikin blog nanti). Buat yang kemarin request template Toko Online warna ungu silahkan dipakai, kalau nggak cocok yah nggak apa-apa buat koleksi aja, buat bungkus kacang juga boleh, buat dijelek-jelekin juga boleh, buat diomelin juga boleh.... ngomong apa sih????

Silahkan tinggalkan pesan jika masih ada yang mau ditanyakan, atau baca tata cara komentar dulu disini sebelum mengisi kotak komentar yang tersedia.

Penting untuk diperhatikan bagi pengguna kedua template diatas :
  1. Buatlah sebuah page atau halaman statis dengan judul : Terima Kasih
  2. Isi terserah Anda, contoh bisa dilihat disini http://johnysip-deh.blogspot.com/p/terima-kasih.html
  3. Halaman ini digunakan untuk redirect URL setelah selesai pengisian formulir pemesanan.
  4. Download Template Toko Online Dengan Invoice Email 

Thứ Bảy, 5 tháng 1, 2013

4 hot girl Việt xinh đẹp và sexy nhất 2012


Đều là những hot girl nổi tiếng, đều theo đuổi một lĩnh vực nghệ thuật nhất định, 4 hot girl xinh đẹp: Nu Phạm, Hà Kim, Lilly Luta và Mai Thỏ đều là những gương mặt hot teen sexy nhất năm 2012.
1. Hà Kim
Hà Kim tên thật là Nguyễn Thu Hà, sinh năm 1994 và hiện đang là học sinh lớp 12, trường PTTH Nguyễn Trãi (Hà Nội). Cô gái xinh đẹp từng có mặt trong top 20 chung kết Miss Teen 2011.  
Read more »

Modifikasi 3 Template Valid HTML5

Pertama saya akan jelaskan dulu apa itu HTML5 dan kenapa kita harus memakai HTML versi terbaru? HTML sendiri adalah singkatan dari Hyper Text Markup Language. HTML bukanlah termasuk bahasa pemrograman, karena struktur yang dimilikinya dianggap terlalu sederhana, kode-kode yang dibaca oleh browser baris per baris, dari atas ke bawah. HTML juga tidak mempunyai struktur pemrograman yang umum ada pada sebuah bahasa pemrograman standar. HTML hanyalah kumpulan dari beberapa instruksi yang dapat dipakai untuk merubah format suatu naskah atau dokumen.

Saat ini HTML telah menjadi standar yang banyak digunakan secara luas untuk menampilkan halaman web atau situs. HTML juga bisa diartikan sebagai kumpulan simbol-simbol atau tag-tag yang dituliskan dalam sebuah file yang dimaksudkan untuk menampilkan halaman pada web browser. Oleh karena itu, untuk dapat membuka dokumen yang ditulis dalam format HTML maka kita perlu sebuah tool yaitu berupa browser seperti Opera, Mozilla, Google Chrome, Internet Explorer dan lain-lain.

Tentang HTML5 dan Fungsinya

Dengan semakin berkembangnya teknologi saat ini, format HTML pun dituntut mampu memberikan informasi yang akurat untuk setiap dokumen yang dibaca. W3C atau Word Wide Web Consortium sebagai pengembang XHTML 2.0 dan WHATWG sepakat untuk bekerja sama membuat HTML versi terbaru, yaitu HTML5. Pengembangan format HTML menjadi HTML5 bertujuan untuk memperbaiki teknologi HTML agar dapat mendukung teknologi multimedia terbaru. Selain itu HTML5 dapat mengurangi penggunaan plugin-plugin third party pada HTML sehingga dapat mempercepat kinerja sebuah web atau situs. Plugin-plugin tersebut misalnya Microsoft Silverlight, Adobe Flash, Java dan sebagainya.

Bagi pengembangan website atau blog, format HTML5 juga memberikan beberapa kemudahan, misalnya pada bagian awal file HTML sebelumnya kita harus menulis coding DOCTYPE yang panjang, seperti ini :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
 Pada HTML5, DOCTYPE dapat ditulis lebih ringkas
<!DOCTYPE html> 
Kemudian pada baris berikutnya HTML lama biasanya seperti ini
<html expr:dir='data:blog.languageDirection' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'> 
Versi HTML5 bisa lebih simple menjadi
<html expr:dir='data:blog.languageDirection'> 

Validitas HTML sebuah Blog

Sekarang kita menuju ke validasi HTML, validitas sebuah situs atau web bukanlah merupakan suatu keharusan. Awalnya saya bingung, kenapa sih blog mesti valid struktur HTML nya? Kenyataan memang dari beberapa situs besar, bahkan Google sendiri mempunyai sekian puluh error dalam halamannya. Tetapi mempunyai Page Rank tinggi, lalu kenapa kita harus memikirkan Validasi HTML? Apakah Validasi HTML yang biasa ditest melalui validator W3C itu berpengaruh pada Search Engine Google?

Silahkan cari sendiri alasannya di internet ya, soalnya sampai saat ini masih terjadi pro kontra, apakah validitas sebuah blog perlu atau tidak. Kalau saya sih perlu, coba sekarang silahkan cek di Google Analytics, ada bermacam-macam jenis browser yang telah mengakses blog anda. Disitu Anda akan kehilangan beberapa persen pembaca yang kesulitan melihat blog anda dari browser mereka. Maka validasi HTML akan menjamin tampilan blog akan sama di semua browser. Melalui validasi html, semua browser, bahkan yang paling tua sekalipun akan bisa membaca dokumen blog yang Anda kelola dengan mudah

Wah artikel ini bakalan panjang, saya cut sampai disini penjelasan tentang HTML5 dan validasi HTML. Bagi yang masih percaya kalau validitas HTML sebuah blog sangat berpengaruh pada artikel kita di mata SERPs atau SEO, yah silahkan dibuat se-minimal mungkin error margin pada kode HTML Anda. Bagi yang tidak begitu peduli dengan validitas ya silahkan saja, tidak apa-apa. Sebagai kesimpulan, adalah sebuah gagasan yang bagus untuk memiliki validasi HTML pada situs Anda untuk memeriksa kesalahan dan membersihkan coding yang tidak perlu. Dan bagi Anda yang ingin mencoba keberuntungan apakah blog yang Anda kelola Valid HTML atau tidak, silahkan menuju link dibawah ini :


Modifikasi Template Tipe Magazine Valid HTML5

Setelah nulis muter-muter tidak ada ujung pangkalnya, sekarang saya akan bagikan kepada Anda disini, 3 buah template lama dari Creating Website yang tadinya masih memakai format HTML lama, saya ganti menjadi HTML5 dan yang pasti validitasnya bisa dicek nanti. Bentuk dan model template ini sama persis dengan yang sudah saya bagikan tidak ada yang berubah, tapi codingnya yang berbeda, silahkan langsung saja :

Johny Sompret Banget

banget




Johny Kena Banned

johny kena banned




Johny Sompret

johny sompret




Ketiga template diatas, sudah saya modifikasi sehingga valid secara HTML5. Bukan jaminan 100% jika Anda memakai ketiga template diatas, blog Anda juga akan mempunyai validasi HTML, semuanya tergantung pengguna. Paling tidak saya sudah membuang kode-kode error yang ada pada template-template diatas, Anda tinggal menyesuaikan jika ada penambahan kode di Edit HTML maupun pada widget. Silahkan dicoba bagi yang tertarik dan semoga bermanfaat.

Chủ Nhật, 30 tháng 12, 2012

Download Template Toko Online Dengan Invoice Email

Template-template toko online blogger dengan fasilitas shopping cart ini awalnya saya buat dengan metode pembayaran via Paypal. Karena pembayaran lewat Paypal sampai saat ini hanya support untuk mata uang tertentu, terutama top currency (Dollar, Euro dan Pounds) sehingga bagi pengguna template yang memasang harga produknya dengan mata uang lokal sebagai alat transaksi, fitur cart menjadi tidak berfungsi dan kesannya hanya sebagai pemanis blog saja.

Nah, agar fitur shopping cart disini masih bisa berfungsi bukan hanya sebagai pemanis blog, saya sudah modifikasi template-template tersebut dengan merubah menjadi sistem pemberitahuan lewat email atau bahasa kerennya invoice email. Untuk lebih jelasnya, silahkan baca artikel saya sebelumnya 2 Template Toko Online Modifikasi dengan Invoice Email. Dan silahkan klik blog demo dibawah, klik add to cart salah satu produk yang ada di blog demo, lalu klik Order Email yang ada pada keranjang belanja (shopping cart).


Jika Anda tertarik, dibawah ini template-template toko online yang sudah saya modifikasi dengan fasilitas invoice email (tapi demonya masih menggunakan Paypal), keempat template ini khusus untuk mata uang Rupiah (Rp)  :

toko online blogger



toko online blogger



toko online blogger



toko online blogger


Jika Anda pemakai salah satu template diatas, dan sudah memodifikasi template tersebut, sehingga jika download ulang akan merubah warna dan semua susunan widget dan yang lain. Anda tinggal download template yang dipakai diatas, kemudian cari kode yang saya tambahkan pada template tersebut, copy-kan ke template Anda. Demikian artikel singkat kali ini, selamat mencoba dan semoga bermanfaat.

Penting untuk diperhatikan bagi pengguna template-template diatas :
  1. Buatlah sebuah page atau halaman statis dengan judul : Terima Kasih
  2. Isi terserah Anda, contoh bisa dilihat disini http://johnysip-deh.blogspot.com/p/terima-kasih.html
  3. Halaman ini digunakan untuk redirect URL setelah selesai pengisian formulir pemesanan.
  4. 2 Template Toko Online Modifikasi dengan Invoice Email Terbaru

2 Template Toko Online Modifikasi dengan Invoice Email

Dari beberapa template Toko Online dengan shopping cart yang saya bagikan sebelumnya, banyak kendala yang dihadapi, khususnya bagi mereka yang menggunakan mata uang non top currency (dollar, Euro dan Pounds). Khusus untuk kali ini, saya akan membagikan 2 buah template Toko Online Cart dengan menggunakan fasilitas Invoice Email. Singkatnya begini, jika ada pesanan lewat fitur shopping cart Anda akan menerima langsung lewat email tanpa harus membuat form order, dan pesanan pembeli sesuai dengan produk yang di order lewat fitur shopping cart. Kelebihan lain adalah seorang pemesan pun juga akan menerima email dari barang yang dibelinya.

Untuk kali ini, saya memodifikasi 2 buah template yang pernah saya bagikan sebelumnya, yaitu Johny Blackstore dan Johny Magstore khusus untuk mata uang Rupiah (Rp). Oke langsung saja ya

Johny Sip Deh

Template ini persis sama dengan Johny Blackstore, hanya beda warnanya saja dan tambahan fitur related post di bawah postingan. Untuk tutorial cara membuat postingan dan pemasangan widget yang ada pada template ini, silahkan dibuka artikel Johny Blackstore, Template Toko Online Asal Jadi

toko online blogger


Simpan semua file javascript pada template ini pada Google Code sendiri, download filenya :


Saya akan menjelaskan cara kerja shopping cart dengan menggunakan fitur email invoice secara sistematis disini. Sebagai contoh kasus, saya memesan barang lewat cart pada demo template diatas seperti gambar berikut ini :

toko online blogger

Setelah klik "Order Email",  si pemesan diharuskan untuk mengisi formulir yang muncul seperti pop up berikut ini :

toko online blogger

Kemudian klik OK button, setelah itu si pemesan akan diarahkan untuk mengisi email, nama, alamat, nomer telepon yang bisa dihubungi. Setelah semuanya diisi, pemesan akan mendapatkan notifikasi email seperti gambar berikut ini :

toko online blogger

Perhatikan produk-produk yang dipesan, sama dengan barang yang dipesan lewat shopping cart. Dan si pemilik toko online, dalam hal ini sebagai penjual pasti juga akan menerima notifikasi email dari pembeli atau pemesan produk seperti gambar berikut ini :

toko online blogger

Setelah proses diatas,  pemesan dan penjual tinggal melakukan finalisasi proses transaksi melalui data-data yang sudah tercantum dalam email yang dikirim.

Setting Template

Untuk merubah setelan transaksi online pada template ini, cari kode berikut ini pada Edit HTML :
simpleCart.email = &#39;ncmajid@gmail.com&#39;;
simpleCart.checkoutTo = Email;
simpleCart.currency = IDR;
simpleCart.urlWebsite = &#39;http://johnysip-deh.blogspot.com&#39;;
simpleCart.taxRate  = 0.02;
simpleCart.shippingFlatRate = 3.25;
simpleCart.shippingQuantityRate = 1.00;
simpleCart.alamatPemilik = &#39;Alamat Anda &#39;;
simpleCart.noHP = &#39;081 xxxx xxxx&#39;;
simpleCart.urlFacebook = &#39;http://www.facebook.com/pages/your facebook&#39;;
simpleCart.urlTwitter = &#39;https://twitter.com/your twitter&#39;;
simpleCart.akunbank1 = &#39;Bank A&#39;;
simpleCart.norek1 = &#39;No Rekening&#39;;
simpleCart.namarek1 = &#39;Nama Pemilik Rekening Bank A&#39;;
simpleCart.akunbank2 = &#39;Bank B&#39;;
simpleCart.norek2 = &#39;No Rekening&#39;;
simpleCart.namarek2 = &#39;Nama Pemilik Rekening Bank B&#39;;
simpleCart.akunbank3 = &#39;Bank C&#39;;
simpleCart.norek3 = &#39;No Rekening&#39;;
simpleCart.namarek3 = &#39;Nama Pemilik Rekening Bank C&#39;;
simpleCart.akunbank4 = &#39;Bank D&#39;;
simpleCart.norek4 = &#39;No Rekening&#39;;
simpleCart.namarek4 = &#39;Nama Pemilik Rekening Bank D&#39;;
simpleCart.akunbank5 = &#39;Bank E&#39;;
simpleCart.norek5 = &#39;No Rekening&#39;;
simpleCart.namarek5 = &#39;Nama Pemilik Rekening Bank D&#39;;
simpleCart.akunbank6 = &#39;Bank F&#39;;
simpleCart.norek6 = &#39;No Rekening&#39;;
simpleCart.namarek6 = &#39;Nama Pemilik Rekening Bank D&#39;;
simpleCart.urlReferrer = &#39;http://www.maskolis.com&#39;;
simpleCart.businessName = &#39;Nama Toko Online Anda&#39;;
simpleCart.formatsmsKonfirmasi= &#39;(Nama, Email, Jumlah transfer, Bank Tujuan Transfer, Tanggal transfer)&#39;;
simpleCart.contohformatsmsKonfirmasi= &#39;Maskolis, email.maskolis@gmail.com, Rp 1.500.000, BCA, 12 Desember 2012 &#39;;
simpleCart.catatanTambahanInvoice= &#39;(Have a nice day for you and I hope you enjoy it)&#39;;
simpleCart.cartHeaders = [&quot;Name&quot;, &quot;thumb_image&quot; , &quot;Quantity_input&quot; ,   &quot;Total&quot;, &quot;remove&quot; ];

Kode warna biru diatas yang harus Anda ganti, sesuaikan dengan kebutuhan data Anda sehingga konsumen lebih percaya untuk membeli produk dari toko online yang Anda kelola.

Dan jika Anda ingin setting pembayaran dengan Paypal tinggal merubah kode berikut :
simpleCart.checkoutTo = Email;
simpleCart.currency = IDR;
Ganti email dengan Paypal dan rubah IDR dengan mata uang top currency yang Anda inginkan. Hapus data pada kode diatas yang tidak diperlukan.

Untuk mengaktifkan fungsi reply komantar pada template ini, ganti Blog ID pada template ini pada Edit HTML (jangan lupa centang expand widget template) : 4486072018930286729 setelah ketemu ganti dengan blog ID anda

Johny Muantab

Template ini modifikasi dari Johny Magstore, bedanya template ini menggunakan satu sidebar di sebelah kiri. Cara membuat postingan dan memasang widget sama persis dengan Johny Magstore template, untuk itu silahkan jika Anda ingin menggunakan template ini dibuka kembali artikel Johny Magstore, Template Magazine untuk Toko Online.

toko online blogger


Simpan semua file javascript pada template ini pada Google Code sendiri, download filenya :


Template ini sama dengan template Johny Sip Deh, menggunakan invoice email payment method (sistem pembayaran lewat email). 

Setting Template

Cari kode di bawah ini pada Edit HTML, untuk mengoptimalkan data mengenai toko online yang Anda kelola :
simpleCart.email = 'ncmajid@gmail.com';
simpleCart.checkoutTo = Email;
simpleCart.currency = IDR;
simpleCart.urlWebsite = 'http://johny-mantuab.blogspot.com';
simpleCart.alamatPemilik = 'Alamat Anda ';
simpleCart.noHP = '081 xxxx xxxx';
simpleCart.urlFacebook = 'http://www.facebook.com/pages/your facebook';
simpleCart.urlTwitter = 'https://twitter.com/your twitter';
simpleCart.akunbank1 = 'Bank A';
simpleCart.norek1 = 'No Rekening Bank A';
simpleCart.namarek1 = 'Nama Pemilik Rekening Bank A';
simpleCart.akunbank2 = 'Bank B';
simpleCart.norek2 = 'No Rekening Bank B';
simpleCart.namarek2 = 'Nama Pemilik Rekening Bank B';
simpleCart.akunbank3 = 'Bank C';
simpleCart.norek3 = 'No Rekening Bank C';
simpleCart.namarek3 = 'Nama Pemilik Rekening Bank C';
simpleCart.akunbank4 = 'Bank D';
simpleCart.norek4 = 'No Rekening Bank  D';
simpleCart.namarek4 = 'Nama Pemilik Rekening Bank D';
simpleCart.akunbank5 = 'Bank E';
simpleCart.norek5 = 'No Rekening Bank E';
simpleCart.namarek5 = 'Nama Pemilik Rekening Bank D';
simpleCart.akunbank6 = 'Bank F';
simpleCart.norek6 = 'No Rekening Bank F';
simpleCart.namarek6 = 'Nama Pemilik Rekening Bank D';
simpleCart.urlReferrer = 'http://www.maskolis.com';
simpleCart.businessName = 'Nama Toko Online Anda';
simpleCart.formatsmsKonfirmasi= '(Nama, Email, Jumlah transfer, Bank Tujuan Transfer, Tanggal transfer)';
simpleCart.contohformatsmsKonfirmasi= 'Maskolis, email.maskolis@gmail.com, Rp 1.500.000, BCA, 12 Desember 2012 ';
simpleCart.catatanTambahanInvoice= '(Have a nice day for you and I hope you enjoy it)';
simpleCart.cartHeaders = ['name','thumb_image','Quantity_input','increment',  'decrement','Total'];
Ganti kode warna biru diatas dengan data Anda.

Kekurangan dari sistem pembayaran dengan invoice email ini, Anda harus mempunyai hosting sendiri untuk menyimpan script email invoice yang berupa file PHP. Karena blogger belum support PHP dan tidak ada hosting gratis khusus untuk menyimpan file PHP. Untuk kedua template ini saya menggunakan hosting dari blog dimana saya berperan sebagai admin disitu. Jika Anda ingin mengganti atau merubah kalimat dan bahasa yang ada di email invoice, syarat utama anda harus mempunyai file PHP invoice email dan hosting untuk menyimpannya.

Awalnya saya ragu untuk membagikan kedua template ini, karena jika hosting yang saya pakai untuk menyimpan file PHP ini tidak diperpanjang bisa-bisa fitur invoice email yang saya pasang pada template itu tidak lagi berfungsi. Mengingat masih banyak pembuat toko online blogger berbayar yang menekuni bidang ini sebagai sumber mata pencaharian, tidak etis rasanya jika saya membuka semua rahasia pembuatan toko online blogger dengan invoice email payment method ini. Jadi silahkan Anda membuat sendiri file PHP dengan menggunakan dreamweaver, atau masuk ke situs http://stackoverflow.com disana banyak sekali dasar-dasar untuk membuat sebuah file PHP untuk email invoice.

Demikian tadi dua template toko online dengan model pembayaran lewat invoice email, jika ada yang ingin ditanyakan silahkan tulis pesan Anda di kotak komentar. Selamat mencoba dan selamat menikmati Tahun Baru 2013 bagi yang merayakan.... semoga bermanfaat.

Penting untuk diperhatikan bagi pengguna kedua template diatas :
  1. Buatlah sebuah page atau halaman statis dengan judul : Terima Kasih
  2. Isi terserah Anda, contoh bisa dilihat disini http://johnysip-deh.blogspot.com/p/terima-kasih.html
  3. Halaman ini digunakan untuk redirect URL setelah selesai pengisian formulir pemesanan.
  4. Download Template Toko Online Dengan Invoice Email 

Thứ Ba, 25 tháng 12, 2012

Membuat Menu Accordion Tanpa Edit HTML

Kali ini saya akan memberikan tutorial membuat menu accordion yang saya pasang pada template Johny Simple Magazine 2 dan Johny Magazine 2 tanpa harus masuk ke Edit HTML. Awalnya kedua template tersebut menggunakan simple accordion dari dezinerfolio, belakangan ini tidak berfungsi. Sampai sekarang saya tidak tahu kenapa, padahal semua javascriptnya sudah saya ganti dengan yang baru. Akhirnya saya menemukan accordion menu yang lebih sederhana, tidak perlu masuk ke Edit HTML, tinggal masuk ke layout kemudian pilih HTML/Javascript, letakkan kodenya disitu....  sudah jadi menu accordionnya.

menu accordion

Salah satu fungsi dari accordion menu selain memperingkas tampilan blog, juga dapat memperindah blog, seperti juga fungsi tabber atau tab view, jadi blog Anda akan kelihatan lebih ringkas dan rapi. Tutorial ini sudah agak lama, saya hanya memperbaharui tampilan menunya saja. Anda bisa letakkan menu accordion ini pada sidebar blog. Bagi teman-teman yang mau mencoba, berikut ini cara membuatnya (wah bahasanya jadul banget ya) :
  1. Login ke Blogger dengan akun Anda
  2. Masuk ke Layout, pilih HTML/Javascript
  3. Kemudian masukkan kode berikut ini ke dalamnya (kek bikin masakan aja) :
    <style type="text/css">
    #accordion{width:100%;margin:auto;border:0px solid white}
    #accordion h2{padding:5px 10px;background-color:#ccc;background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhMRGIvoa3AkOgxAVP_3aRV0OPUoqnsa_CVv9BlAXnfRbbcAkpk798XvPKX-HywT8deLlz7VujrTu7IRXUbOKvpZoY5DVV3y3YBX0PH-64yk8i7OcBAuNYd_bLAyYbuIf-QGn5Ri1Abxno/s1600/arrow_right.gif);background-repeat: no-repeat;background-position: right center;color:#000;font:normal 11px Tahoma;border-bottom:1px solid #FFF;cursor:pointer;}
    #accordion .content{font:normal 11px Arial;padding:5px 10px;background:#eee;}
    #accordion .content ul {list-style:none;margin:0 0 0;padding:0 0 0;}
    #accordion .content li {background-image: url(); background-repeat: no-repeat;background-position: left center;margin:0;padding:2px 0 3px 0;text-indent:0px;border-bottom:1px dotted #ccc;line-height:1.3em;}
    #accordion .content li a:hover {text-decoration:none;color:#000;}
    #accordion h2.active{background-color:#bbb;background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiaRxddTUIR9ILYgm97w4_KvyyI9yFTuarNKDiuccsZl3Q9DbAUbsZQROQ0dD6aylh2y6OiCEzCqDev1sC0RKrgRcdT4hPa-6qAcYyLxnh_qmgP0FFYuY0PCbYU3kbYLhp3IXef8d1CjSA/s1600/arrow_down.gif);background-repeat: no-repeat;background-position: right center;font-weight:bold;}
    </style>
    <script type="text/javascript" src="http://yourjavascript.com/121511228073/accordion-menu.js"></script>
    <script type='text/javascript'>
    $(function() {
    $('#accordion .content').hide();
    $('#accordion h2:first').addClass('active').next().slideDown('slow');
    $('#accordion h2').click(function() {
    if($(this).next().is(':hidden')) {
    $('#accordion h2').removeClass('active').next().slideUp('slow');
    $(this).toggleClass('active').next().slideDown('slow');
    }
    });
    });
    </script>
    <div id="accordion">
    <h2>Title 1</h2>
    <div class="content">
    Isi konten 1
    </div>
    <div id="accordion">
    <h2>Title 2</h2>
    <div class="content">
    Isi konten 2
    </div>
    <div id="accordion">
    <h2>Title 3</h2>
    <div class="content">
    Isi konten 3
    </div>
    <div id="accordion">
    <h2>Title 4</h2>
    <div class="content">
    Isi konten 4
    </div>
    <div id="accordion">
    <h2>Title 5</h2>
    <div class="content">
    Isi konten 5
    </div>
    </div></div></div></div></div>
  4. Terakhir Save, lihat hasilnya


Keterangan :
  • Title : Judul heading menu accordion 
  • Isi konten : Silahkan Anda isi dengan widget yang akan dipasang (bisa tulisan, script iklan maupun script widget)
Menu accordion diatas untuk blog yang mempunyai background warna terang. Bagi Anda yang mempunyai blog warna gelap atau hitam, tinggal diganti kode css-nya,. Lebih lengkapnya seperti kode di bawah ini :
<style type="text/css">
#accordion{width:100%;margin:auto;border:0px solid white} #accordion h2{background-color:#5f5e5e;background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg88gWwxUS7wqGnMJ3qXv2kHZWeAbr5rM2xDZbkdx6YwgqJrRoQsCJwWDOTTuHlxaCRO03Hc9RjjPyFKLATzu2Z2Lzn7Eoh7LIur1NF9L2gJnv8MjYmgasXgoJw4Acxcqr1ve8rhIolzHc/s1600/arrow_right.gif);background-repeat:no-repeat;background-position:right center;color:#d0cfce;font:normal 11px Tahoma;border-bottom:1px solid #323333;cursor:pointer;padding:5px 10px} #accordion .content{font:normal 11px Arial;background:#333;padding:5px 10px} #accordion .content li{background-image:url();background-repeat:no-repeat;background-position:left center;text-indent:0;border-bottom:1px dotted #595959;line-height:1.3em;margin:0;padding:2px 0 3px} #accordion .content li a:hover{text-decoration:none;color:#ff3c00} #accordion h2.active{background:#5f5e5e;background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhDjisd7zhXMK3gqUdMMXBdK99mDSxQUzUOqiK2XsJEPsgBn0fIebJK5pYH_X8zXEnBWs15FhztOMH532DOsaqciERhsR0seLETXDJFPhMy_xpF7LO-iElpFphn9dJprc489YeIHGhtigM/s1600/arrow_down.gif);background-repeat:no-repeat;background-position:right center;font-weight:700} </style>
<script type="text/javascript" src="http://yourjavascript.com/121511228073/accordion-menu.js"></script>
<script type='text/javascript'>
$(function() {
$('#accordion .content').hide();
$('#accordion h2:first').addClass('active').next().slideDown('slow');
$('#accordion h2').click(function() {
if($(this).next().is(':hidden')) {
$('#accordion h2').removeClass('active').next().slideUp('slow');
$(this).toggleClass('active').next().slideDown('slow');
}
});
});
</script>
<div id="accordion">
<h2>Title 1</h2>
<div class="content">
Isi konten 1
</div>
<div id="accordion">
<h2>Title 2</h2>
<div class="content">
Isi konten 2
</div>
<div id="accordion">
<h2>Title 3</h2>
<div class="content">
Isi konten 3
</div>
<div id="accordion">
<h2>Title 4</h2>
<div class="content">
Isi konten 4
</div>
<div id="accordion">
<h2>Title 5</h2>
<div class="content">
Isi konten 5
</div>
</div></div></div></div></div>


Bagi yang ingin menyimpan javascript menu accordion silahkan download link dibawah :


Demikian tutorial singkat membuat menu accordion kali ini, dan bagi Anda yang menggunakan kedua template Johny Simple Magazine 2 dan Johny Magazine 2 dapat mengupdate menu accordion-nya dengan tutorial ini.

Pengumuman :
Bagi yang masih mengalami masalah dengan blog, karena ada permintaan password dan username pada blog yang dipakai, mending download ulang aja ya. Semua template sudah saya perbaiki kecuali 3 template pertama saya, yaitu Johny Simplesite, Johny Portal 1, dan Johny Magazine (lupa password emailnya, jadi nggak bisa diperbaiki).

Labels

Adult English affiliate Ảnh ẢNH FACEBOOK ẢNH HÀI ẢNH HOA ĐẸP ẢNH LÃNG MẠN ẢNH NGƯỜI MẪU ÁO DÀI Art + Design ẨM THỰC bag Bé tô màu BIKINI BLOGGER books Búp bê C CAPTCHA Cắm hoa Cắt may Chơi mà học CHUYỆN CỦA SAO Chuyện Lạ clip hot Coloring - Tô màu CUỘC SỐNG Doll domain DU LỊCH Đ Đan len Đất nặn cho bé Điện thoại - Tablet E Funny G GAME Gấp giấy Gấp hộp Gấp khăn - Trang trí món ăn Giầy - Dép Gifts Giới Tính GIỚI TRẺ NGÀY NAY Gói quà - gấp nơ Google GOOGLE ADSENSE FULL guest post H Hand made hat hiteach HOA HẬU HỌC TẬP home and garden hosting HOT GIRL INTERNET INTERNET PAYMENT Iseng joomla jQuery Kết hạt KHỎE & ĐẸP KIẾM TIỀN Kinh Nghiệm L LÀM ĐẸP Làm đồ chơi làm đồ chơi từ gỗ Làm hoa giấy Làm hoa vải Làm thiệp LƯU BÚT HỌC TRÒ M Magazine making flowers Mẫu móc MẸO HAY MMO MODEL N Nail art Nến trang trí Nghệ thuật NGƯỜI ĐẸP VÀ XE Nhà đẹp O Origrami Ôtô - xe máy P Painting - Vẽ Patchwork PHẦN MỀM Play and learn for baby plugin Q R recycling S Sách tiếng anh cho bé Sành điệu Sao SAO NGOẠI SAO ONLINE SAO VIỆT SEO SEO FULL slider STYLE T TÂM SỰ template Tết dây THẾ GIỚI NGƯỜI MẪU THẾ GIỚI THỨ 3 THỂ THAO Thêu THƠ TÌNH THỦ THUẬT THÚ VUI Thư giãn TIỂU THUYẾT TÌNH CẢM TIN HOT Tin Vip tips Tóc đẹp traffic TRANG ĐIỂM Trang trí Tri thức TRUYỆN NGẮN truyện quê Túi xinh tutorial blog VĂN PHÒNG vuivui808 weaving website WEDDING wordpress