Saturday, May 7, 2011

Cara Membuat Artikel Terkait | Sederhana

Kemarin penulis telah menambahkan menu Related Post atau Artikel Terkait pada Asoka-Site. Bisa sobar lihat pada bagian bawah posting ini. Dan sekarang penulis akan mereview cara membuatnya.
Cara mudah nya untuk membuat related post atau artikel terkait adalah sebagai berikut :
1. Login ke akun Blogger anda.
2. Klik Rancangan, kemudian pilih Edit HTML.
3. Centang Expand Template Widget (saya anjurkan download dahulu template anda).
4. Cari kode seperti ini: <data:post.body/>


Jika sebelumnya sobat sudah memasang script Read More, maka ,mungkin akan terdapat 2 kode <data:post.body/>. Jadi,kita akan pasang script nya dibawah <data:post.body/> yang ke 2 (lebih tepatnya di bawah tag </b:if>).

5. Jika sudah ketemu, maka copy paste-kan kode berikut persis berada dibawah 
<data:post.body/> :

<b:if cond='data:blog.pageType == &quot;item&quot;'><br/><br/><H2>Artikel Terkait:</H2><div class='rbbox'><div style='margin:0; padding:10px;height:200px;overflow:auto;border:1px solid#ccc;'><div id='albri'/><script type='text/javascript'>var homeUrl3 = &quot;<data:blog.homepageUrl/>&quot;;var maxNumberOfPostsPerLabel = 4;var maxNumberOfLabels = 10;maxNumberOfPostsPerLabel = 10;maxNumberOfLabels = 3;function listEntries10(json) {var ul = document.createElement(&#39;ul&#39;);var maxPosts = (json.feed.entry.length &lt;= maxNumberOfPostsPerLabel) ?json.feed.entry.length : maxNumberOfPostsPerLabel;for (var i = 0; i &lt; maxPosts; i++) {var entry = json.feed.entry[i];var alturl;for (var k = 0; k &lt; entry.link.length; k++) {if (entry.link[k].rel == &#39;alternate&#39;) {alturl = entry.link[k].href;break;}}var li = document.createElement(&#39;li&#39;);var a = document.createElement(&#39;a&#39;);a.href = alturl;if(a.href!=location.href) {var txt = document.createTextNode(entry.title.$t);a.appendChild(txt);li.appendChild(a);ul.appendChild(li);}}for (var l = 0; l &lt; json.feed.link.length; l++) {if (json.feed.link[l].rel == &#39;alternate&#39;) {var raw = json.feed.link[l].href;var label = raw.substr(homeUrl3.length+13);var k;for (k=0; k&lt;20; k++) label = label.replace(&quot;%20&quot;, &quot; &quot;);var txt = document.createTextNode(label);var h = document.createElement(&#39;b&#39;);h.appendChild(txt);var div1 = document.createElement(&#39;div&#39;);div1.appendChild(h);div1.appendChild(ul);document.getElementById(&#39;albri&#39;).appendChild(div1);}}}function search10(query, label) {var script = document.createElement(&#39;script&#39;);script.setAttribute(&#39;src&#39;, query + &#39;feeds/posts/default/-/&#39;+ label +&#39;?alt=json-in-script&amp;callback=listEntries10&#39;);script.setAttribute(&#39;type&#39;, &#39;text/javascript&#39;);document.documentElement.firstChild.appendChild(script);}var labelArray = new Array();var numLabel = 0;<b:loop values='data:posts' var='post'><b:loop values='data:post.labels' var='label'>textLabel = &quot;<data:label.name/>&quot;;var test = 0;for (var i = 0; i &lt; labelArray.length; i++)if (labelArray[i] == textLabel) test = 1;if (test == 0) {labelArray.push(textLabel);var maxLabels = (labelArray.length &lt;= maxNumberOfLabels) ?labelArray.length : maxNumberOfLabels;if (numLabel &lt; maxLabels) {search10(homeUrl3, textLabel);numLabel++;}}</b:loop></b:loop></script></div><script type="text/javascript">RelPost();</script></div></b:if>

6. Cari kode ini : ]]></b:skin> 
7. Copy kode CSS di bawah ini ,dan paste diatas kode pada point 6 tadi..

