slider

membuat feature slider image otomatis

Ada beberapa template yang nantinya akan saya share tapi kali ini saya buat sederhana, dengan sedikit menggunakan javascript, ya yang pasti lebih enteng dari biasanya. Oke kembali ke tutorial yang akan saya buat, kali ini saya akan membahas tentang cara membuat slider image otomatis sederhana yang akan menampilkan postingan terbaru Anda.

Slider ini hanya memakai innerfade jquery dan cycle jquery plugin untuk melembutkan perpindahan content slider (bener nggak ya...?), pengertian Innerfade jquery kira-kira seperti ini :

InnerFade is a small plugin for the jQuery-JavaScript-Library. It's designed to fade you any element inside a container in and out.

These elements could be anything you want, e.g. images, list-items, divs. Simply produce your own slideshow for your portfolio or advertisings. Create a newsticker or do an animation.

Source : medienfreunde.com

Wah malah bingung sendiri saya mas/mbak maklum Inggris saya dapat 6 dulu waktu sekolah, langsung saja pada cara pembuatannya :

1. Login ke blogger dengan akun Anda
2. Setelah itu pilih blog yang ingin anda tambahkan slider ini.
3. Masuk ke template >> Edit HTML, kemudian centang expand widget templates
4. Untuk berjaga-jaga jika terjadi kesalahan dalam pengeditan nantinya, sebaiknya backup dulu template anda.
5. Setelah semua langkah diatas anda lakukan, letakkan kode berikut ini diatas kode ]]></b:skin> :

Read More

kaligrafi

1. Syahadah Kaligrafi

Jam analog ini menampilkan kalimat syahadat laa ilaaha illallaahatau muhammad arrasulullaah dalam gaya tradisional. Gayatersebut dapat dilihat pada bendera Arab Saudi atau benderaKhilafah dari Hizbut Tahrir. Yang mati syahid adalah kalimatproklamasi penyerahan kepada iman Islam. Ini berarti ada Tuhanselain Allah (satu-satunya tuhan) dan Muhammad adalah utusanAllah.

Ini juga merupakan jam dunia, yang dapat diatur untuk menyesuaikan zona waktu tertentu. Warna jam juga dapat disesuaikan.

copy kode di bawah ini :

<img style="visibility:hidden;width:0px;height:0px;" border=0 width=0 height=0 src="http://c.gigcount.com/wildfire/IMP/CXNID=2000002.0NXC/bT*xJmx*PTEzMTA*NTg4MTAyNTImcHQ9MTMxMDQ1OTE1MzQ*NyZwPTIzODk4MSZkPUlzbGFtaWMlMjBDbG9jayUzYSUyMHRhaGxp/bDAyJmc9MSZvPWRlNjFlZTQwNmQ4ZDRmOWI5OTk1OWVmYWNkMGJlZWMyJm9mPTA=.gif" /><div style="margin:0px auto;text-align:center;width:160px;height:160px;"><embed src="http://www.widgipedia.com/widgets/alhabib/Islamic-Clock---Shahada---Analog-2722-8192_134217728.widget?__install_id=1310458776647&amp;__view=expanded" width="160" height="160" flashvars="&col1=fed803&col2=92f3a8&col3=eeffcc&tzoffset=false&gig_lt=1310458810252&gig_pt=1310459153447&gig_g=1" swliveconnect="true" quality="best" loop="false" menu="false" wmode="transparent" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.adobe.com/go/getflashplayer" /></div>

2. cinta allah

Aku mencintai Allah, aku ingin mengingatnya kapan saja, Allahselalu dalam hati saya. Mereka adalah beberapa ungkapan bahwa ini jam analog ingin menyampaikan. Ini menampilkan sebuah hati merah dengan nama Allah di atasnya. Sekarang Anda juga bisamenunjukkan cinta Anda kepada Allah melalui situs atau blog Anda.

Ini juga merupakan jam dunia, yang dapat diatur untuk menyesuaikan zona waktu tertentu. Warna jam juga dapat disesuaikan.

copy kode di bawah ini :

