Kamis, 03 April 2014

PHP Konversi Array Menjadi Objek/Objek Menjadi Array

1. Array ke Objek

Fungsi

function array_to_object($array) {
if(is_array($array)) {
return (object) array_map(__FUNCTION__, $array);
} else {
return $array;
}
}

Contoh Kasus

Sebelum dikonversi…

$test = array(
'A' => 'Test A',
'B' => 'Test B',
'C' => array(
'CA' => 'Test CA',
'CB' => array(
'CBA' => 'Test CBA'
)
),
'D' => 'Test D'
);

// Pemanggilan...
echo $test['A']; // Hasil => `Test A`
echo $test['C']['CB']; // Hasil => `Test CB`
echo $test['C']['CB']['CBA']; // Hasil => `Test CBA`

Sesudah dikonversi…

...

$object_test = array_to_object($test);

// Pemanggilan...
echo $object_test->A; // Hasil => `Test A`
echo $object_test->C->CB; // Hasil => `Test CB`
echo $object_test->C->CB->CBA; // Hasil => `Test CBA`

2. Objek ke Array

Fungsi

function object_to_array($object) {
if(is_object($object)) {
$object = get_object_vars($object);
}
if(is_array($object)) {
return array_map(__FUNCTION__, $object);
} else {
return $object;
}
}

Contoh Kasus

Sebelum dikonversi…

$test = new stdClass;
$test->A = 'Test A';
$test->B = 'Test B';
$test->C = new stdClass;
$test->C->CA = 'Test CA';
$test->C->CB = new stdClass;
$test->C->CB->CBA = 'Test CBA';
$test->D = 'Test D';

// Pemanggilan
echo $test->A; // Hasil => `Test A`

Sesudah dikonversi…

...

$array_test = object_to_array($test);

// Pemanggilan
echo $array_test['A']; // Hasil => `Test A`

DroidPluss Responsive Blogger Template

DroidPluss Responsive Blogger Template
DroidPluss Responsive Blogger Template


Pada kesempatan kali ini Saya mencoba berbagi Template Blogger yang cukup fenomenal di tahun 2013 kemarin bahkan sampai sekarang. Template buatan salah satu blogger ternama Indonesia yaitu Kang Ismet ini dibagikan secara gratis, walaupun gratis fitur - fitur pada template ini bisa dibilang seperti Template Premium.

Fitur Template

  1. Responsive
  2. Valid HTML5 ( Home Page and Post Page )
  3. Valid CSS3
  4. SEO Friendly
  5. Sticky Widget
  6. Back To Top
  7. Breadcrumbs
  8. Page Navigation
  9. Smooth Scroll To Comment Hash
  10. Customized Deleted Comment
  11. Costumized Error Page
  12. Cool Threaded Comment
  13. Emoticon In Comment
  14. and more.

Pengaturan Template

Untuk merubah sticky widget ( Sosial media yang melayang ) silahkan cari kode seperti dibawah ini kemudian edit.
<div id='stickywidget'>
<h3>Sosial Media</h3>
.....
.....
.....
</div>
Untuk membuat widget Artikel Terbaru, tambah widget HTML/JavaScript dan simpan kode ini pada widget Anda.
<script type="text/javascript">
function showrecentposts(json){for(var i=0;i<numposts;i++){var entry=json.feed.entry[i];var posttitle=entry.title.$t;var posturl;if(i==json.feed.entry.length)break;for(var k=0;k<entry.link.length;k++){if(entry.link[k].rel=='alternate'){posturl=entry.link[k].href;break}}posttitle=posttitle.link(posturl);if(standardstyling)document.write('<li>');document.write(posttitle)}if(standardstyling)document.write('</li>')}
</script>
<script type="text/javascript">var numposts = 5;var showpostdate = true;var showpostsummary = true;var numchars = 100;var standardstyling = true;</script><script type="text/javascript" src="http://droidpluss.blogspot.com/feeds/posts/default?orderby=published&amp;alt=json-in-script&amp;callback=showrecentposts"></script>
Silakan cari dan hapus kode dibawah ini agar blog Anda tetap Valid HTML5.
<b:include name='quickedit'/>

