T-One Community

Cara Pasang MP3 Player Di Blog Menggunakan MixPod

Melanjutkan postingan artikel Cara Pasang MP3 Player Di Blog, kali ini dilanjutkan dengan tambahan menggunakan playlist yang daftar list lagunya bisa disesuaikan dengan keinginan sobat blogger. Widget MP3 Player dalam postingan artikel kali ini menggunakan layanan MixPod untuk membuat playlist dan MP3 Online Player. Layanan musik di MixPod ini gratis dan mudah untuk di kostumasi termasuk isi dari playlist dan skin MP3 Player. Oke... moz's blogger kita lanjutkan ke TKP...

Kunjungi situs Mixpod. Jika belum punya akun di MixPod silakan sobat daftar dulu kemudian login ke MixPod.
Apabila sudah login klik "Create Playlist" yang ada di atas.
Masukan kata kunci pada box pencarian kemudian apabila hasil pencarian sudah ditampilkan selanjutnya klik tombol "+" setelah itu jika sudah selesai silakan klik "Save Playlist" untuk menyimpan daftar playlist.
Klik "SAVE" untuk mendapatkan kode script.
Copy kode HTML yang ditampilkan pada kotak Embed Code.
Login ke akun blog sobat.
Klik Design >>> Page Elements >>> Add Gadget.
Paste kode HTML MixPod pada kotak gadget.
Klik "Save" dan lihat hasilnya...

.: Semoga Bermanfaat :.

Membuat Kotak Iklan Dengan Efek Mantul

Banyak cara menuju roma... banyak cara pula menampilkan adsense atau iklan dari sponsor blog sobat dengan cara yang unik dan menarik, salah satunya yaitu dengan cara membuat efek pantul pada saat blog ditampilkan. Cara ini bisa membantu meningkatkan jumlah klik adsense sehingga otomatis penghasilan blog dari adsense juga bertambah.

Preview : Demo Postingan

Perhatian : Sebelum mencoba trik ini ada baiknya terlebih dahulu membackup template sobat untuk menghidari hal-hal yang tidak diinginkan !!!...

Cara Pemasangan :

Klik "Design" kemudian klik "Edit HTML" setelah itu klik centang pada "Expand Widget Templates", seperti gambar dibawah ini.

Cari kode </Head> pada template blog (tekan tombol keyboard CTRL+F untuk menampilkan kotak pencarian di browser dan mempercepat pencarian) kemudian copy kode di bawah ini dan paste di atas kode </Head> tersebut.

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'></script>
<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.5/jquery-ui.min.js'></script>
    <script type='text/javascript'>
    $(window).bind("load", function() {
    // animasikan nilai top saat halaman telah selesai dimuat
    $('#kotak-pesan').animate({top:"190px"}, 1000, "easeOutBounce");
    // hilangkan kotak pesan saat tombol (x) diklik
    $('a.close').click(function() {
    $(this).parent().slideUp(800, "easeOutBounce");
    return false;
    });
    });
    </script>
    <style>
    #kotak-pesan{
    position:fixed !important;
    position:absolute; /* IE6 */
    top:-900px;
    left:50%;
    margin:0px 0px 0px -182px;
    width:250px;
    height:250px;
    padding:10px;
    background:#FFB200;
    border:2px solid #fff;
    font:normal 1em Cambria,Georgia,Serif;
    color:#111;
    -webkit-box-shadow:0px 1px 3px rgba(0,0,0,0.4);
    -moz-box-shadow:0px 1px 3px rgba(0,0,0,0.4);
    box-shadow:0px 1px 3px rgba(0,0,0,0.4);
    }
    #kotak-pesan a.close{
    position:absolute;
    top:-10px;
    right:-10px;
    background:#FFB200;
    font:bold 16px Arial,Sans-Serif;
    text-decoration:none;
    line-height:22px;
    width:22px;
    text-align:center;
    color:#fff;
    border:2px solid #fff;
    -webkit-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
    -moz-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
    box-shadow:0px 1px 2px rgba(0,0,0,0.4);
    -webkit-border-radius:22px;
    -moz-border-radius:22px;
    border-radius:22px;
    cursor:pointer;
    }
    </style>

Cari kode <Body> pada template blog (tekan tombol keyboard CTRL+F untuk menampilkan kotak pencarian di browser dan mempercepat pencarian) kemudian copy kode di bawah ini dan paste di bawah kode <Body> tersebut.

   <div id='kotak-pesan'>
    DISINI KONTEN ADA,

    Bisa Iklan,

    Dan Lain Lain

    Sesuai yang sobat inginkan
    <a class='close' href='#'>×</a>
    </div>

