30 Mar 2014

Selamat Hari Raya Nyepi Tahun 2014 di Lampung Tengah

Bisnis Online Banner
Kami keluarga besar Nusa Lembongan (Wayan Susandiarta) mengucapkan Selamat Hari Raya Nyepi Tahun Baru Saka 1936 yang diperingati pada tanggal 31 Maret 2014 kepada seluruh umat Hindu yang melaksanakannya Semoga di Tahun Baru Saka 1936 ini menjadi tahun yang menunjukan perubahan adanya kemenangan Dharma melawan Adharma.

Kami selalu berdoa kepada Ida Shang Hyang Widhi Wasa, kalau memang Agama Hindu ini adalah agama yang baik maka tunjukanlah Kekuasaan dan Kekuatan-Mu seperti saat Agama Hindu menjadi Agama Pertama di Dunia.

Sadarkanlah semua umat manusia yang fanatik dengan agama mereka seperti sekarang ini, karena mereka telah membedakan kami berdasarkan agama seolah-olah kami bukan manusia seperti mereka.

Bisnis Online Banner

Kami hanya ingin menjadi Agama yang dihargai di Dunia ini bukan seperti agama yang diacuhkan seperti sekarang ini. Walau negara ini disebut Demokrasi tetapi itu hanyalah sebuah sebutan karena kenyataannya kami dibedakan dari umat beragama lainnya.

Semoga bencana-bencana yang terjadi dari tahun 2013 kebelakang seperti teroris, tsunami, gunung meletus, gempa bumi, kebakaran hutan, dan pesawat terbang yang hilang menjadi tegurang bagi mereka untuk tidak fanatik dengan agama mereka.

Kami Umat Hindu akan selalu berdoa agar Ida Shang Hyang Widhi Wasa cepat menyadarkan mereka jika semakin banyaknya agama seperti sekarang ini tidak akan bisa membuat bencana dan kejatahan berkurang.

Bisnis Online Banner

Semua Larangan dan Kewajiban yang tertulis didalam Kitab Suci Agama manapun jika orang yang mempelajarinya hanya untuk niat mencari PAHALA, contohnya dikit-dikit perbuatan yang dilakukannya berdasarkan Kitab Suci dengan imbalan Pahala itu tidak akan membuat kamu masuk surga dan membuat dunia ini lepas dari kejahatan tetapi JIKA KAMU BELAJAR AGAMA DENGAN SEBELUMNYA MEMANG KAMU MEMPUNYAI HATI YANG BAIK TANPA MELIHAT LARANGAN DAN KEWAJIBAN YANG ADA DALAM KITAB SUCI PUN KAMU TAHU MANA PERBUATAN YANG BAIK DAN MANA PERBUATAN JAHAT.

Festival Ogoh-Ogoh Tahun 2014 di Lampung Tengah

Bisnis Online Banner
Festival Ogoh-Ogoh menyambut Hari Raya Nyepi Tahun Baru Saka 1935 kembali di gelar, namun bedanya tahun ini festival ogoh-ogoh tidak dilombakan. Walau demikian antusias masyarakat baik hindu dan non hindu untuk menonton ogoh-ogoh tidak diragukan lagi.
Festival Ogoh-Ogoh tanggal 29 Maret 2014 ini diadakan di Lapangan Merdeka Seputih Raman, tampak ribuan orang memenuhi lapangan untuk menyaksikan festival ogoh-ogoh ini. Meski cuaca sangat panas namun tidak menyurutkan niat masyarakat untuk tetap melihat festival ogoh-ogoh ini.

Bisnis Online Banner

Ada beberapa ogoh-ogoh yang bisa dilihat difestival ini, berkat banyaknya masyarakat yang menonton festival ogoh-ogoh ini memberikan semangat bagi pengarak ogoh-ogoh untuk menarikan ogoh-ogoh mereka masing-masing dengan diiringi alunan musik khas untuk ogoh-ogoh, Bukan hanya dari kalangan anak muda saja yang menonton festival ogoh-ogoh ini, tapi anak dan orang tua pun juga antusias sekali ingin melihat festival ogoh-ogoh yang diadakan setiap tahun ini

Bisnis Online Banner