PHP Konversi Array Menjadi HTML List

PHP

function array_to_list($array, $list_type = 'ul') {
$output = '<' . $list_type . '>';
foreach($array as $key => $values) {
if(is_array($values)) {
$output .= '<li><a href="#">' . $key . '</a>' . array_to_list($values, $list_type) . '</li>';
} else {
$output .= '<li><a href="#' . $values . '">' . $key . '</a></li>';
}
}
return $output . '</' . $list_type . '>';
}

Penggunaan

Ubah array $test menjadi elemen HTML daftar:

// Testing...
$test = array(
'A' => 'list-A',
'B' => 'list-B',
'C' => 'list-C',
'D' => array(
'AA' => 'list-AA',
'AB' => 'list-AB',
'AC' => 'list-AC',
'AD' => array(
'ADA' => 'list-ADA',
'ADB' => 'list-ADB',
'ADC' => 'list-ADC'
),
'AE' => 'list-AE'
),
'E' => 'list-E'
);

echo array_to_list($test, 'ol');

Akan menghasilkan ini:

Cara Membuat Iklan IdBlogNetwork Valid HTML5

Logo IdBlogNetwork
Sebelumnya Saya berbagi artikel tentang Cara Mendaftar IdBlogNetwork dan Cara Memasang Iklan IdBlogNetwork. Setelah Saya lihat ternyata script iklan dari IdBlogNetwork menggunakan iframe, perlu diketahui bahwa iframe sangat tidak bagus untuk SEO. Namun, pada iframe iklan IdBlogNetwork terdapat error untuk Validasi HTML5 yaitu pada nilai dari iframe.  Untuk mengatasinya kita bisa memanfaatkan jQuery untuk mengatasinya.

Ambil Script Iklan

Silakan ambil script iklan dari IdBlogNetwork, yang belum tahu baca Cara Memasang Iklan IdBlogNetwork. Ini adalah contoh script iklan.

<iframe frameborder="0" src="http://sebar.idblognetwork.com/psg_ppc_flash.php?b=12756&sz=300x250" width="310px" height="260px" marginwidth=0 marginheight=0 ></iframe>
Selanjutnya memasang jQuery sebagai alternatif, seperti berikut ini diatas kode </body>.

<script type='text/javascript'>
//<![CDATA[
setTimeout(function() {
$(this).replaceWith('<iframe class="idblognetwork loader" src="' + $(this).data('src') + '" allowfullscreen="allowfullscreen" width="310px" height="260px" marginwidth=0 marginheight=0 ></iframe>');
});
//]]>
</script>
Kemudian tambahkan jQuery Libary dibawah ini dan simpab diatas kode </head>.

<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js' type='text/javascript'></script>
Lalu tambahkan kode dibawah ini pada widget Anda.

<div class="idblognetwork loader" data-src="URL IKLAN"></div>

Pengaturan

Silakan ganti dan sesuai pengaturannya, agar lebih mudah Saya memberikan warna yang harus diganti, ganti dengan warna yang Sama. Bila menemukan kode & pada kode iklan rubah jadi &amp; atau baca artikel Saya berjudul Cara Mengatasi Error Ampersand Pada Validasi HTML5

Tips ini aman untuk Anda gunakan, karena data klik masih berjalan normal. Oleh karena itu Anda bisa menggunakan tips ini agar blog Anda Valid HTM5 ;)

Rabu, 02 April 2014

Cara Memasang Iklan IdBlogNetwork

Logo IdBlogNetwork
Artikel ini adalah artikel lanjutan dari Cara Mendaftar IdBlogNetwork. Bagi Kalian yang sudah diterima menjadi publisher IdBlogNetwork ingin memasang iklan pada blog namun masih bingung, mungkin artikel ini dapat membantu.