.rbbox{border: 1px solid rgb(192, 192, 192);padding: 5px;background-color: #f0f0f0;-moz-border-radius:5px; margin:5px;}.rbbox:hover{background-color: rgb(255, 255, 255);}
8. Selesai !!


Referensi
http://chenk-rahman.blogspot.com

Membuat scroll bar pada Arsip dan Label blogger

Untuk menghemat ruang pada tampilan blog ,ada baiknya kita menbuat scrool pada widget-widget Sobat Blogger. Sebenarnya penulis ingin membuat auto scroll itu tuh,yang widgetnya bisa berjalan keatas .
Tapi karena tidak ketemu,ya sudah ,penulis memakaikan scrool manual di widget nya. Penerapannya bisa dilihat di sini . Disana saya memakainya untuk diterapkan pada widget Arsip Blog.Sebnarnya untuk membuat scrool bar sangatlah mudah. Scrip dasarnya adalah begini :

<div style="overflow:auto;width:ancho;height:500px;padding:5px;border:1px solid #096DB0">[Kode widget Disini]
</div>
Ket: yang berwarna merah adalah script dasar, dan warna kuning adalah atribut.Bisa sobat atur sesuai kebutuhan. Width=ancho=otomatis ,jadi lebarnya disesuaikan otomatis. Ketinggian nya dan yang lain juga bisa sobat atur sendiri. 

Contoh membuat Scrol pada Arsip. 
<div id='ArchiveList'><div style='overflow:auto; width:ancho; height:400px;'> <div expr:id='data:widget.instanceId + &quot;_ArchiveList&quot;'><b:if cond='data:style == &quot;HIERARCHY&quot;'><b:include data='data' name='interval'/></b:if><b:if cond='data:style == &quot;FLAT&quot;'><b:include data='data' name='flat'/></b:if><b:if cond='data:style == &quot;MENU&quot;'><b:include data='data' name='menu'/></b:if></div></div> </div><b:include name='quickedit'/></div>

Ket: Kode warna merah adalah penempatan tag scrool

Penerapan pada Label.

<b:widget id='Label1' locked='false' title='categories-1' type='Label'><b:includable id='main'><b:if cond='data:title'><h2><data:title/></h2></b:if><div expr:class='&quot;widget-content &quot; + data:display + &quot;-label-widget-content&quot;'><div style='overflow:auto; width:ancho; height:250px;'><b:if cond='data:display == &quot;list&quot;'><ul><b:loop values='data:labels' var='label'><li><b:if cond='data:blog.url == data:label.url'><span expr:dir='data:blog.languageDirection'><data:label.name/></span><b:else/><a expr:dir='data:blog.languageDirection' expr:href='data:label.url'><data:label.name/></a></b:if><b:if cond='data:showFreqNumbers'><span dir='ltr'>(<data:label.count/>)</span></b:if></li></b:loop></ul><b:else/><b:loop values='data:labels' var='label'><span expr:class='&quot;label-size label-size-&quot; + data:label.cssSize'><b:if cond='data:blog.url == data:label.url'><span expr:dir='data:blog.languageDirection'><data:label.name/></span><b:else/><a expr:dir='data:blog.languageDirection' expr:href='data:label.url'><data:label.name/></a></b:if><b:if cond='data:showFreqNumbers'><span class='label-count' dir='ltr'>(<data:label.count/>)</span></b:if></span></b:loop></b:if><b:include name='quickedit'/></div></div></b:includable></b:widget>

Bagi anda yang sudah memahami dan mahir dalam olah HTML, saya yakin trik ini pasti sudah sangat mudah untuk diterapkan. Tapi yang masih newbie (seperti penulis) ,musti ati-ati biar pas penempatannya. Bagi yang mau mempraktekkan trik ini,sebaiknya di download dulu template nya sebelum beraksi. Dan di preview dulu sebelum di save. Percayalah, utak-atik html itu mengasyikan. Cuman kalo udah stes,mending ditinggal aja,bisa-bisa tambah stes  ^_^ 

See you...

Mudahnya Membuat Template Blog Sendiri | Template Shaker

Assalamaualaikum. Asoka-Site akan membahas Cara untuk membuat atau meng edit template Blogger sendiri. Membuat template dengan software template Shaker.
Dengan software ini,kita bisa membuat template blogger seperti yang kita mau. Kita bisa membuat template yang sederhana maupun template yang terlihat profesional. Semua tentu tergantung pada kreatifitas anda masing-masing. Lihatlah screenshot nya:
template shaker| Membuat Template
Tampilan Template Shaker
Contoh hasil Kreatifitas menggunakan Template Shaker: 

foto template seo friendlytemplate seo friendly | AsokaTemplate seo friendly | Asoka Sitetemplate seo friendly | Asoka SiteFoto gambar Template seo friendlyasoka templatetemplate maker | Template shakerTemplate seo hack

Menarik bukan??


Menurut penjelasan di office nya templateshaker ,software ini sudah memiliki WISYWING yang lengkap. Produk ini dirancang untuk memberikan web designer atau sobat-sobat blogger cara cepat dan mudah untuk memodifikasi tampilan template layout standar. Anda dapat mengubah gambar, latar belakang, warna teks, latar belakang dll rilis awal Halaman ini dilengkapi dengan 3 template standar, tapi Anda dapat menghasilkan ratusan template dengan memainkan dengan pengaturan kustomisasi yang berbeda. Software ini akan bebas digunakan jika anda masih menyimpan link di footer bawah anda. Tapi,jika anda ingin menghapus kredit, ada versi komersil yang tersedia. Langsung saja di download dan bersiap untuk berkreasi membuat template sesuka hati anda. Semoga bermanfaat .

Download Template Shaker 3,5

Wednesday, May 4, 2011

Mudahnya Membuat Animasi GIF

Assalamualaikum. Membuat animasi untuk presentasi PowerPoint tentu akan lebih menarik jika ditambah dan di hiasi dengan animasi bukan?Atau kita bisa membuat animasi yang menarik untuk blog kita agar pengunjung bisa menikmati kunjungannya ke Blog kita. Dengan Easy Gif Animator.
Easy Gif Animator
Kali ini,asoka-site akan mengenalkan software kesayangannya, Easy Gif Animator. Soalnya,dengan software ini,sobat bisa membuat animasi sederhana untuk masing-masing keperluan sobat. Biasanya,penulis menggunakan software ini untuk membuat animasi guna mempercantik tampilan presentasi di Kelas. Atau hanya sekedar iseng membuat animasi yang aneh-aneh. Pokoknya,dengan software ini,sobat bisa berkreasi menciptakan animasi sendiri. Kita bisa membuat Animasi Banner,Gambar Bergerak, dan animasi tombol. Easy Gif Animator juga menyediakan tool untuk menambahkan animasi atau gerak tambahan untuk animasi kita. 
asoka site Gif Animator
Tampilan Easy GIF Animator
Selain membuat animasi,kita juga bisa meng-edit animasi berformat Gif yang kita punya dengan Easy Gif Animator. Ini Contohnya Bisa dilihat disini Animasi Hasil Editan Asoka-Site .


Bagaimana Cara Kerja Easy Gif Animator Ini?
Software ini bekerja dengan cara yang sederhana,yaitu menggabungkan gambar-gambar atau foto kita menjadi tampulan animasi atau gambar gerak yang bagus. Contohnya,bisa kita lihat pada gambar diatas. Di sisi kiri,ada sederet gambar yang merupakan gambar penyusun pada animasi atau gambar gerak. Dan jika dijalankan,akan menghasilkan sederet gambar gerak yang yang indah. Memang perlu kesabaran untuk menciptakan sebuat animasi yang indah. Pertama-tama kita perlu menyiapkan komponen atau gambar-gambar dasar yang bisa kita buat di PhotoShop atau menggunakan Ms. Paint . Kemudian kita gunakan easy GIF animator untuk menyusunnya. Mudah bukan??
Kita bisa menyimpan hasil kerjaan kita dengan Easy GIF Animator dengan berbagai format. Diantaranya Gif,Avi,Flash ,kirim lewat email,dan bahkan kita bisa langsung mendapatkan kode HTML nya.

Download Easy GIF Animator:

Saturday, April 30, 2011

Membuat Sitemap Blog Secara Offline

Membuat sitemap di blogger bisa kita lakukan dengan menggunakan berbagai cara. Salahsatunya menggunakan software Sitemap Generator. Sebelumnya sudah penulis bahas di postingan sebelumnya. Sobat bisa membacanya disini Membuat Sitemap Blog Offline | Dengan Sitemap Generator ,bila berkenan,silahkan dibaca.  Kali ini akan penulis sampaikan software lainnya yang juga berguna untuk membuat sitemap di Blog sobat. Sitemap Generator yang ini adalahrintisan dari WonderWebWare. Ini dia screenshotnya :
Tampilan Sitemap Generator
Sistem Requirment nya tidak terlalu banyak hanya:
  • Windows 98, XP, Vista
  • 256 MB RAM
  • 100 MB HDD
  • IE 5.5+
Sitemap Generator ini bekerja di seperti Spider-Web dalam membuat sitemap blog anda. Ketika anda memasukkan alaman URL blog anda,maka software ini akan menelusuri seluruh isi Blog anda. Termasuk link yang termuat didalamnya. Menarik bukan?? 

Download SiteMap Generator:

Wednesday, April 27, 2011

Menambah Penulis Blog Di Blogger

Ada yang mau mengganti email login pada Akun Blogger/Blogspot nya?? Email yang kita gunakan untuk login di Blogger tentu bisa kita Ganti. Sebelumnya sudah penulis bahas pada postingan yang dahulu. Tentang mengganti akun blogger dengan email lain. Namun,mungkin itu banyak tahapan-tahapan nya,sehingga agak susah pahami (sebenarnya sih simpel, hahaha). Kali ini,akan dibahas caranya yang lebih simpel
untuk mengganti email login di Blogger. Tapi ada kekurangannya menggunakan trik yang satu ini. Yaitu,hanya bisa diterapkan untuk satu blog yang anda kelola. Misalnya,jika dalam akun blogger anda,anda mengelola 3 blog ,Yaitu Misalnya masing-masing blog anda diberi nama Blog1,Blog2,Blog3, dan anda memakai trik ini untuk blog anda yang ke2 (Blog2) ,maka,ketika anda login dengan email anda yang baru,yang ada di  dasbor hanya blog anda yang kedua. Untuk lebih jelasnya,silahkan ikuti tips dibawah untuk menambah penulis di Blog. Yaitu melalui menu Izin/Permission di Blogger.Berikut cara nya:
1. Login dulu ke Blogger kamu dengan email kamu yang biasa.
2. Di dasbor, menu Pengaturan pada blog yang ingin diganti emailnya
3. Pada meu Tab ,klik masuk ke menu Izin.
4. Klik tombol Menambah Penulis. Disana anda bisa mamasukan alamat email anda yang baru untuk dijadikan penulis Blog.
Karena sudah menjadi penulis,jadi email baru anda bisa digunakan untuk login ke Blogger anda,namun hanya sebatas menulis posting saja!.
5. Setelah itu,klik tombol Undang. 
6. Jangan lupa untuk menkonfirmasi permintaan undang tadi di alamat email anda yang baru anda masukan tadi. Silahkan cek di email baru anda,dan konfirmasikan email dari blogger tersebut.
7. Sampai disini sudah selesai!!

Sekarang,setatus email anda di blogger masih sebagai Penulis ,jadi hanya bisa menulis posting saja di blog tersebut. Selanjutnya,anda bisa menjadikan email anda yang baru menjadi ADMIN agar bisa melakukan hal-hal yang biasa dilakukan seorang blogger di blognya, bukan hanya menulis. Caranya dengan mengeklik icon "Jadikan Admin". Selesai.

Friday, April 22, 2011

Cara Mengganti Akun Blogger Dengan Email Lain

Mengganti akun email pada blogger tentu bisa. Karena,kabarnya, pihak Blogger yang telah diakuisisi oleh Google,berencana akan menghapus akun dan blog lama di blogspot. Oleh karena itu,anda harus punya akun Google untuk bisa eksis di Blogger. Jadi,akun blogspot yang tidak menggunakan akun Google akan dihapus/ditutup !! Darisana,saya juga mengganti akun blogger saya dari yang dulunya yahoo.com, jadi gmail.com  . Setau penulis,ada dua cara untuk mengganti email masuk Blogger, yang satu bisa anda baca disini Menambah Penulis Blog. dan yang satu nya bisa kita simak pada tutorial di bawah.
Penting : Sebelumnya,anda harus sudah memiliki akun di gmail yang akan di pakai untuk mengganti akun yahoo di akun blogger anda. Dalam membuat akun di gmail,jadikan email yahoo anda sebagai email pemulihan. Tanpa langkah ini,anda tidak bisa melanjutkan langkah selanjutnya!!
Kolom yang diberi lingkaran adalah kolom email pemulihan yang diisi dengan email yahoo anda.

Setelah anda memiliki email di gmail dengan email yahoo anda sebagai email pemulihannya,ikutilah langkah dibawah:
Berikut caranya,
1. Pertama-tama,buka dulu blogger,dan sign in dengan email kamu yang yahoo atau yang lain (yang ingin diganti ke gmail),
2. Ketika ada di halaman dasbor, lihatlah pojok kanan atas,disana ada barisan menu warna biru.
3. Klik menu Akunku
Barisan Menu Dasbor
4. Maka anda akan dibawa pada halaman akun blogger anda
Email Gmail akan berubah menjadi email utama
5. Kemudian klik edit
Ada dua email dalam Blogger anda
6. Klik hapus pada email anda yang yahoo. Dan jangan lupa klik Simpan.
7. Selamat!! Anda berhasil mengganti akun email anda di Blogger.

Setelah selesai,lihatlah halaman dasbor anda,maka yang ada disisi menu yang wara biru,akan berubah menjadi ****@gmail.com.

Bila ada pertanyaan,silahkan dibahas di kotak komentar,