Festival ogoh-ogoh ini juga menjadi tempat untuk mencari rejeki bagi pedagang, sebab kalau dihari biasa dagangan yang mereka jual belum tentu laku dijual, namun berkat adanya festival ogoh-ogoh ini keuntungan yang mereka peroleh jauh lebih besar. Oleh karena itu kita sebagai muda-mudi Umat Hindu khususnya yang ada di Lampung marilah kita melestarikan kebudayaan dan juga agama kita agar tidak punah di geser jaman yang semakin banyaknya budaya dan agama yang ada.

28 Mar 2014

Atribut SCOPED Dalam Tag Style

wajib baca
Aibut SCOPED Dalam Tag Style - Kadang sobat pernah mencoba untuk memvalidasikan template blog sobat akan tetapi w3 validator mengatakan anda harus menambahkan atribut scoped dalam tag style sehingga sobat menyerah karena tidak tahu cara memperbaikinya.
Sebenarnya saya pada awalnya tidak mengerti juga maksud dari atribut scoped dalam tag syle, tetapi setelah belajar dari blog sebelah akhirnya saya mengerti juga pada akhirnya. Saya akan mencoba untuk menjelaskan secara detail masalah ini, silahkan simak post berikut ini!!!

Harap diperhatikan, attribut scoped ini bisa diaplikasikan dalam kondisi apapun, tidak hanya diperlukan dalam validasi HTML5 saja.

Scoped merupakan atribut dari <style>, sebelum menjelaskan lebih jauh tentang scoped ini, pengetian scoped kurang lebih seperti ini:
Scoped attribute merupakan Boolean atribut. Apabila scoped ini digunakan, maka CSS hanya akan berlaku pada elemen tertentu saja dan keluar dari elemen utama.

Untuk lebih memahami fungsi atribut scoped ini, silahkan simak contoh di bawah ini :