Biasanya bagi blogger yang sudah diterima jadi publisher IdBlogNetwork akan diminta mengisi data diri, silakan Anda isi sesuai dengan keterangan yang ada. Yuk, langsung saja bagaimana cara memasangnya.

Pertama login ke akun IdBlogNetwork Anda tentunya, saat Anda masuk akan menemukan beberapa menu pilihan. Silakan pilih menu Script. Dalam menu terdapat beberapa pilihan iklan yang akan dipasang.
Jenis - Jenis Iklan IdBlogNetwork

Jenis - Jenis Iklan IdBlogNetwork

1. PPC Static Banner
Iklan Pay Per Click, Anda akan dibayar apabila terjadi klik yang dilakukan pengunjung blog Anda. Iklan ini berbentuk gambar.

2. PPC Flash Banner
Iklan Pay Per Click, Anda akan dibayar apabila terjadi klik yang dilakukan pengunjung blog Anda. Iklan ini berbentuk flash animasi.

3. PPA Static Banner
Iklan berupa gambar, PPA atau Pay Per Action. Anda akan dibayar , jika iklan di klik dan ada aksi. Maksudnya Anda akan dibayar apabila pengunjung meng klik dan terjadi  action/registration user pada landing page advertiser.

4. PPL
Pay Per Lead dihitung apabila transaksi pembeli.

5. Video Banner
Anda akan dibayar apabila video ditonton oleh pengunjung dari awal sampai akhir.

6. PBR/PPR
Pay Per Browse/Pay Per Read, Anda akan dibayar apabila pengunjung blog melakukan klik dan membaca artikel selama kurang lebih 60 detik atau waktu yang ditentukan.

Langkah Memasang Iklan IdBlogNetwork

1. Silakan pilih jenis iklan.
2. Kemudian pilih ukuran iklan yang akan Anda pasang pada blog Anda kemudian klik iklan tersebut.
3. Setelah di klik Anda akan mendapatkan kode iklan.
4. Selanjutnya Anda hanya perlu salin kode tersebut dan simpan pada gadget atau Anda juga bisa menyimpan iklan tersebut dimana Anda mau.

Cara Mendaftar IdBlogNetwork

Logo IdBlogNetwork
Mencari penghasilan dari aktivitas ngeblog adalah keinginan semua blogger, selain mendapat teman baru juga mendapat penghasilan, siapa yang tidak senang. Mencari penghasilan dari internet sangat banyak sekali mulai dari penulis bayaran di sebuah web/blog, menjual template, bisnis online, menjadi publisher iklan. Berdasarkan data - data tersebut yang paling banyak digemari oleh para blogger adalah menjadi publisher iklan.

Penyedia Publisher iklan sangat banyak, antara lain Google Adsense, AdsenseCamp,  Klik Saya, Infolinks, Adplus, IdBlogNetwork dan masih banyak lagi. Paling banyak digemari adalah Google Adsense. Namun, disini Saya akan fokus ke IdBlogNetwork. IdBlogNetwork adalah  salah satu penyedia iklan lokal yang paling digemari, oleh karenanya banyak blogger berkeinginan untuk menjadi publisher IdBlogNetwork.

1. Buka Situs IdBlogNetwork

Silakan Anda buka http://idblognetwork.com/?ref=register, sebelumnya pendaftaran di IdBlogNetwork dibatasi per harinya, jadi Anda perlu mendaftarkannya sekitar jam 12.00 ke sana agar kuota masih ada. Namun, kini pendaftaran di IdBlogNetwork tidak dibatasi per harinya. Silakan daftarkan blog Anda kapanpun.

2. Baca Peraturan Pendaftaran IdBlogNetwork

Agar blog Anda dapat diterima silakan baca dahulu peraturannya di http://idblognetwork.com/?ref=tos. Perlu diperhatikan bila blog Anda tidak sesuai kebijakan IdBlogNetwork, bila suatu saat Anda melanggar kebijakannya siap saja di blokir.

