Nah nhe artikel mungkin buat agan sekalian udah basi atau udah tau tapi saya hanya membuka lembaran baru dikit reques2 dari agan2 yang udah niat mampir ke blog agan ini ,,makasih yah,,ini caranya agak sedikit rumit saya juga dapat dari tetangga saya sebelah,dan saya pelajari bisa,maka saya coba share di sini,smga membantu,,,
saya cuma akan share memasukan lagu atau musik ke dalam blg agan yang ingin banget dengan artikel ini,,,,,,,langsung sajalah ya saya jelaskan cara-caranya :
Maaf agan harus buka situs web dibawah ini karna wajib banget,
http://ex-musik.blogspot.com
setelah anda buka anda akan dihadapkan dimana anda harus pilih lagu yang anda suka di blog tersebut. setelah anda menemukan lagu / musik mp3 yang anda suka maka sekarang anda tinggal mengcopy code HTML yang tersedia disamping musik / lagu tersebut.
lalu anda ke RANCANGAN atau LAYOUT anda pilih seperti biasa ADD GEDGET == > lalu HTML/JAVA SCRIPT nah anda copi pastekan HTML lagu td yg anda copy ke dalam ini,lalu anda SAVE/SIMPAN TEMPLATE....nah coba lihat blog anda balik,,,apakah ada perubahan,,musik yang anda incar apakah ada,,dan berjalan,,,,,,,,,,
nah,,hanya segitu yang bisa saya terangkan untuk selebihnya apabila anda kurang paham anda bisa tanyakan lagi kepada saya ok....di tunggu keberhasilannya.
Cara Membuat Read More
Lho? maksudnya apa? gini lho kalo read more yang lama, yang sudah pernah dibahas kita bahas dulu (udah baca belum?, kalo belum baca dulu gih disini ), kan kalo kita ng-klik tulisan read moreatau Baca Selengkapnya itu kita akan membuka halaman baru sehingga akan meloading lagi halaman web kita, ya tho?. Nha Read more yang ini, yang akan kita bahas ini nggak gitu cara kerjanya, cara kerjanya yaitu berangkat jam 08.00 pagi pulang jam 16.00 WIB (emangnya PNS) :D Gini lho cara kerjanya :
Di trik Read more yang baru ini, kita akan membuat link Read moreyang jika kita meng-klik link tersebut, maka keseluruhan artikel akan terpampang dibawahnya, jadi tidak perlu meload ke halaman yang lain, contohnya disini. Piye? uenak tho? bagi yang sudah kebelet ingin menyimak trik ini silahkan langsung ikuti trik berikut ini (langsung loncat dua baris ke bawah). Dan bagi yang kebelet mo pipis silahkan ke kamar mandi dulu :D
Berikut ini langkah-langkahnya:
1. Login ke Blogger
2. Pilih Layout --> Edit HTML
3. Kamu mau memback-up template kamu dulu nggak?, kalo iya kilik tulisan Download Template lalu simpan.
4. JBeri tanda centang pada kotak yang bertuliskan Expand Template Widget
5. Kopi kode berikut ini dan taruh tepat diatas kode </head>
<script src='http://kendhin.890m.com/Readmore.js'
type='text/javascript'/>
6. Sudah? sudah belum? ditanya kok diam aja gimana sih ? :x
7. Kalo sudah cari kode dibawah ini
<div class='post-header-line-1'/>
(letaknya kira-kira di bagian tengah kebawah. yak terus..terus..Nha disitu ketemu kan kodenya?)
8. Nha dibawahnya kan ada kode gini <div class='post-body entry-content'> Nha ganti kode tersebut menjadi seperti ini:
<div class='post-body entry-content' expr:id='"post-" + data:post.id'>
<b:if cond='data:blog.pageType == "item"'>
9.Terus dibawahnya kan kan ada kode gini <p><data:post.body/></p>
10. Tembahkan kode ini dibawahnya.
<b:else/>
<style>#fullpost {display:none;}</style>
<p><data:post.body/></p>
<span id='showlink'>
<p><a expr:onclick='"javascript:showFull(\"post-" + data:post.id + "\");"' href='javascript:void(0);'>[+/-] Selengkapnya...</a></p>
</span>
<span id='hidelink' style='display:none'>
<p><a expr:onclick='"javascript:hideFull(\"post-" + data:post.id + "\");"' href='javascript:void(0);'>[+/-] Ringkasan...</a></p>
</span>
<script type='text/javascript'>checkFull("post-" + "<data:post.id/>")</script>
</b:if>
11. jadi seluruh kodenya akan menjadi seperti ini :
<div class='post-header-line-1'/>
<div class='post-body entry-content' expr:id='"post-" + data:post.id'>
<b:if cond='data:blog.pageType == "item"'>
<p><data:post.body/></p>
<b:else/>
<style>#fullpost {display:none;}</style>
<p><data:post.body/></p>
<span id='showlink'>
<p><a expr:onclick='"javascript:showFull(\"post-" + data:post.id + "\");"' href='javascript:void(0);'>[+/-] Selengkapnya...</a></p>
</span>
<span id='hidelink' style='display:none'>
<p><a expr:onclick='"javascript:hideFull(\"post-" + data:post.id + "\");"' href='javascript:void(0);'>[+/-] Ringkasan...</a></p>
</span>
<script type='text/javascript'>checkFull("post-" + "<data:post.id/>")</script>
</b:if>
12. Tulisan 'Selengkapnya' dan 'Ringkasan' bisa diganti dengan apa aja kata yang kamu suka.
13. Lalu simpan template.
14. Pilih menu Setting -->> Formatting
15. Di bagian bawah ada kotak yang disampingnya ada tulisan"Post Template", dan isikan kode dibawah ini ke dalamnya lalu simpan setting.
<span id="fullpost">
</span>
selesai....
Ohya, kalo memposting pilih yang "Edit Html", letakkan abstraksi posting yg akan ditampilkan di halaman muka di atas kode <span class="fullpost"> sementara sisanya yaitu keseluruhan posting letakkan di antara kode <span id="fullpost"> dan </span>
Trus bagaimana bagi yang sudah pakai 'read more' yang lama dan pingin ganti dengan 'read more' yang baru ini?
gini caranya:
'Read more' yang lama kan kodenya seperti ini :
<div class='post-header-line-1'/>
<div class='post-body entry-conten'>
<b:if cond='data:blog.pageType == "item"'>
<style>.fullpost{display:inline;}</style>
<p><data:post.body/></p>
<b:else/>
<style>.fullpost{display:none;}</style>
<p><data:post.body/></p>
<a expr:href='data:post.url'>Read More......</a>
</b:if>
hapus text yang berwarna biru, lalu ikuti langkah-langkah diatas.
oh ya jangan lupa ikuti langkah berikut ini
1. Pilih menu Setting -->> Formatting
2. Di bagian bawah ada kotak yang disampingnya ada tulisan "Post Template", dan isikan kode dibawah ini ke dalamnya lalu simpan setting.
<span id="fullpost">
</span>
bedanya apa sama read more yang dulu? perhatikan text yang berwarna merah, kalo dulu kan tulisannya "class" sekarang ganti menjadi "id".
Gimana? Sudah bisa belum?
Pinter.... anak siapa siiihhh??? duh lutunya :$
Cara Membuat Search Engine di Blogger
Tentu kita semua sudah tahu apa itu Search Engine (hari gini gak tahu apa itu search engine? cape' deeh...). Search Engine adalah ... bla.. bla..bla.. dst.
Saat ini Search Engine tidak bisa dipisahkan dalam dunia internet. Dengan Search Engine kita bisa mencari tahu tentang suatu hal yang kita inginkan sesuai dengan keyword yang kita ketikkan dan juga bla.bla..bla..... udah ah penjelasannya, yang mau dibahas disini adalah bagaimana caranya membuat search engine di blogger . Caranya sangat mudah, yaitu:
1. Login ke blogger terus klik Layout terus pilih page elements nha disitu kan banyak tulisan Add a page elements klik link tersebut dan sesuaikan dimana tempatnya menaruh search engine
2. kemudian pada layar baru yang muncul pilih HTML/Javascriptkemudian copy/paste script/kode berikut ini di dalam kolom content.
<form action="http://nama-blogmu.blogspot.com/search"
method="get"> <input class="textinput" name="q" size="30" type="text"/> <input value="search" class="buttonsubmit" name="submit" type="submit"/></form>
Ganti nama-blogmu dengan nama blog kamu. Aangka 30menunjukkan panjang kotak (text box) semakin banyak angkanya maka semakin panjang textbox-nya
Saat ini Search Engine tidak bisa dipisahkan dalam dunia internet. Dengan Search Engine kita bisa mencari tahu tentang suatu hal yang kita inginkan sesuai dengan keyword yang kita ketikkan dan juga bla.bla..bla..... udah ah penjelasannya, yang mau dibahas disini adalah bagaimana caranya membuat search engine di blogger . Caranya sangat mudah, yaitu:
1. Login ke blogger terus klik Layout terus pilih page elements nha disitu kan banyak tulisan Add a page elements klik link tersebut dan sesuaikan dimana tempatnya menaruh search engine
2. kemudian pada layar baru yang muncul pilih HTML/Javascriptkemudian copy/paste script/kode berikut ini di dalam kolom content.
<form action="http://nama-blogmu.blogspot.com/search"
method="get"> <input class="textinput" name="q" size="30" type="text"/> <input value="search" class="buttonsubmit" name="submit" type="submit"/></form>
Ganti nama-blogmu dengan nama blog kamu. Aangka 30menunjukkan panjang kotak (text box) semakin banyak angkanya maka semakin panjang textbox-nya
Cara Membuat Link Teman
Artikel kali ini kita akan membahas cara membuat kotak banner untuk link teman, sekalian untuk menjawab pertanyaan dari pengunjung yang menanyakan cara membuat kotak link teman agar terlihat rapi. Sebetulnya cara membuat kotak link teman ini banyak variasinya, yang tentunya disesuaikan dengan selera rekan-rekan. kita disini hanya membahas beberapa contoh saja :
I. Menggunakan Efek Scrollbar
Contoh :
Untuk model seperti di atas kita tinggal copy paste kan kode script berikut :
<div style="overflow:auto; width:50px; height:80px; padding:10px; border:1px solid #999999;">
<li><a Kode link teman </a></li>
<li><a Kode link teman </a></li>
</div>
Kita dapat mengatur panjangnya (height), lebarnya (width), maupunwarnanya disesuaikan dengan keinginan kita.
Untuk kode link teman, kita dapat memasukkan kode banner link blog teman kita.
I. Menggunakan Efek Scrollbar
Contoh :
Untuk model seperti di atas kita tinggal copy paste kan kode script berikut :
<div style="overflow:auto; width:50px; height:80px; padding:10px; border:1px solid #999999;">
<li><a Kode link teman </a></li>
<li><a Kode link teman </a></li>
</div>
Kita dapat mengatur panjangnya (height), lebarnya (width), maupunwarnanya disesuaikan dengan keinginan kita.
Untuk kode link teman, kita dapat memasukkan kode banner link blog teman kita.
Cara Membuat Buku Tamu
cara membuat buku tamu di blogspot, sobat bisa memanfaatkan situs-situs penyedia buku tamu gratis yang mudah sobat dapatkan di internet, salah satunya adalah www.cbox.ws .
Silahkan sobat kunjungi dahulu situs tersebut, mendaftar kemudian ambil kode scriptnya yang nantinya akan dipasang kan ke dalam blog sobat.
Setelah sobat mengcopy kode script buku tamunya, maka sobat masuk ke blog sobat lalu log in > klik rancangan > elemen laman > tambah Gadget > html/javascript, dan masukan kode di bawah ini:
<style type="text/css">
#gb{
position:fixed;
top:50px;
z-index:+1000;
}
* html #gb{position:relative;}
.gbtab{
height:100px;
width:30px;
float:left;
cursor:pointer;
background:url('http://2.bp.blogspot.com/-mrsZX_-WDkk/Te5tiGXpqNI/AAAAAAAAAZg/hDLjMWDN6_U/s1600/bukutamu.png') no-repeat;
}
.gbcontent{
float:left;
border:2px solid #A5BD51;
background:#F5F5F5;
padding:10px;
}
</style>
<script type="text/javascript">
function showHideGB(){
var gb = document.getElementById("gb");
var w = gb.offsetWidth;
gb.opened ? moveGB(0, 30-w) : moveGB(20-w, 0);
gb.opened = !gb.opened;
}
function moveGB(x0, xf){
var gb = document.getElementById("gb");
var dx = Math.abs(x0-xf) > 10 ? 5 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
gb.style.right = x.toString() + "px";
if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 10);}
}
</script>
<div id="gb">
<div class="gbtab" onclick="showHideGB()"> </div>
<div class="gbcontent">
Silakan Pasang Kode Buku Tamu yang sudah di copy tadi Di Sini
<div style="text-align:right">
<a href="http://jasapembuatanblog-murah.blogspot.com/2011/12/cara-membuat-buku-tamu-di-blogspot.html">[get this widget]</a>><a href="javascript:showHideGB()">
[Tutup]
</a>
</div>
</div>
</div>
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (30-gb.offsetWidth).toString() + "px";
</script></div></div>
Apabila sudah di paste jangan lupa di simpan “save” pekerjaan sobat. Dan lihat hasilnya.Bagaimana mudah bukan “Cara membuat buku tamu di blogspot”? Selamat mencoba....
Cara Membuat Burung Terbang Twitter Pada Blog
Inilah tutorial yang saya ingin sekali bagikan ke anda yaitu membuat flying twitter bird atau widget burung terbang twitter pada blog. Widget ini tentunya akan menarik perhatian pengunjung untuk menjadi follower anda. Widget yang lucu ini sangat menarik, karena burung twitter akan terbang kemanapun anda mengscroll halaman baik ke atas maupun ke bawah....he3 pokoknya lucu dan keren abis. Nah jika anda tertarik untuk membuatnya ikuti langkah berikut ini:
1. Login ke Blogger
2. Masuk ke Rancangan --> Edit Laman
3. Tambahkan Gadjet lalu pilih HTML/Javascript
4. Masukkan kode dibawah ini pada gadjet tersebut
5. Selanjutnya sobat ganti kode berwarna biru (blogtrikdantips) diatas dengan username twitter anda.
1. Login ke Blogger
2. Masuk ke Rancangan --> Edit Laman
3. Tambahkan Gadjet lalu pilih HTML/Javascript
4. Masukkan kode dibawah ini pada gadjet tersebut
<script type="text/javascript" src="http://imemovaz.googlecode.com/files/tripleflap.js"></script>
<script type="text/javascript">
var birdSprite="http://4.bp.blogspot.com/_9B1yqig9iAg/TVKEXsnAUMI/AAAAAAAAAII/o7TYnYBuC6k/s1600/birdsprite.png"; var targetElems=new Array("img","hr","table","td","div","input","textarea","button","select","ul","ol","li","h1","h2","h3","h4","p","code","object","a","b","strong","span"); var twitterAccount = "http://twitter.com/blogtrikdantips";var tweetThisText= "What up guys";tripleflapInit();
</script>
5. Selanjutnya sobat ganti kode berwarna biru (blogtrikdantips) diatas dengan username twitter anda.
6. Simpan Gadjet lalu lihat hasilnyaDemikian langkah-langkah membuat widget burung terbang twitter pada blog. Sobat dapat membuatnya diblog untuk menjadikan blog lebih menarik ketika dikunjungi. Sekian dan salam blogging...
Cara Membuat Jam dan Kalender
Mungkin berguna dech buat kamu yang pingin mempercantik tampilan blog kamu dengan jam dan kalender yang mempunyai berbagai model ga cuma monoton gitu-gitu aja, mau tahu caranya……simak ya tips berikut ini:
1. Silakan buka situs Widgia.com ato bisa langsung klik disini www.widgia.com
2. Setelah masuk anda akan disajikan pada berbagai macam bentuk jam dan kalender serta widget yang laen yang bentuknya unik-unik terserah mau pilih yang mana sesuai selera kamu
3. Setelah itu klik get this widgete
4. Maka akan muncul tampilan
5. setelah itu anda silakan pilih logo wordpress atau logo blog anda ->lalu isi sesuai dengan account anda di wordpress atau blog anda->setelah itu klik post-> maka souce kode nya akan dikirimkan ke postingan blog anda
6. sekarang langkah terakhir Login ke wordpress atau blog anda->sunting postingan yang tadi udah dikirim dari widgia.com->klik html->copy kode html nya->terus pilih menu tampilan->widget->tambahkan teksterus drag kesidebar->Paste kan-> selesai dan lihat hasilnya.
Langganan:
Postingan (Atom)
