Headlines News :
Topics :
Tampilkan postingan dengan label Trik Blogger. Tampilkan semua postingan
Tampilkan postingan dengan label Trik Blogger. Tampilkan semua postingan

Membuat label flash berputar berbentuk bumi

Biasanya kita menggunakan label yang tersedia pada blogger, tapi kadang kita ingin sedikit berfantasi dengan animasi-animasi flash, karena kita tidak akan mudah merasa bosan,,contoh animasi flashnya bisa di lihat pada gambar disamping kiri anda.


: langsung aja kita praktekan,mudah ko :

1. Pilih RANCANGAN=>EDIT HTML carilah scrip seperti ini:
<b:section class='sidebar' id='sidebar' preferred='yes'>

2. kemudian pastekan scrip di bawah ini tepat di bawah scrip diatas tadi
<b:widget id='Label99' locked='false' title='Tag Cloud' type='Label'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<script src='http://sites.google.com/site/ruangsc/enes/swfobject.js' type='text/javascript'/>
<div id='flashcontent'>Blogumulus by <a href='http://www.roytanck.com/'>Roy Tanck</a> and <a href='http://twitter.com/kurniasepta'>@kurniasepta</a> Distributed by <a href='http://kurniasepta.blogspot.com'>Belajar Ngeblog di Blog</a></div>
<script type='text/javascript'>
var so = new SWFObject(&quot;http://sites.google.com/site/ruangsc/enes/tagcloud.swf&quot;, &quot;tagcloud&quot;, &quot;300&quot;, &quot;200&quot;, &quot;7&quot;, &quot;#ffffff&quot;);
// uncomment next line to enable transparency
//so.addParam(&quot;wmode&quot;, &quot;transparent&quot;);
so.addVariable(&quot;tcolor&quot;, &quot;0x000000&quot;);
so.addVariable(&quot;mode&quot;, &quot;tags&quot;);
so.addVariable(&quot;distr&quot;, &quot;true&quot;);
so.addVariable(&quot;tspeed&quot;, &quot;120&quot;);
so.addVariable(&quot;tagcloud&quot;, &quot;<tags><b:loop values='data:labels' var='label'><a expr:href='data:label.url' style='12'><data:label.name/></a></b:loop></tags>&quot;);
so.addParam(&quot;allowScriptAccess&quot;, &quot;always&quot;);
so.write(&quot;flashcontent&quot;);
</script>
<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>

3. SAVE 
Note : scrip di atas bisa kamu rubah warna teks,background,kecepatan berputar dan ukuran pixel nya agar sesuai dengan blog kamu.

Cara membuat recent post

 
Cara membuat recent post atau potingan terbaru dengan menggunakan HMTL
1. dari dashboard, klik Tata Letak
2. klik add a gadget
3. Cari HTML/javaScript kemudian copy code dibawah ini lalu paste didalamnya 

<script src="http://sites.google.com/site/anasku2000/post-terakhir.js"></script>
<script>var numposts = 10; var showpostdate = false; var showpostsummary = false; var numchars = 100; </script>
<script src="http://namablogmu.blogspot.com/feeds/posts/default?orderby=published&amp;alt=json-in-script&amp;callback=rp">
</script>

5. Ganti tulisan yang berwarna merah
10 : Jumlah posting yang ingin sobat tampilkan
namablogmu.blogspot.com  : Alamat blog sobat

6. SAVE
Selamat mencoba

Cara Memasukan Kode HTML / Scrip Pada Postingan

Pada postingan blog, kita tidak bisa menampilkan bahasa pemograman yang sudah tertata, Contoh kalo kita ingin membuat tutorial blog yang didalamnya harus ada contoh-contoh scrip-scrip yang ingin di tampilkan, kita tidak bisa mem postingkan secara langsung tapi kita harus meng encode terlebih dahulu
sebenarnnya caranya cukup mudah bisa manual atau pun menggunakan web online


Caranya :
1. Masuk ke http://centricle.com/tools/html-entities


2. Masukan scrip HTML di kotak yang sudah tersedia


3. Klik encode


4. Paste di postingan kamu

"Semoga Bermanfaat"

Cara Mudah Membuat Read More Otomatis

Menurut saya fasilitas "Readmore" sangat berguna dalam membuat blog karena pada halaman utama kita bisa menampilkan lebih banyak postingan karena dengan fasilitas read more hanya menampilkan setengah atau separuh dari postingan, Isi postingan atau artikel akan muncul secara keseluruhan jika kita meng-klik read more tersebut

tidak semua template di buat otomatis membuat read more,,keistimewaan membuat read more otomatis ini adalah artikel postingan yang telah kita buat tidak perlu kita edit kembali secara manual agar read more bisa berfungsi

nah jika sobat salah satunya dan tertarik dengan fasilitas ini silahkan ikuti cara di bawah ini,
Langkah 1

pilih Edit Html lalu ceklis pada bacaan Expand Widget Template

cari kode <head> kemudian masukkan script di bawah ini persis dibawah kode tersebut.

<script type='text/javascript'> var thumbnail_mode = &quot;no-float&quot; ;summary_noimg = 430; summary_img = 340; img_thumb_height = 100; img_thumb_width = 120; </script> <script src='http://rizqi.moehamed.googlepages.com/read-moreotomatis.js' type='text/javascript'/>



Langkah 2

cari kode html berikut ini :

<data:post.body/> atau <p><data:post.body/></p>
ganti kode tersebut dengan kode di bawah ini :

<b:if cond='data:blog.pageType != &quot;item&quot;'>
<div expr:id='&quot;summary&quot; + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);
</script>

<span class='rmlink' style='float:right;padding-top:20px;'>
<a expr:href='data:post.url'>&#187;&#187;&#160;&#160;READMORE...</a></span>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if>
klik save template

Ket: tulisan merah bisa anda ganti sesuai dengan template anda
Summary noimg 430 = tinggi artikel terpenggal tanpa image
Summar img 430 = tinggi artikel terpenggal dengan image
Readmore bisa anda ganti dengan Baca Selengkapnya, full read dll.

"Selamat mencoba"

Membuat Teks Berjalan Pada Tab Menu

Nah kalian pasti pernah liat kan animasi teks berjalan pada tab menu,jadi kalo kita buka tab pasti ada judulnya atau keterangannya pada bagian atas, nah kalo yang ini kita akan buat teks itu berjalan agar terlihat sedikit lebih profesional,hehhe
kalo masih bingung seperti apa, liat teks pada blog ini pada bagian atas,,pokonya seperti itulah contonhnya. .. langsung aja deh kita praktekan mudah ko :

1. Masuk ke blogger, kemudian pada dashboar pilih Rancangan
2. Setelah itu pilih EDIT HTML (jangan Lupa Back up template anda)
3. kemudian Masukan scrip di bawah ini di atas kode <head>

<script type='text/javascript'> //<![CDATA[ msg = " DISINI TULISAN SOBAT " + msg;pos = 0; function scrollMSG() { document.title = msg.substring(pos, msg.length) + msg.substring(0, pos); pos++; if (pos > msg.length) pos = 0 window.setTimeout("scrollMSG()",200); } scrollMSG(); //]]> </script>

Setelah itu SAVE

"SELAMAT MENCOBA"

Membuat Efek Marque

Efek Marque adalah salah satu animasi teks dalam HTML. mungkin kita sering melihat ketika teks itu berjalan dari bawah keatas, dari kanan ke kiri dari kiri kekanan dan seterusnya. nah itu lahh yang akan kita bahas sekarang,,langsung ajha :

ini HTML nya :
<MARQUEE align="center" direction="right" height="10" scrollamount="2" width="30%">
Teks berjalan dari kanan ke kiri
</MARQUEE>

Hasilnya akan seperti ini:


Teks berjalan dari kanan ke kiri



scrollamount="2" artinya kecepatan teks bergerak
direction="right" artinya arah tujuan ke kanan,kalau ke kiri ganti "left"


Selain itu dibawah ini adalah animasi efek MARQUE yang lainnya :

<div align="left"><FONT FACE="georgia" color="White"><B><MARQUEE BGCOLOR="blue" width="50%" scrollamount="3" behavior="alternate">
Teks berjalan bolak balik
</MARQUEE></b></FONT></div>
Hasilnya akan seperti ini :

Teks berjalan bolak balik

Di bawah ini sample marque lagi:
<marquee onmouseover="this.stop()" onmouseout="this.start()" scrollamount="2" direction="up" width="100%" height="50" align="center">
Tulisan atau gambar dari bawah ke atas

</marquee>

Tulisan atau gambar dari bawah ke atas

Sobat bisa mencobanya dengan experimen sendiri dari scrip HTML di atas.

"Selamat Mencoba"

Membuat Teks Area

Trik dibawah adalah hal yang paling dasar dalam penulisan HTML, yaitu membuat teks area. dimana teks area ini akan sangat berguna. kenapa? karena kita bisa memasukan tulisan khusus yang berasa dalam kotak area tersebut.
Untuk membuatnya sobat tinggal copy aja kode di bawah ini

Teks area box ini sangat berguna dan biasa di pakai untuk meng copy scrip atau artikel secara cepat dan untuk menghemat tempat.
Untuk membuatnya sobat tinggal copy aja kode di bawah ini

<div><form name="copy"><div align="center"><input onclick="javascript:this.form.txt.focus();this.form.txt.select();" type="button" value="Highlight All"> </div><div align="center"></div><p align="center"><textarea style="WIDTH: 300px; HEIGHT: 144px" name="txt" rows="100" wrap="VIRTUAL" cols="55">Tuisan sobat disini</textarea></p></div></form>

Hasilnya akan seperti ini :


Atau teks area yang sperti ini

<p align="center"><textarea name="code" rows="6" cols="20"> Tulisan sobat disini</textarea></p>
 
hasinya akan seperti ini :

 
More on this category »">Index »'); document.write('

More on this category »?max-results=10">Horor

');
    More on this category »?max-results="+numposts1+"&orderby=published&alt=json-in-script&callback=showrecentposts1\"><\/script>");

Label 1

Support : Creating Website | Johny Template | Mas Template
Copyright © 2011. Numpang Sharing - All Rights Reserved
Template Created by Creating Website Published by Mas Template
Proudly powered by Blogger