Sunday, April 20, 2014

Cara Membuat Iklan Bidvertiser Valid HTML5

Logo Bidvertiser

Masih fokus untuk menulis tentang Validasi HTML5. Kali ini Saya akan berbagi tips Validasi HTML5 Pada Iklan Bidvertiser. Sebelumnya Saya juga pernah membuat artikel tentang Cara Membuat Iklan IdBlogNetwork Valid HTML5 dengan mengatasi error ampersand dan yang lainnya, namun pada cara ini berbeda.

Artikel ini dibuat untuk yang sudah mempunyai akun bidvertiser, bagi yang belum punya silakan daftar dahulu dan baca artikel Saya berjudul Cara Mendaftar Menjadi Publisher Bidvertiser. Kalau Anda juga tidak punya akun juga tidak apa - apa, artikel ini bisa jadi referensi tentang ilmu Validasi HTML5.

Cara Mengatasi Error Validasi HTML5 Pada Iklan Bidvertiser

Silakan Anda salin dahulu kode iklan dari Bidvertiser, Saya beri contoh pada kode iklan dari Bidvertiser dibawah ini.

 <!-- Begin BidVertiser code -->
<SCRIPT LANGUAGE="JavaScript1.1" SRC="http://bdv.bidvertiser.com/BidVertiser.dbm?pid=592294%26bid=1479054" type="text/javascript"></SCRIPT>
<noscript><a href="http://www.bidvertiser.com">marketing</a></noscript>
<!-- End BidVertiser code -->
Untuk merubahnya agar Valid HTML5 silakan Anda rubah seperti kode dibawah ini.

<script src="http://bdv.bidvertiser.com/BidVertiser.dbm?pid=592294%26bid=1479054" type="text/javascript"></script>
Selanjutnya Anda hanya tinggal memasang kode iklan diatas pada blog Anda ;)

Cara Mendaftar Menjadi Publisher Bidvertiser

Bidvertiser bisa menjadi alternatif bagi Anda yang ingin mencari penghasilan dari blog. Salah satu Iklan PPC yang bisa dibilang lumayan besar. Menjadi publisher iklan bidvertiser Anda akan di untungkan dengan programnya.

Langsung saja bagaimana cara mendaftar menjadi publisher di bidvertiser. Silakan Anda ikuti langkah - langkah yang akan Saya berikan.

Cara Mendaftar Jadi Publisher Bidvertiser

1. Silakan Anda buka halaman ini Make money from your Website or Blog with BidVertiser. Anda akan masuk pada halaman Bidvertiser, klik Join Now untuk mendaftar.

2. Isi formulir pendaftaran sesuai dengan instruksi.

Formulir Pendaftaran Bidvertiser
First Name : Isi dengan nama depan Kamu
Last Name : Isi dengan nama belakang Kamu
Phone :  Isi dengan nomor telephone Kamu
Email Address : Isi dengan Email Anda
Choose Your User Name : Isi dengan Username yang Anda inginkan
Choose Your Password : Isi dengan Password yang Anda inginkan
Confirm Password : Tulis ulang Password yang telah Anda masukan

3. Klik Get Activation Code untuk mendapatkan activation kode. Kemudian buka email Anda dan salin activation code yang didapat dari Bidvertiser pada kolom Activation Kode.
4. Centang pilihan pertama untuk menyetujui TOS Bidvertiser, untuk yang lainnya terserah Anda.
5. Klik Continue.

Kemudian Anda akan disuruh mengisi data Website yang akan di daftarkan. Silakan Anda isi sesuai instruksi.


Formulir Pengisian Website

Bidvertiser Title : Isi dengan judul website/blog Anda
URL For Website : Isi dengan URL website yang ingin di daftarkan
3rd Party and Server / URL Forward : Ini hanya opsional, isi bila Anda punya domain yang berbeda atau kalau tidak ada lewati saja.
Primary Language : Pilih bahasa blog Anda
Select Main Catergory : Pilih kategori blog Anda.
Sub Main Category : Pilih sub kategori blog Anda.

Sampai sini pendaftaran bidvertiser sudah selesai, namun Anda belum mengisi data pembayaran yang akan di lakukan. Anda klik Select Payment Method untuk memilih mode pembayaran.

Payment Mode
Selanjutnya Anda pilih pembayaran yang diinginkan. Silakan pilih kemudian isi data sesuai instruksi lalu masukan password Anda pada kolom kemudian pilih Update.

Pilihan Metode Pembayaran Bidvertiser
Sampai sini pendaftaran untuk menjadi Publisher Bidvertiser telah selesai.

Cara Memasang Iklan Bidvertiser

Statistik Bidvertiser
Untuk memasang iklan bidvertiser pada blog silakan Anda pilih dahulu jenis template yang akan dipasang pada blog pada Choose Template. Selanjutnya pilih Get Ad Code untuk mendapatkan kode iklan. Kemudian Anda salin kode tersebut dan simpan pada gadget Anda HTML/JavaScript.

Saturday, April 19, 2014

Membuat Gambar Valid HTML5 Pada Blogger

Membuat Gambar Valid HTML5 Pada Blogger
Jika sebelumnya Saya menulis artikel tentang Breadcrumbs SEO Friendly dan Valid HTML5. Kali ini Saya berbagi tips membuat gambar Valid HTML5. Artikel ini mirip dengan artikel Saya berjudul  Memasang Tag Alt Pada Gambar.