Tag h4 pada template saya memiliki warna abu-abu tua atau h4 {color:#4a4a4a}, kemudian saya membuat dokumen seperti ini :

<h4>
Ini seharusnya berwarna abu-abu tua</h4>

<div>
<style scoped="" type="text/css">
h4 {color:red;}
</style>
<h4>
Tapi ini seharusnya berwarna merah</h4>
</div>
Maka hasilnya seperti ini :

Ini seharusnya berwarna abu-abu tua


Ini seharusnya berwarna merah


Warna di atas hanya akan terlihat berbeda saat dilihat di FireFox.

Apabila sobat menggunakan browser Chrome, coba buka halaman ini menggunakan FireFox, maka sobat akan melihat perbedaan warna. Perbedaan warna tersebut dikarenakan attribut scoper yang digunakan pada penulisan kode <style scoped="" type="text/css"> Atribut scoped ini hanya support di FireFox.

Attribute Scope dan Validasi HTML5


Walaupun atribut scoped ini hanya support di Firefox, dalam validasi html5 sangat diperlukan apabila CSS disimpan di widget atau postingan. Sebagaimana dijelaskan di atas, bahwa CSS berlaku untuk keseluruhan template blog. Dengan menambahkan attributscoped, maka memberitahukan kepada browser bahwa CSS hanya diperuntukan untuk area tertentu saja.

Utuk validasi HTML5, selalu gunakan attribute SCOPED pada CSS yang bersatu dengan HTML atau JavaScript pada widget.

Banyak tutorial yang menyertakan seluruh kode CSS, HTML, dan JS dalam satu kesatuan dan disimpan di widget atau postingan. Hal ini akan menyebabkan error apabila kode CSS diawali dengan <style type='text/css'> sebagai solusinya tambahkan tag scoped, untuk penulisannya menjadi :

<style type='text/css' scoped>
atau
<style type='text/css' scoped=''>
atau bisa juga seperti ini
<style type='text/css' scoped='scoped'>
dan masih ada puluhan alternatif penulisan lainnya.

Boolean Attribute


Boolean attribute diperkenalkan oleh seorang ahli Matematika dan Filsafat dari Inggris yaitu George Boole. Boole merupakan penyumbang ide dalam logika komputer. Oleh karena itu diperkenalkanlah nama Boolean Attribute.
Apa itu Boolean attribute? Secara singkat, bolean attribute adalah atribut yang apabila ditulis artinya 'true' apabila tidak ditulis, artinya 'false'. Sehingga dalam penulisan html tidak diperlukan lagi 'true' atau 'false'.

Sebagai contoh saya membuat dua ceklis ini :

Kata orang saya ganteng
Kata orang saya tidak jelek

Untuk menandai ceklis pada kotak kecil di atas, cukup dengan kode seperti ini :

<input id="opt1" type="checkbox" checked />Kata orang saya ganteng
<input id="opt1" type="checkbox" />Kata orang saya tidak jelek
Tidak diperlukan lagi kode true dan false seperti ini :
<input id="opt1" type="checkbox" checked='true' />Kata orang saya ganteng
<input id="opt2" type="checkbox" checked='false' />Kata orang saya tidak jelek
Hal tersebut dikarenakan boolean atribut sudah cukup ditulis dengan kata checked yang berarti di ceklis, apabila tidak ditulis, berarti tidak di ceklis.

Beberapa atribut boolean diantaranya : checkedcompactscopeddeclaredeferdisabledismapmultiplenoresizenoshade,nowrapreadonly dan selected.


Variasi Penulisan Boolean Attribute


Ada puluhan variasi penulisan yang diperbolehkan dalam penulisan atribut boolean ini. Misalkan saya membuat kolom isian, salah satunya saya non aktifkan :

<input type='text' name='Contoh1' disabled />
sebagai alternatif penulisan :
<input type='text' name='Contoh1' disabled="" />
<input type='text' name='Contoh2' disabled='' />
<input type='text' name='Contoh3' disabled='disabled' />
<input type='text' name='Contoh4' disabled="disabled" />
<input type='text' name='Contoh5' disabled="DISABLED" />
<input type='text' name='Contoh6' disabled="DisABleD" />
dst.. dengan pengacakan huruf

24 Mar 2014

Cara Mendaftar di Tusfiles

Bagi pengguna baru, silahkan membuat Account TusFiles Free terlebih dahulu. Caranya sebagai berikut:
  1. Klik https://www.tusfiles.net/free1585699.html
     
  2. Muncul halaman pendaftaran. Isi form yang tersedia dengan username, email, password, dan captcha lalu klik tombol Submit seperti gambar di bawah ini:


    Keterangan:
    (1) Username = Nama userlogin Anda
    (2) Email = Tuliskan alamat email Anda
    (3) Password = Masukkan password yang diinginkan
    (4) Retype Password = Tuliskan kembali password
    (5) Masukkan Huruf / Angka yang terbaca dari capctha
    (6) Klik tombol Submit
  3. Muncul tulisan Your account have been created, to activate it follow the activation link sent to your e-mail
  4. Buka email dari TusFiles.net, temukan link konfirmasinya lalu klik seperti di bawah ini:


  5. Muncul tulisan Account Confirmed




  6. Chek account Anda dengan mengklik menu My Account




  7. SELESAI. Langkah selanjutnya upgrade account TusFiles Anda

Cara Mendaftar di Adfly

Adfly merupakan salah satu situs URL shortner yang populer. Selain dapat memperpendek URL sebuah blog atau situs, Adfly juga memberikan bayaran bagi penggunanya. Bayaran tersebut diberikan ketika ada orang yang memasuki halaman sebuah blog dengan URL halaman yang sudah diperpendek menggunakan Adfly. Kita dapat menggunakan Adfly sebagai salah satu media mendapatkan uang dari internet karena praktis dan mudah digunakan meski bayarannya sangat kecil.

Kita akan mendapatkan bayaran bervariatif dari Adfly sesuai dengan lokasi negara pengunjung yang mengunjungi URL Adfly kita. Adfly memberikan bayaran tertinggi bagi pengunjung yang berasal dari Inggris, Amerika, dan Kanada. Jika kebanyakan pengunjung berasal dari Indonesia, bayaran yang akan kita terima sangat sedikit.

Pembayaran dilakukan Adfly ketika jumlah pemasukan kita sudah mencapai US$ 5 atau lebih pada bulan sebelumnya. Adfly akan melakukan pembayaran secara otomatis pada tanggal yang sudah ditentukan secara periodik melalui media rekening online seperti Paypal, Payoneer, dan Liberty Reserve.

Adapun cara untuk mendaftar Adfly adalah sebagai berikut.

Buka halaman situs Adf.ly.

Adfly

Klik join Now > masukan informasi yang diperlukan > I agree to the terms and conditions > Join.

Join Adfly

Buka email > klik link untuk verifikasi.

Konfirmasi Adfly

Log in dengan email dan password.
Mulai mendapatkan uang dengan memperpendek URL menggunakan Adfly.

Shrink Adfly

Bayaran yang akan kita terima dari Adfly akan dihitung apabila ada orang yang berkunjung ke halaman URL yang diperpendek menggunakan Adfly tersebut. Sebelum tiba pada halaman sebenarnya, orang yang telah mengklik URL Adfly akan diarahkan pada halaman iklan. Pengunjung tersebut harus menunggu selama 5 detik untuk kemudian mengklik SKIP ADS untuk melanjutkan berkunjung ke halaman sebenarnya.

Penggunaan Adfly pada blog harus diatur dengan bijak agar pembaca kita tidak merasa terganggu dengan waktu tunggu selama 5 detik sebelum dapat melewati halaman iklan untuk menuju ke halaman sebenarnya.

Agar lebih maksimal dalam mendapatkan bayaran, kita dapat menempatkan URL yang telah diperpendek menggunakan Adfly pada blog, jejaring sosial, hingga forum di Indonesia maupun manca negara. Kita juga dapat menggunakan link referral dan mengajak orang lain untuk mendaftar Adfly menggunakan link referral guna meningkatkan bayaran. Kita juga tidak boleh melakukan klik pada URL Adfly sendiri untuk mencegah pelanggaran dan penghapusan akun.

10 Mar 2014

Cara Membuat Scrollbar Dengan Persentase di Blog

Hallo Sobat pada kesempatan kali ini saya akan membagikan tutorial mengenai Cara Membuat Scrollbar Dengan Persentase.

apa sih itu ?, menjelaskannya susah liat saja scrollbar di blog ini sebagai demonya. dan tutorial ini hanya untuk memperindah tampilan blog saja.
ini dia screenshootnya :

Langsung saja ke tutorialnya yukk :
Tutorial Cara Membuat Scrollbar Dengan Persentase

saya anggap kalian sudah memasang custom scrollbar, bila belum memasang scrollbar bisa dibaca di artikel
Cara Mengganti Tampilan Scroll Bar Menjadi Keren di Blog,
1. login ke Blogger
2. masuk ke template
3. klik edit HTML
4. lalu cari kode ]]></b:skin>, gunakan ctrl+f untuk mempercepat proses pencarian, jika sudah ketemu letakan kode dibawah ini tepat di atas kode ]]></b:skin>
#scroll {
display: none;
position: fixed;
top: 0;
right: 15px;
z-index: 500;
padding: 3px 8px;
background-color: #2493C4;
font-size:13px;
color: #fff;
border-radius: 3px;
}
#scroll:after {
content: " ";
position: absolute;
top: 50%;
right: -8px;
height: 0;
width: 0;
font-size:13px;
margin-top: -4px;
border: 4px solid transparent;
border-left-color: #2493C4;
}
setelah itu, cari kode <body> atau <body
setelah ketemu,tambahkan kode ini di bawahnya <body>
<div id='scroll'></div>
selanjutnya cari lagi kode </body>, lalu letakan kode dibawah ini tepat di atas kode </body> (gunakan tombol Ctrl+F untuk mempercepat pencarian)
<script type='text/javascript'>
//<![CDATA[
var scrollTimer = null;
$(window).scroll(function() {
var viewportHeight = $(this).height(),
scrollbarHeight = viewportHeight / $(document).height() * viewportHeight,
progress = $(this).scrollTop() / ($(document).height() - viewportHeight),
distance = progress * (viewportHeight - scrollbarHeight) + scrollbarHeight / 2 - $('#scroll').height() / 2;
$('#scroll')
.css('top', distance)
.text(' (' + Math.round(progress * 100) + '%)')
.fadeIn(100);
if (scrollTimer !== null) {
clearTimeout(scrollTimer);
}
scrollTimer = setTimeout(function() {
$('#scroll').fadeOut();
}, 1500);
});
//]]>
</script>
5. yang terakhir simpan template, dan lihat hasilnya :D