<img style="visibility:hidden;width:0px;height:0px;" border=0 width=0 height=0 src="http://c.gigcount.com/wildfire/IMP/CXNID=2000002.0NXC/bT*xJmx*PTEzMTA*NTg4MTQ3MTAmcHQ9MTMxMDQ1OTI2ODAwNSZwPTIzODk4MSZkPUlzbGFtaWMlMjBDbG9jayUzYSUyMGxvdmVh/bGxhaDAzJmc9MSZvPWRlNjFlZTQwNmQ4ZDRmOWI5OTk1OWVmYWNkMGJlZWMyJm9mPTA=.gif" /><div style="margin:0px auto;text-align:center;width:160px;height:160px;"><embed src="http://www.widgipedia.com/widgets/alhabib/Love-Allah-World-Clock---Islamic-Clock-2721-8192_134217728.widget?__install_id=1310458776668&amp;__view=expanded" width="160" height="160" flashvars="&col1=ff0000&col2=f3e4b1&col3=eeffcc&tzoffset=false&gig_lt=1310458814710&gig_pt=1310459268005&gig_g=1" swliveconnect="true" quality="best" loop="false" menu="false" wmode="transparent" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.adobe.com/go/getflashplayer" /></div>

3. Mencintai Allah, Mengalahkan Hati 

Sekarang Anda dapat mengatakan cinta kepada Allah denganjantung yang berdetak animasi.

Ini juga merupakan jam dunia, dan jam zona waktu. Warna jam juga dapat disesuaikan.

copy kode di bawah ini : 

<img style="visibility:hidden;width:0px;height:0px;" border=0 width=0 height=0 src="http://c.gigcount.com/wildfire/IMP/CXNID=2000002.0NXC/bT*xJmx*PTEzMTA*NTg4MTg1ODgmcHQ9MTMxMDQ1OTM4MjI5NCZwPTIzODk4MSZkPUlzbGFtaWMlMjBDbG9jayUzYSUyMGxvdmVh/bGxhaDAxJmc9MSZvPWRlNjFlZTQwNmQ4ZDRmOWI5OTk1OWVmYWNkMGJlZWMyJm9mPTA=.gif" /><div style="margin:0px auto;text-align:center;width:160px;height:160px;"><embed src="http://www.widgipedia.com/widgets/alhabib/Love-Allah---Heart-Beats-2757-8192_134217728.widget?__install_id=1310458769564&amp;__view=expanded" width="160" height="160" flashvars="&col1=ffffff&col2=cccccc&col3=eeffcc&tzoffset=false&gig_lt=1310458818588&gig_pt=1310459382294&gig_g=1" swliveconnect="true" quality="best" loop="false" menu="false" wmode="transparent" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.adobe.com/go/getflashplayer" /></div>

4. Syahadah dengan Teks Kustom

Modifikasi lain dari jam partai politik memberikan jam ini Syahadahdan warna disesuaikan dan teks. Ini juga merupakan jam dunia, yang dapat diatur untuk menyesuaikan zona waktu tertentu.

copy kode di bawah ini :

<img style="visibility:hidden;width:0px;height:0px;" border=0 width=0 height=0 src="http://c.gigcount.com/wildfire/IMP/CXNID=2000002.0NXC/bT*xJmx*PTEzMTA*NTk*ODY1OTImcHQ9MTMxMDQ2MDAzNjE1NyZwPTIzODk4MSZkPUlzbGFtaWMlMjBDbG9jayUzYSUyMHN5YWhh/ZGF*MDEmZz*xJm89ZGU2MWVlNDA2ZDhkNGY5Yjk5OTU5ZWZhY2QwYmVlYzImb2Y9MA==.gif" /><div style="margin:0px auto;text-align:center;width:160px;height:180px;"><embed src="http://www.widgipedia.com/widgets/alhabib/Syahadat-Islamic-Clock---Circle-2954-8192_134217728.widget?__install_id=1310459456365&amp;__view=expanded" width="160" height="180" flashvars="&col1=006633&col2=99ff00&col3=000000&yourtext=Allah+my+Lord&tzoffset=false&gig_lt=1310459486592&gig_pt=1310460036157&gig_g=1" swliveconnect="true" quality="best" loop="false" menu="false" wmode="transparent" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.adobe.com/go/getflashplayer" /></div>

5. Aku Cinta Islam

Cara lain untuk menunjukkan kasih kita kepada agama yang benar,agama para nabi, agama dari Tuhan Yang Maha Esa, Allah.Sekarang dengan desain lengkap Anda dapat merancang warnajam untuk menyukai Anda.

copy kode di bawah ini :