|  Blog Tools

- Keterangan :
- Kode yang berwarna merah merupakan kode script jquery jika sobat sudah menggunakan kode script jquery kode ini jangan pasang lagi.
- Kode yang berwarna biru merupakan settingan ukuran lebar, tinggi dan warna background. Silakan sesuaikan dengan keinginan sobat.
- Teks yang berwarna ungu merupakan tempat untuk menaruh kode script iklan.

Klik "Save" dan lihat hasilnya...

.: Semoga Bermanfaat :.

Widget Flying TinkerBell

Masih ingat dengan film Peterpan dengan peri ajaib si Tinkerbell ??? ok dech kalo masih ingat... nahh... kreasi widget blog kali ini menggunakan efek animasi flying image tinkerbell, seru-kan ??? untuk contoh seperti yang terlihat pada postingan artikel ini. Widget flying tinkerbell menggunakan javascript flying image yang sudah saya modifikasi sendiri. Oke...sob saya udah kehabisan kata-kata nich... mending kita langsung ke TKP aja yaa...

Cara Pemasangan :

Klik "Design" kemudian klik "Edit HTML" setelah itu klik centang pada "Expand Widget Templates", seperti gambar dibawah ini.

Cari kode </Head> pada template blog (tekan tombol keyboard CTRL+F untuk menampilkan kotak pencarian di browser dan mempercepat pencarian) kemudian copy kode di bawah ini dan paste di atas kode </Head> tersebut.

<script language="javascript">
var floatURLimage="http://i1254.photobucket.com/albums/hh606/MonozCore/th_Flying_Tinkerbell.gif";
</script>
<script language="javascript" src="http://monozcore-project.googlecode.com/files/MozFlyingImage.js"></script>

| Blog Tools

- Keterangan :
- not available.

Klik "Save" dan lihat hasilnya...

.: Semoga Bermanfaat :.

Widget Naga Terbang Di Blog #2

Setelah postingan artikel Widget Naga Hitam Terbang Di Blog, kali ini saya membuat postingan artikel Widget Naga Terbang Di Blog #2. Dijamin makin unik dan atraktif walaupun pada prinsipnya sih sama.

Beragam cara untuk meningkatkan popularitas blog, mulai dari seo, optimalisasi template, konten dan widget serta membuat tampilan blog yang menawan. Hal ini menjadi suatu kewajiban buat para blogger yang ingin blognya menjadi top of blog di kalangan blogger. Dari semua strategi yang digunakan terkadang sobat blogger sering melupakan 2 hal yang tak kalah pentingnya yaitu keseimbangan dan originalitas.

Keseimbangan berarti kesabaran dan keseriusan dalam mengolah dan mengelola blog, sehingga dapat memberikan info yang bermutu dan bermanfaat. Originalitas berarti keaslian info yang dibagikan harus bisa secara jujur dipertanggung jawabkan dan tidak melanggar etika penggunaan informasi yang diperoleh.

Oke... sob kita lanjutkan ke topik pembicaraan. Pada postingan kali ini saya akan membagikan info tentang mengoptimalkan tampilan blog yang salah satunya dengan menggunakan widget naga terbang di blog #2. Kali ini animasi naga banyak pilihannya, sobat blogger tinggal pilih dari opsi gambar naga yang ada. Monggo dipilih dulu gambarnya kemudian tinggal dipasang scriptnya...

Cara Pemasangan :

Klik "Design" kemudian klik "Edit HTML" setelah itu klik centang pada "Expand Widget Templates", seperti gambar dibawah ini.

Cari kode </Body> pada template blog (tekan tombol keyboard CTRL+F untuk menampilkan kotak pencarian di browser dan mempercepat pencarian) kemudian copy kode di bawah ini dan paste di atas kode </Body> tersebut.

<script language="javascript">
var floatURLimage="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgYEkG0SX8oEUOzKdmbQjUOkQ1gakZvZFca-eCF6DskApH7qNmbAWVqjcXN0k5m3zL4hCxXR1bne1Aq-zgCKISphpTLBu_9E0SqBMSb-5uf_UqhxJ1HvEtQL3ksJEz67o-xADBlZ-TAHyhL/s800/Flying-Rainbow-Dragon-Animated-Image.gif";
</script>
<script language="javascript" src="http://monozcore-project.googlecode.com/files/DragonScript.js"></script>

| Blog Tools

- Keterangan :
- Kode yang berwarna biru merupakan URL Link Gambar, silakan pilih gambar naga yang sobat suka pada pilihan gambar naga yang ada di bawah kemudian tinggal ganti kode script di atas yang berwarna biru.