3. Mengisi Formulir Pendaftaran IdBlogNetwork

Setelah membaca kebijakannya, langkah selanjutnya Anda hanya tinggal mendaftarkan blog Anda. Ini adalah screenshoot formulir pendaftaran IdBlogNetwork.

Formulir Pendaftaran IdBlogNetwork
Silakan Anda isi formulir pendaftaran diatas sesuai yang keterangan yang ada. Dalam formulir pendaftaran tersebut terdapat Email Rekomendasi, ini berfungsi untuk mempercepat proses penerimaan blog. Jika Anda mempunyai email rekomendasi silakan Anda isi. Namun, jika Anda belum mempunyainya bisa menghubungi Saya pada halaman kontak http://kang-mousir.blogspot.com/p/kontak.html. Saya akan memberikan Anda email rekomendasi apabila blog Anda telah sesuai dengan kebijakan IdBlogNetwork.

Setelah Anda mengisi formulir pendaftaran, nanti akan muncul notifikasi pendaftaran seperti berikut.

Notifikasi IdBlogNetwork

4. Menunggu Penerimaan Blog

Setelah selesai melakukan pendaftaran selanjutnya Anda hanya tinggal menunggu penerimaan blog Anda. Untuk mengetahui blog Anda diterima atau tidak bisa di cek di http://idblognetwork.com/?ref=cekblog. Bila blog Anda diterima maka akan muncul data seperti gambar ini.

Notifkasi Penerimaan Blog
Setelah di cek ternyata blog Anda sudah diterima, namun belum menerima email Aktivasi Login. Untuk mendapatkan Aktivasi Login silakan Anda hubungi pihak IdBlogNetwok melalui email berikut ini admin@idblognetwork.com dan admin@idblognetwork.com, berikan bukti penerimaan blog Anda agar email Anda cepat di tanggapi.

Bagi Anda yang sudah diterima menjadi publisher IBN, silakan simak artikel berjudul Cara Memasang Iklan IdBlogNetwork.

Selasa, 01 April 2014

Range Slider Kustom Sederhana

Simplest JavaScript Custom Range Slider

Dapat digunakan sebagai alternatif JQuery UI Slider atau plugin-plugin sejenis yang memiliki ukuran berkas cukup besar. Terkadang Saya memerlukan sesuatu yang sejenis dengan itu, tetapi dengan fitur yang lebih sederhana. Asalkan bisa digunakan untuk memperbaharui nilai dengan cara menggeser-geser dragger maka itu sudah cukup. Jadi Saya membuat ini:

Dasar Penggunaan

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Test</title>
<link href="css/shell.css" rel="stylesheet">
</head>
<body>

<div id="range-slider-1"></div>

<script src="js/range-slider.js"></script>
<script>
rangeSlider(document.getElementById('range-slider-1'), {
drag: function(v) {
console.log(v + '%');
}
});
</script>
</body>
</html>

Konfigurasi

OpsiKeterangan
valueDigunakan untuk menentukan posisi dragger saat inisiasi. Nilai yang bisa diterima adalah dari angka 1 sampai 100 (berdasarkan persentase).
verticalSet sebagai true untuk membuat range slider vertikal.
rangeClassDigunakan untuk menambahkan kelas ekstra pada jalur penggeser.
draggerClassDigunakan untuk menambahkan kelas ekstra pada penggeser.
dragFungsi untuk menampilkan nilai range slider ke elemen tertentu.
var defaults = {
value: 0, // set default value on initiation from `0` to `100` (percentage based)
vertical: false, // vertical or horizontal?
rangeClass: "", // add extra custom class for the range slider track
draggerClass: "", // add extra custom class for the range slider dragger
drag: function(v) { /* console.log(v); */ } // function to return the range slider value into something
};

Lolos tes pada semua peramban mayor, termasuk Internet Explorer 8.