Seperti yang kita ketahui, saat kita unggah gambar di blogger kode gambar tersebut tidak Valid HTML5 atau lebih tepatnya seperti contoh pada kode dibawah ini.

<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiSSmnuqJ1ncOy0myEefZxYhTS1PJublomvONUEEuUidP2-U7ukqRgPTZX5Ywyupco19Vh53QRcLq8ToQX2TYvSJV91iT1nLpcFVms6e8GbHO2pVCcqCzqD80yWXV3hWfojD7ZhuOsataLE/s1600/BOX+HTML5.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;">
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiSSmnuqJ1ncOy0myEefZxYhTS1PJublomvONUEEuUidP2-U7ukqRgPTZX5Ywyupco19Vh53QRcLq8ToQX2TYvSJV91iT1nLpcFVms6e8GbHO2pVCcqCzqD80yWXV3hWfojD7ZhuOsataLE/s1600/BOX+HTML5.jpg" />
</a>
</div>
Silakan Anda rubah kode diatas menjadi seperti kode dibawah ini agar Valid HTML5. Anda isi tag alt pada kode dibawah dengan nama gambar.

<div class="separator" style="clear: both; text-align: center;">
<img alt="Judul" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiSSmnuqJ1ncOy0myEefZxYhTS1PJublomvONUEEuUidP2-U7ukqRgPTZX5Ywyupco19Vh53QRcLq8ToQX2TYvSJV91iT1nLpcFVms6e8GbHO2pVCcqCzqD80yWXV3hWfojD7ZhuOsataLE/s1600/BOX+HTML5.jpg" />
</div>

Breadcrumbs SEO Friendly dan Valid HTML5

Breadcrumbs SEO Friendly dan Valid HTML5

Memasang Navigasi Breadcrumbs merupakan salah satu cara untuk optimasi SEO, dengan memasangnya akan memudahkan pengunjung dan Mesin Pencari dalam menjelajahi blog Anda. Navigasi Breadcrumbs sangat penting untuk sebuah blog, oleh karena itu Breadcrumbs ini harus SEO agar data dapat tampil pada mesin pencari.
Breadcrumbs adalah sebuah peta dimana dan di kategori apa artikel yang kita buat di publikasikan. Adanya navigasi breadcrumbs pada blog akan memudahkan pengunjung untuk menjelajahi blog Anda, dengan begitu pengunjung dapat mengetahui dimana dan pada kategori apa artikel tersebut dipublikasikan.

Pada breadcrumbs ini sudah Saya tambahkan title tag pada labelnya sehingga lebih SEO. Untuk pemasangan navigasi breadcrumbs silakan disimak baik - baik :D

Langkah Pertama

Silakan Anda simpan kode dibawah ini diatas kode ]]></b:skin> atau </style>.

.breadcrumbs{padding:10px;margin-bottom:20px;margin-top:0px;font-size:12px;color:#5B5B5B;border-bottom:1px dotted #bbb;}

Langkah Kedua

Silakan Anda cari kode dibawah ini pada template Anda.

<b:includable id='main' var='top'>
Kemudian Anda ganti dengan dengan kode dibawah ini.

<b:includable id='breadcrumb' var='posts'>
<b:if cond='data:blog.homepageUrl != data:blog.url'>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='tag' title='Beranda'>Beranda</a></span> &#187; <span><data:blog.pageName/></span></div>
<b:else/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<!-- Breadcrumb Untuk Halaman Pos -->
<b:loop values='data:posts' var='post'>
<b:if cond='data:post.labels'>
<div class='breadcrumbs'>
<span itemscope='' itemtype='http://data-vocabulary.org/Breadcrumb'><a expr:href='data:blog.homepageUrl' itemprop='url' title='Beranda'><span itemprop='title'>Beranda</span></a></span>
<b:loop values='data:post.labels' var='label'>
&#187; <span itemscope='' itemtype='http://data-vocabulary.org/Breadcrumb'><a expr:href='data:label.url' expr:title='data:label.name' itemprop='url'><span itemprop='title'><data:label.name/></span></a></span>
</b:loop>
&#187; <span><data:post.title/></span>
</div>
<b:else/>
<div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='tag' title='Beranda'>Beranda</a></span> &#187; <span>Tanpa Label</span> &#187; <span><data:post.title/></span></div>
</b:if>
</b:loop>
<b:else/>
<b:if cond='data:blog.pageType == &quot;archive&quot;'>
<!-- Breadcrumb Untuk Label Search dan Search Pages -->
<div class='breadcrumbs'>
<span><a expr:href='data:blog.homepageUrl' title='Beranda'>Beranda</a></span> &#187; <span>Arsip untuk <data:blog.pageName/></span>
</div>
<b:else/>
<b:if cond='data:blog.pageType == &quot;index&quot;'>
<div class='breadcrumbs'>
<b:if cond='data:blog.pageName == &quot;&quot;'>
<span><a expr:href='data:blog.homepageUrl' title='Beranda'>Beranda</a></span> &#187; <span>Semua posting</span>
<b:else/>
<span><a expr:href='data:blog.homepageUrl' title='Beranda'>Beranda</a></span> &#187; <span>Penelusuran <data:blog.pageName/></span>
</b:if>
</div>
</b:if>
</b:if>
</b:if>
</b:if>
</b:if>
</b:includable>
<b:includable id='main' var='top'>
<b:include data='posts' name='breadcrumb'/>
Bagi Anda yang ingin membatasi jumlah artikel pada label breadcrumbs silakan baca artikel berjudul Membatasi Jumlah Artikel Pada Label Blog.