<img style="visibility:hidden;width:0px;height:0px;" border=0 width=0 height=0 src="http://c.gigcount.com/wildfire/IMP/CXNID=2000002.0NXC/bT*xJmx*PTEzMTA*NjAzMzY4NTAmcHQ9MTMxMDQ2MDM1OTg*NiZwPTIzODk4MSZkPUlzbGFtaWMlMjBDbG9jayUzYSUyMGxvdmVp/c2xhbTAxJmc9MSZvPWRlNjFlZTQwNmQ4ZDRmOWI5OTk1OWVmYWNkMGJlZWMyJm9mPTA=.gif" /><div style="margin:0px auto;text-align:center;width:160px;height:160px;"><embed src="http://www.widgipedia.com/widgets/alhabib/I-Love-Islam-Sketch---Analog-Clock-2970-8192_134217728.widget?__install_id=1310459460034&amp;__view=expanded" width="160" height="160" flashvars="&col1=000000&col2=ccff00&col3=eeffcc&tzoffset=false&gig_lt=1310460336850&gig_pt=1310460359846&gig_g=1" swliveconnect="true" quality="best" loop="false" menu="false" wmode="transparent" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.adobe.com/go/getflashplayer" /></div>

6. Masjid yang indah Silhouette 

Masjid selalu menjadi bagian sentral dari kehidupan seorang muslim yang setia. Itulah sebabnya muslim selalu membangunmasjid mereka dengan perawatan yang paling. Banyak masjidbesar juga dibangun untuk menunjukkan kebesaran islam. Merekaunik dan indah dalam arsitektur mereka. 

copy kode di bawah ini :

<img style="visibility:hidden;width:0px;height:0px;" border=0 width=0 height=0 src="http://c.gigcount.com/wildfire/IMP/CXNID=2000002.0NXC/bT*xJmx*PTEzMTA*NjA1NDkxMTMmcHQ9MTMxMDQ2MDU1NDY*MiZwPTIzODk4MSZkPUlzbGFtaWMlMjBDbG9jayUzYSUyMG1vc3F1/ZS1zaWxob3VldHRlLTAxJmc9MSZvPWRlNjFlZTQwNmQ4ZDRmOWI5OTk1OWVmYWNkMGJlZWMyJm9mPTA=.gif" /><div style="margin:0px auto;text-align:center;width:150px;height:150px;"><embed src="http://www.widgipedia.com/widgets/alhabib/Islamic-Clock-Mosque-Silhouette-3445-8192_134217728.widget?__install_id=1310460358536&amp;__view=expanded" width="150" height="150" flashvars="&col1=3399cc&col3=eeffcc&tzoffset=false&gig_lt=1310460549113&gig_pt=1310460554642&gig_g=1" swliveconnect="true" quality="best" loop="false" menu="false" wmode="transparent" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.adobe.com/go/getflashplayer" /></div>

caranya memasang kode di atas adalah 

1. Login ke Blog dengan akun kamu

2. Pilih Tata Letak atau Rancangan

3. Pilih Elemen Laman

4. Klik Add Gadget --> HTML/Java Script

5.copas kode di atas ke kolom htmljava script lalu klik save dan lihat hasilnya.

Read More

cipta

cara membuat hak cipta blogger

salam blogger kawan, apa kabar ? saya do'akan agan selalu dalam rahmad dan kasih sayang Allah swt , Amin !!!,,,,, nah gan,,kali ini saya berkesempatan posting lagi tentang tuatorial ngeblog. kalau dulu saya pernah ngeshare tentang cara memasang kotak komentar facebook jilid 2  , sekarang saya mendapat trik baru untuk membuat hak paten akan isi blog anda, karna seiring dengan fenomena copas dengan tidak mengikuti tatanan atau aturan undang undang copas, maka sudah selayaknya kita menjaga isi postingan kita dengan cara memasang hak cipta blog kita. saya mengunjungi blog sahabat kita dengan url blog http://vikrymadz.blogspot.com, disini saya mendapat trik jitu untuk memasang hak cipta kita di blog. 

nah, sekarang ikutin tutorial ini jika sobat mau memasangnya di blog sobat !!!

- pertama tama login blog sobat !!!

- klik rancangan pada dasbor blog sobat !!!

- klik edit HTML

- tandai/ centang expand widget template