Untuk Setting
untuk mengganti warna background, cari background-color: #2493C4,lalu ganti warnanya, untuk mengatur jarak Scroolba Persentase dengan Scrollbar cari kode right: 15px; lalu ganti, untuk menggantinya kode 15px ganti menjadi 10px, 20px, dan selanjutnya, dan yang terakhir untuk mengubah warna teks cari kode color: #fff; dan ganti kode warna biru muda tersebut dengan kode warna yang kalian inginkan.

Cara Membuat Menu Navigasi Floating Keren disamping Blog



Menu Navigasi Floating di Samping Kiri atau di Kanan - Sesuka hati anda saja,floating menu disamping ini memang tampak sangat keren, dan banyak disukai para Blogger, namun sulit untuk dibikin responsive, klo sobat memakai CSS responsive, floating menu navigasi ini tidak akan muncul, karena blog yang sudah memakai CSS responsive template, sudah dirancang sedemikian rupa supaya bisa cukup di layar apapun, saya dapatkan floating menu navigasi ini dari MazWaone. Oke langsung saja ke pembahasannya.

Pastikan sebelum mencoba tutorial ini, lebih baik back up dulu template sobat !, gk tau back up template ?, cari aja di google.

1. Login Blogger
2. Dashboard -> Template -> edit HTML
3. Cari kode ]]></b:skin>
4. Letakan kode dibawah ini tepat di atasnya
/* MENU NAVIGASI (FLOATING) Blog Krizeer */
.menu {text-shadow:none;position: fixed;height: 100%;width: 65px;background: #2c3e50;transition:width 1s;overflow: hidden;font-family: 'Offside', sans-serif;z-index: 99;left:0;top:0}
.menu:hover {width: 220px;}
.menuItem span {position: absolute;left:80px;top:20px;transition:color 1s;color:rgba(255,255,255,0);}
.menu:hover .menuItem  span {color:rgba(255,255,255,1);}
.menuItem {color:#fff;position: relative;padding: 20px;transition:border .5s, background .2s;}
.menuItem a {color:#fff;}
.menuItem:hover {background: #34495e;cursor: pointer;}
.satu {border-left:5px solid #16a085;}
.satu:hover{border-left:20px solid #16a085;}
.dua {border-left:5px solid #2980b9;}
.dua:hover {border-left:20px solid #2980b9;}
.tiga {border-left:5px solid #8e44ad;}
.tiga:hover {border-left:20px solid #8e44ad;}
.empat {border-left:5px solid #e67e22;}
.empat:hover {border-left:20px solid #e67e22;}
.lima {border-left:5px solid #e74c3c;}
.lima:hover {border-left:20px solid #e74c3c;}
5. Selanjutnya cari kode </body>, dan letakan kode dibawah ini tepat di atasnya.
<div class="menu">
<div class="menuItem satu">1<span><a href="http://yoga-tc.blogspot.com/">Aku</a></span></div>
<div class="menuItem dua">2<span><a href="http://yoga-tc.blogspot.com/">Suka</a></span></div>
<div class="menuItem tiga">3<span><a href="http://yoga-tc.blogspot.com/">Sama</a></span></div>
<div class="menuItem empat">4<span><a href="http://yoga-tc.blogspot.com/">Kamu</a></span></div>
<div class="menuItem lima">5<span><a href="http://yoga-tc.blogspot.com/">Problem ?</a></span></div>
</div>
6. Klik Pratinjau terlebih dahulu sebelum disimpan/save, Jika tidak terdapat error klik save/simpan.

Cara Membuat Sidebar Akordion dengan jQuery



Cara Membuat Sidebar Akordion dengan JQuery di Blog | Sidebar akordion memang sangat menarik untuk di pasang di blogger, keunikannya widget-widgetnya yang muncul hanya 1, maksudnya widget paling atas muncul pertama kali saat blog di buka, widget yang ke 2 ke 3 ke 4 dan seterusnya, disembunyikan, maksudnya yang muncul hanya judul-judulnya saja, jika kurang jelas lihat gambar di bawah ini.
Sebelum mencoba artikel ini ada baiknya template sobat di back up dulu, untuk memasang sidebar akordion sobat harus mengenal ID sidebar dan ID sidebar h2 masing-masing, untuk lebih jelasnya lihatlah gambar dibawah ini :

ID #sidebar :


ID #sidebar h2 ( judul widget di sidebar ) :


Langkah-Langkah Membuat Sidebar Akordion :
  • Pertama-tama masuklah ke halaman editor HTML template Anda, lalu temukan kode </head> (kode javascript ini dengan ID #sidebar-wrapper :
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js' type='text/javascript'></script>
<script type='text/javascript'>
//<![CDATA[
$(function() {
    // Sembunyikan semua tubuh widget (tutup semua panel)
    $('#sidebar-wrapper .widget-content').hide();
    // Tambahkan class 'active' pada elemen <h2> pertama
    // kemudian tampilkan elemen berikutnya dengan efek .slideDown(), sehingga panel akordion paling atas akan tampak terbuka
    $('#sidebar-wrapper h2:first').addClass('active').next().slideDown('slow');
    // Saat elemen <h2> yang berada di dalam elemen #sidebar-wrapper diklik...
    $('#sidebar-wrapper h2').click(function() {
        if($(this).next().is(':hidden')) {
            // Sembunyikan semua panel yang terbuka dengan efek .slideUp()
            $('#sidebar-wrapper h2').removeClass('active').next().slideUp('slow');
            // Lalu buka panel yang berada di bawah elemen ini (elemen <h2> yang diklik) dengan efek .slideDown()
            $(this).toggleClass('active').next().slideDown('slow');
        }
    });
});
//]]>
</script>
Demo : http://dte-dummy.blogspot.com/

Jika mau bisa dibuka lalu ditutup lagi pakai kode ini :
<!-- Sidebar Akordion dengan JQuery dari Blog Krizeer (www.yoga-tc.blogspot.com) -->
<script type='text/javascript'>
//<![CDATA[
// sidebar
$(function(){$('#sidebar-wrapper .widget-content').hide();$('#sidebar-wrapper h2:first').addClass('active').next().slideDown('slow');$('#sidebar-wrapper h2').css('cursor','pointer').click(function(){$('#sidebar-wrapper h2').removeClass('active').next().slideUp('slow');if($(this).next().is(':hidden')){$(this).addClass('active').next().slideDown('slow')}else{$(this).removeClass('active').next().slideUp('slow')}})});
//]]>
</script>
Demo : http://demo-anak-layangan.blogspot.com/

Jika di template sobat sudah memasang jQuery, jangan copy kode di atas, karena satu template hanya memasang satu jQuery, jika lebih beberapa widget tidak akan berfungsi.

Tidak berhasil?
Oke, mungkin Anda mempunyai sidebar dengan ID yang berbeda. Coba periksa kembali template Anda dan temukan baris kode yang menggambarkan deretan widget sidebar blog Anda. Kurang lebih tampilannya seperti ini:
<div id='sidebar-wrapper-2'>
    <b:section class='sidebar' id='sidebar' preferred='yes'>
        <b:widget id='Label1' locked='false' title='Kategori' type='Label'/>
        <b:widget id='PopularPosts1' locked='false' title='Entri Populer' type='PopularPosts'/>
        <b:widget id='Stats1' locked='false' title='Statistik' type='Stats'/>
        <b:widget id='HTML2' locked='false' title='Komunitas' type='HTML'/>
        <b:widget id='HTML4' locked='false' title='Facebook Suka' type='HTML'/>
    </b:section>
</div>
Atau seperti ini dengan memakai ID #sidebar
 <div id='sidebar'>
    <b:section class='sidebar' id='sidebar' preferred='yes'>
        <b:widget id='Label1' locked='false' title='Kategori' type='Label'/>
        <b:widget id='PopularPosts1' locked='false' title='Entri Populer' type='PopularPosts'/>
        <b:widget id='Stats1' locked='false' title='Statistik' type='Stats'/>
        <b:widget id='HTML2' locked='false' title='Komunitas' type='HTML'/>
        <b:widget id='HTML4' locked='false' title='Facebook Suka' type='HTML'/>
    </b:section>
</div>
Saya rasa artikel ini sudah cukup jelas, jika ada yang mau ditanyakan, silahkan