Klik "Save" dan lihat hasilnya...

Pilihan Gambar Naga :

Rainbow Dragon

Image Link :
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgYEkG0SX8oEUOzKdmbQjUOkQ1gakZvZFca-eCF6DskApH7qNmbAWVqjcXN0k5m3zL4hCxXR1bne1Aq-zgCKISphpTLBu_9E0SqBMSb-5uf_UqhxJ1HvEtQL3ksJEz67o-xADBlZ-TAHyhL/s800/Flying-Rainbow-Dragon-Animated-Image.gif

Cute Dragon

Image Link :
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiplOdqVLafXtKAq8Hnh89tpL_t4Y5P1GkXXf5rTLXAG79GtnAm9kC_VsSg1aDhRp14eKHRPJmZ6VCMHddHWFPNwhYP9XyhhXB2RCwCP6edIJHGxc1JH6j3jwK3afWq_mu2GA2xGNpN7lB4/s800/Flying-Cute-Dragon-Animated-Image.gif

Fire Dragon

Image Link :
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgyH97wXNnHORStwktipIZenMJMaN7J-j80IC3ERslwzBtqKcW6TRkW7d08Tn_Qx_R_38hyphenhyphen7F0yk4pNIRd2ZJlTvrHIgx1FLXOLY1hyGXmgB7ZcIczDK0ZbUla25weMP3Id0c3k1OMot58S/s800/Flying-Fire-Dragon-Animated-Image.gif

Green Dragon

Image Link :
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj3yoKHApdNFQcffw0pdrU-J8UfgrWnmLR_GH0nXihrFzg-ZQQpIqcEomLID8PLnNFY6rKECFCkNImsuUeWOxTEm8QXgL7o1giSDd9rzpXaPMX-pCXg6rZoLrnXXii_HouImmFQDmO3zMgs/s800/flying-green-dragon-animated-image.gif

Red Dragon

Image Link :
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj3yoKHApdNFQcffw0pdrU-J8UfgrWnmLR_GH0nXihrFzg-ZQQpIqcEomLID8PLnNFY6rKECFCkNImsuUeWOxTEm8QXgL7o1giSDd9rzpXaPMX-pCXg6rZoLrnXXii_HouImmFQDmO3zMgs/s800/flying-green-dragon-animated-image.gif

Grey Dragon

Image Link :
https://lh5.googleusercontent.com/-bSPHoql1wR0/TztrRbikGDI/AAAAAAAAA80/gRzuw3I_MlA/s800/Flying-Grey-Dragon-Animated-Image.gif

Wuiiihhh keren dah.... jangan lupa supportnya ya... biar kreasi berikutnya semakin unik, menarik dan atraktif... terima kasih, akhir kata...

.: Semoga Bermanfaat :.

Widget Naga Hitam Terbang Di Blog

Awas !!! Ada Naga Hitam sedang terbang di blog... hati-hati sob sang naga lagi ngamuk... hehe :)), becanda bro, naga hitam yang terbang di blog merupakan efek tampilan blog yang atraktif hasil kreasi original MonozCore terbaru.

Tahun 2012 menurut orang tionghoa merupakan tahun naga yang katanya tahun 2012 ini merupakan tahun yang hoki dan dinamis so... supaya banyak hoki saya mencoba membuat widget atraktif bernuansa naga agar dalam tahun ini dan mendatang saya dan sobat blogger bisa saling berbagi dan bersinergi mendapatkan banyak hoki... setuju.. oke dech... sekarang kita langsung aja ke TKP...

Cara Pemasangan :

Klik "Design" kemudian klik "Edit HTML" setelah itu klik centang pada "Expand Widget Templates", seperti gambar dibawah ini.

Cari kode </Body> pada template blog (tekan tombol keyboard CTRL+F untuk menampilkan kotak pencarian di browser dan mempercepat pencarian) kemudian copy kode di bawah ini dan paste di atas kode </Body> tersebut.

<script language="javascript" src="http://monozcore-project.googlecode.com/files/BlackDragon.js"></script>

| Blog Tools
Klik "Save" dan lihat hasilnya...

.: Semoga Bermanfaat :.

T-One Community

Senin, 19 Maret 2012

Cara Pasang MP3 Player Di Blog Menggunakan MixPod

Membuat Kotak Iklan Dengan Efek Mantul

Widget Flying TinkerBell

Widget Naga Terbang Di Blog #2

Widget Naga Hitam Terbang Di Blog

Follow me

Facebook

Jam

calendar