- cari kode <head> (tekan ctrl + f atau f3 untuk memudahkan pencarian), setelah ketemu segera copas code dibawah ini sesudah code <head>

<script type='text/javascript'>
function addLink() {
var body_element = document.getElementsByTagName(&#39;body&#39;)[0];
var selection;
selection = window.getSelection();
var pagelink = &quot;<br/><br/> Original Post at: <a href='&quot;+document.location.href+&quot;'>&quot;+document.location.href+&quot;</a>&quot;; // change this if you want
var copytext = selection + pagelink;
var newdiv = document.createElement(&#39;div&#39;);
newdiv.style.position=&#39;absolute&#39;;
newdiv.style.left=&#39;-99999px&#39;;
body_element.appendChild(newdiv);
newdiv.innerHTML = copytext;
selection.selectAllChildren(newdiv);
window.setTimeout(function() {
body_element.removeChild(newdiv);
},0);
}document.oncopy = addLink;
</script>


lalu jangan lupa klik save/ simpan, dan lihat hasilnya, setiap copian anda yg tertera di blog pasti akan muncul url blog anda, bagaimanasobat, mudah kan?

Read More

melayank

cara memasang fan page melayang di blogspot

saya bingung dengan kondisi blog saya dengan widget widget yang amburadul dan tidak signifikan, jadi saya pun mulai mencarikan tips jitu untuk memperindah tampilan blog saya, yaitu dengan membuat widget menempel di dinding blog..sehingga pengunjung pun lebih menikmati di saat membaca artikel di blog.

setelah saya tanya kepada mbah google. saya dapatkan script bagus dari blog www.sakahayang.com, dengan tampilan widget seperti ini.

nah, jika agan mau memasang widget seperti ini, agan boleh copas script di bawah ini.

<!-----find us on fb----->
<style type="text/css"> #fb{ position:fixed; top: 240px; z-index:+1000; } * html #fb{position:relative;} .fbtab{ height:140px; width:54px; float:left; cursor:pointer; background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiMUUL5RwD4-Vb7bPQm9YCAojSGDpajfA2aHLwbYIySBwtwC6yOCLdGTHwHCTFoIvVGhd6008uTRdUmwH6rRca3le-NQ-rA1h0Mhoyqph7Xaq4oE45t4W6RR0UiVbqRRPOVYvw3u27Z727d/s1600/find-us-on-fb.gif') no-repeat; } .fbcontent{ float:left; border:2px solid #A5BD51; background:#F5F5F5; padding:10px; } </style> <script type="text/javascript"> function showHideFB(){ var fb = document.getElementById("fb"); var w = fb.offsetWidth; fb.opened ? moveFB(0, 40-w) : moveFB(20-w, 0); fb.opened = !fb.opened; } function moveFB(x0, xf){ var fb = document.getElementById("fb"); var dx = Math.abs(x0-xf) > 10 ? 5 : 1; var dir = xf>x0 ? 1 : -1; var x = x0 + dx * dir; fb.style.right = x.toString() + "px"; if(x0!=xf){setTimeout("moveFB("+x+", "+xf+")", 10);} } </script> <div id="fb"> <div class="fbtab" onclick="showHideFB()"> </div> <div class="fbcontent">

<div class="fb-like-box" data-href=" https://www.facebook.com/pages/irakbuzz/135032516582000 " data-width="349" data-height='335' data-show-faces="true" data-stream="false" data-header="true"></div>

<br/><div style="text-align:right"> <a href="javascript:showHideFB()"> [tutup] </a> </div> </div> </div> <script type="text/javascript"> var fb = document.getElementById("fb"); fb.style.right = (40-fb.offsetWidth).toString() + "px"; fb.opened=true; </script>

Read More

burung

Cara Memasang Burung Twitter Terbang

Memasang burung Twitter terbang di blog sangat mudah. Sobat blogger hanya membutuhkan waktu kurang dari satu menit untuk melakukannya, karena sobat blogger tidak perlu edit template. Kode Twitter Flying Bird atau burung Twitter terbang hanya ditambahkan di area atau di kolom tempat sobat blogger biasa meletakkan kode untuk membuat widget. Dengan menambahkan burung Twitter terbang di blog, tampilan blog sobat pasti akan terlihat tambah indah dan cantik. Talk less do more, kita langsung saja ke prakteknya.

Read More