Mengabarkan Tentang Sesuatu Untuk Kita

Laman

Membuat navigasi breadcrumb versi 2

Trik blogging - Sebagai kelanjutan dari posting sebelumnya yaitu  membuat navigasi breadcrumb versi 1,  kali ini ane akan share versi ke 2 nya.

Sebelum kita mulai, pernahkah sobat mengalami hal ini?

1. Template eror ketika memasang breadcrumb
2. Template tidak eror tapi breadcrumbnya tidak muncul.

Oke! mari kita lanjut.
Dalam memasang breadcrumb, poin yang pertama umumnya sangat jarang terjadi, penyebabnya hanyalah salah meletakkan kode atau tidak menuliskan kode secara lengkap ( terutama tag pembuka dan penutup  )
Poin yang kedua, umumnya terjadi pada blog dengan template MINIMA /modifikasi minima. Mengapa?
saya sendiri juga tidak tahu.. maklum, ane masih belajar. hehehe

Bagi anda pecinta template minima yang ingin buat breadcrumb navigasi akan ane kasi tutorialnya. karna itu tanpa berlambat waktu kita langsung saja.. Oke!!

1. Pertama log in dulu ke akun blog sobat.
2. Klik rancangan --> edit html --> centang kotak expand template widget.
3. Klik download template lengkap untuk mencegah terjadinya eror pada template.
4. Letakkan kode berikut di atas kode ]]></b:skin>.
.breadcrumbs {
padding:10px;
margin: 10px;
border:1px solid #000000;
font-size:95%;
line-height: 1.4em;
border-bottom:3px double #e6e4e3;
}
5. Cari kode  <b:includable id='post' var='post'> ( Gunakan Ctrl + F untuk memudahkan pencarian )
6. Letakkan kode berikut tepat di BAWAHNYA.
<b:if cond='data:blog.homepageUrl == data:blog.url'>
<b:else/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='breadcrumbs'>

Browse &#187; <a expr:href='data:blog.homepageUrl' rel='tag'>Home</a>
<b:loop values='data:posts' var='post'>
<b:if cond='data:post.labels'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast == &quot;true&quot;'> &#187;
<a expr:href='data:label.url' rel='tag'><data:label.name/></a>
</b:if>
&#187; <span><data:post.title/></span>
</b:loop>
</b:if>
</b:loop>

</div>
</b:if>
<b:else/>
<b:if cond='data:blog.pageType == &quot;archive&quot;'>
<div class='breadcrumbs'>
Browse &#187; <a expr:href='data:blog.homepageUrl'>Home</a> &#187; Archives for <data:blog.pageName/>
</div>
</b:if>
<b:else/>
<b:if cond='data:navMessage'>
<div class='breadcrumbs'>
<data:navMessage/>
</div>
</b:if>
</b:if>
7. Dan yang terakhir simpan template.


Semoga bermanfaat.

Share:

Tips menghias blog

Tips Menghias Blog - Hiasan adalah hal yang mutlak di perlukan dalam hal mempercantik. bayangkan aja jika artis tanpa make up,, pasti kacau kan? Kali ini ane akan kasih tips untuk sobat - sobat tentang cara menghias blog yang baik meskipun tidak selalu benar... Hehehe.

Sebelum kita menghias, terlebih dahulu kita cari tahu dulu makna kata Hias. Menghias berarti mendandani, mempercantik dan lain sebagainya yang nampak oleh indra.  Ada ungkapan yang berkata bahwa " Cantik di dalam adalah lebih baik dari pada cantik dari luar" ... Ya... memang benar, dan ungkapan tersebut juga berlaku dalam mendesain blog. Hiasan sebanyak apapun, se indah apapun takkan berarti jika tidak di dukung dengan konten yang berkualitas. (yang pasti hasil arya sendiri alias bukan COPAS)

Banyak sekali  hiasan ( widget ) yang di sediakn gratis di dunia maya.. sobat bisa memasang jam, kalender, chatbox, counter, dan lain - lain di blog sobat dengan sangat mudah. Ada pula yang di sediakan pihak blogger meski dalam tampilan yang kurang menarik.

Saran gua..

1. Gunakanlah hiasan tersebut jika sangat di perlukan.

2. Hias blog anda dengan 2 hingga 4 warna saja supaya tidak kelihatan norak. Misalnya warna background abu-abu dengan outer wrapper berwarna putih.

3. Gunakan warna background  terang di balik tulisan gelap dan jangan sebaliknya, karna konon mata manusia lebih suka yang begitu.

4.Jangan menggunakan widget yang terlalu berat.

5. Gunakan Fungsi scroll atau spoiler pada widget yang tampil terlalu tinggi. misalnya pada arsip.

6. Minimkan widget di Halaman posting. widget yang tidak ingin di tampilkan tersebut bisa di tampilkan di homepage. Caranya bisa di baca di artikel ini _menampilkan widget hanya di postingan atau homepage

7. Pasang daftar isi di dalam postingan dan bukan di sidebar.

8. Sering - sering berkunjung ke blog yang populer dan lihat widget yang di gunakan.

9. Yang terakhir, rajin - rajinlah blogwalking dan saling sharing dengan blogger - blogger lain. gunakan media   forum, jejaring sosial, social bookmark dan lain - lain  yang menjamur di dunia maya untuk wadah promosi blog kamu. ( maaf yang ini sedikit melenceng) HEHEHE
Share:

SMP N 1 TATELU

Menjadi manusia yang sukses di awali atas tekat yang kuat, semangat yang membara, serta skill yang menunjang. Menyimak kata di atas, membawa saya teringat akan ucapan guru saya waktu SMP.
Semasa SMP saya bersekolah di SMP N 1 TATELU, satu - satunya sekolah yang paling banyak di minati dari desa Klabat hingga Tetey dan Matungkas hingga Lumpias. Kualitas pendidikan yang baik, mengantarkan sekolah ini masuk dalam sekolah yang paling di favoritkan dan terkenal di minahasa utara.

Tujuan saya memposting artikel ini seraya berbagi pada sobat blogger, terutama yang merasa alumni dari SMP N 1 TATELU, dengan harapan "sejauh apapun dan setinggi apapun engkau meraih impianmu", jangan engkau sekali - kali melupakan apa yang pernah terjadi dan kau alami di Sekolah ini


Untuk sementara di artikel ini tidak ada foto albumnya.. Jika ada di antara teman yang memiliki album foto SMP N1 TATELU bisa sobat kirimkan di alamt FB saya di http://www.facebook.com/csnice
Share:

Menambah 2 kolom di bawah sidebar utama

Tutorial blogspot - Waw cerahnya pagi ini... secerah hatiku. Karena itu kali ini aku semangat sekali bagi - bagi info untuk sobat. Setelah sebelumnya abang CHRIS ( itu nama ane bro... Sekedar perkenalan. hehehe ) memposting tentang cara membuat spoiler pada widget sidebar tanpa edit HTML, kali ini masih seputar Sidebar. Yaitu bagaimana Menambah 2 kolom di bawah sidebar utama.

Tanpa berlambat - lambat waktu kita langsung saja ke cara pasangnya. Oke!!

1. Pertama sobat login dulu ke akun blog sobat.
2. Kemudian klik Rancangan ---> edit HTML
3. Cari kode yang mirip dengan kode berikut

#sidebar-wrapper {
width: 300px;
float: $endSide;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}

Tmbhn
Ganti kode width : 350px; dengan nilai atau lebar dari sidebar blog sobat dan float : $endside; dengan letak sidebar sobat.
 $endside  sama dengan Right(kanan)
 $starside sama dengan left(kiri)

 Perhatikan!
Untuk menambah 2 sidebar di bawah sidebar utama sobat harus memprehatikan lebar dari sidebar utama. dengan kata lain jika lebarnya 300 maka untuk 2 kolom baru  di bawahnya dibagi 2 yaitu menjadi 150px; jarak antara kedua sidebar adalah 10px;
maka hasilnya yaitu 145px;. Oke!! udah jelaskan? ayo ita lanjut.

4.Letakkan kode berikut dibawah kode nomor 3.
#left-col {
width:145px;
float:left;
word-wrap:break-word;
overflow:hidden;
}
#right-col {
width:145px;
float:right;
word-wrap:break-word;
overflow:hidden;
}

  Hasilnya akan seperti ini:
#sidebar-wrapper {
width: 350px;
float: right;
$startSide
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}
#left-col {
width:145px;
float:left;
word-wrap:break-word;
overflow:hidden;
}
#right-col {
width:145px;
float:right;
word-wrap:break-word;
overflow:hidden;
}

5. Kemudian cari kode berikut
<div id='sidebar-wrapper'>
<b:section class='sidebar' id='sidebar' preferred='yes'/>
<b:widget id= blablabla....
</b:section>
</div>



6.Copy kode berikut.
<b:section class='sidebar' id='left-col' preferred='yes'/>
<b:section class='sidebar' id='right-col' preferred='yes'/>

7. Letakkan di antara kode seperti di bawah ini

<div id='sidebar-wrapper'>
<b:section class='sidebar' id='sidebar' preferred='yes'/>
<b:widget id= blablabla..../>
</b:section>
<b:section class='sidebar' id='left-col' preferred='yes'/>
<b:section class='sidebar' id='right-col' preferred='yes'/>
</div>

8. Simpan template. Kemudian klik ELEMEN LAMAN
Jika tepat maka hasilnya akan seperti ini;











SELESAI...
SEMOGA MEMBANTU
Share:

Membuat menu horisontal animasi menyamping ( KWICKS )

Tutorial blogspot - Setelah sebelumnya ane pernah memposting Cara membuat menu accordion di blogspot, kali ini ane akan kasih kalian tips yang lebih keren.
Masih seputar trik blogger, saya yakin bagi para sobat yang suka blog walking pasti sobat pernah melihat yang sepeti ini:




Cara kerjanya, ketika pointer mouse menyentuh salah satu menu, maka akan terlihat gmbar yang keluar menyemping dari menu tersebut.

Untuk melihat demonya, Klik DEMO

nah.. bagaiman sobat blogger.. ! udah ngerti kan??
Sekarang kita bahas cara pasangnya.

1. Pertama login dulu ke akun blog sobat.
2. Klik rancangan ---> Edit HTML
3. Cari kode ]]></b:skin>. ( gunakan ctrl+f untuk memudahkan pencarian)
     Letakkan kode berikut di atasnya.

.kwicks{height:50px;list-style:none;margin:0;padding:0;position:relative;width:840px;z-index:2
}
.kwicks li{cursor:pointer;display:block;float:left;height:50px;overflow:hidden;padding:0;width:120px;z-index:2}
.kwicks li a{background-image:url(http://4.bp.blogspot.com/-e1c5hdvd0MQ/TbgSHi-7EEI/AAAAAAAAAzs/Y9aTBHEgh84/s1600/menu%2Bjquery%2Bpelajaran%2Bblog.jpg
);background-repeat:no-repeat;cursor:pointer;display:block;height:50px;outline:none;text-indent:-9999px;z-index:2}
#kwick1 a:hover{background-position:0 -50px!important}
#kwick2 a{background-position:-190px 0}
#kwick2 a:hover{background-position:-190px -50px!important}
#kwick3 a{background-position:-380px 0}
#kwick3 a:hover{background-position:-380px -50px!important}
#kwick4 a{background-position:-570px 0}
#kwick4 a:hover{background-position:-570px -50px!important}
#kwick5 a{background-position:-760px 0}
#kwick5 a:hover{background-position:-760px -50px!important}
#kwick6 a{background-position:-950px 0}
#kwick6 a:hover{background-position:-950px -50px!important}
.kwicks li ul a{float:left;width:12em}
.kwicks ul ul{top:auto}
.kwicks li ul ul{left:12em;margin:0 0 0 10px}
.kwicks li:hover ul,#nav li li:hover ul,#nav li li li:hover ul,#nav li li li li:hover ul{display:block
}


4. Kemudian cari kode </head> dan letakkan kode berikut di atasnya.

<script src='http://pelajarandashblogdotblogspotdotcom.googlecode.com/files/jquery-1.2.3.js' type='text/javascript'/>
<script src='http://pelajarandashblogdotblogspotdotcom.googlecode.com/files/jquery.kwicks-1.5.1.js' type='text/javascript'/>
<script src='http://pelajarandashblogdotblogspotdotcom.googlecode.com/files/jquery.easing.1.3.js' type='text/javascript'/>

5. Dan yang terakhir, copy kode berikut
<div class='kwickswrap'>
<ul class='kwicks'>
<li id='kwick1'><a href='http://christiantatelu.blogspot.com/' title='halaman utama'>Home</a></li>
<li id='kwick2'><a href='http://christiantatelu.blogspot.com/search' title='daftar isi.'>Blog</a></li>
<li id='kwick3'><a href='http://christiantatelu.blogspot.com/2009/02/profil.html' title='about'>About</a></li>
<li id='kwick4'><a href='#' title='futures'>Portfolio</a></li>
<li id='kwick5'><a href='#' title='contact us'>Contact</a></li>
<li id='kwick6'><a href='http://christiantatelu.blogspot.com/' title='recomended links'>Resource</a></li>
</ul>
</div>
</td>
<script type="text/javascript">
$().ready(function() {
$('.kwicks').kwicks({
max : 190,
duration: 800,
easing: 'easeOutQuint'
});
});
</script>

6. Cari kode di bawah ini dengan menggunakan Ctrl+F
perhatikan pada kode yang berwarna merah.

<div id='header-wrapper'>
      <b:section class='bla .... bla ........... bla    >
<b:widget id='bla......bla......... bla       '/>
</b:section>

Letakan kodenya nomor 5 di sini !

</div>


7. Maka hasilnya akan seperti ini


<div id='header-wrapper'>
      <b:section class='bla .... bla ........... bla    >
<b:widget id='bla......bla......... bla       '/>
</b:section>
<div class='kwickswrap'>
<ul class='kwicks'>
<li id='kwick1'><a href='http://christiantatelu.blogspot.com/' title='halaman utama'>Home</a></li>
<li id='kwick2'><a href='http://christiantatelu.blogspot.com/search' title='daftar isi.'>Blog</a></li>
<li id='kwick3'><a href='http://christiantatelu.blogspot.com/2009/02/profil.html' title='about'>About</a></li>
<li id='kwick4'><a href='#' title='futures'>Portfolio</a></li>
<li id='kwick5'><a href='#' title='contact us'>Contact</a></li>
<li id='kwick6'><a href='http://christiantatelu.blogspot.com/' title='recomended links'>Resource</a></li>
</ul>
</div>
</td>
<script type="text/javascript">
$().ready(function() {
$('.kwicks').kwicks({
max : 190,
duration: 800,
easing: 'easeOutQuint'
});
});
</script>


    </div>

8. yang terakhir sobat tinggal simpan templatenya.

SEMOGA BERMANFAAT
Share:

Memasang widget "Do You Like This Story" di bawah postingan

Trik blogspot- Mumpung ane lagi lowong, ni ane ada tips buat sobat blogger. Sebelum memulai tutorialnya, saya terlebih dahulu berterima kasih kepada pemilik blog http://www.mybloggertricks.com yang merupakan sumber dari artikel ini.
Baiklah sobat - sobat, kita langsung saja.

1. Pertama sobat login dulu ke akun blog sobat.
2. Klik rancangan>edit HTML> Centang kotak Expand Template widget
3. Cari kode <data:post.body/>
4. Letakkan kode berikut di bawah kode nomor 3

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style>
form.emailform{
margin:20px 0 0;
display:block;
clear:both;
}
.mbttext{
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhZDor0iH8gjXnLqQX2xDYmhyphenhyphen4pxn4pxk6A-bApU5m1J9938WQ6fC3fRBj916dorp1S5JC-AMGM90lYh3iyroSrkKC_9VY7H3X6hr9vMZ6k5Nlet9dxhWNmKnI3iN0l5W6KW7VFOWC26D1F/s28/w2b-mail.png) no-repeat scroll 4px center transparent;
padding:7px 15px 7px 35px;
color:#666;
font-weight:bold;
text-decoration:none;
border:1px solid #D3D3D3;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;
-moz-box-shadow: 1px 1px 2px #CCC inset;
-webkit-box-shadow: 1px 1px 2px #CCC inset;
box-shadow: 1px 1px 2px #CCC inset;
}
.mbtbutton{
color:#666;
font-weight:bold;
text-decoration:none;
padding:6px 15px;
border:1px solid #D3D3D3;
cursor: pointer;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
-goog-ms-border-radius: 4px;
border-radius: 4px;
background: #fbfbfb;
background: -moz-linear-gradient(top, #fbfbfb 0%, #f4f4f4 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fbfbfb), color-stop(100%,#f4f4f4));
background: -webkit-linear-gradient(top, #fbfbfb 0%,#f4f4f4 100%);
background: -o-linear-gradient(top, #fbfbfb 0%,#f4f4f4 100%);
background: -ms-linear-gradient(top, #fbfbfb 0%,#f4f4f4 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr=&#39;#FBFBFB&#39;, endColorstr=&#39;#F4F4F4&#39;,GradientType=0 );
background: linear-gradient(top, #fbfbfb 0%,#f4f4f4 100%);
}
#doulike-outer {
-moz-border-radius: 10px 10px 10px 10px;
-webkit-border-radius: 10px 10px 10px 10px;
-goog-ms-border-radius: 10px 10px 10px 10px;
border-radius: 10px;
background: none repeat scroll 0 0 transparent;
border: 1px solid #D3D3D3;
padding: 8px;
-moz-transition: all 0.3s ease-out;
-o-transition: all 0.3s ease-out;
-webkit-transition: all 0.3s ease-out;
-ms-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
width:480px;
}
#doulike-outer:hover{
background: none repeat scroll 0 0 #FFF;
-moz-box-shadow: 1px 1px 2px #CCC inset;
-webkit-box-shadow: 1px 1px 2px #CCC inset;
box-shadow: 1px 1px 2px #CCC inset;
}
#doulike-outer td{
padding:3px 0;
}
</style>
<div id='doulike-outer'>
<div id='doulike'>
<table width='100%'>
<tbody>
<span style='font-style: italic; font-size: 30px; font-family: arial,sans-serif, verdana;  color:#FF683F;'>Do you Like this story..?</span>
<tr>
<td>
<div id='fb-root'/><script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/><fb:like font='' href='' layout='button_count' send='true' show_faces='false' width='300'/>
</td>
</tr>
<tr>
<td align='left'> <p style='color:#666; font-style:italic; margin:0px 0px 5px 0px; '>Get Free Email Updates Daily!</p>
<form action='http://feedburner.google.com/fb/a/mailverify' class='emailform' method='post' onsubmit='window.open(&apos;http://feedburner.google.com/fb/a/mailverify?uri=tntbystc&apos;, &apos;popupwindow&apos;, &apos;scrollbars=yes,width=550,height=520&apos;);return true' style='margin: 0pt;' target='popupwindow'>
<input name='uri' type='hidden' value='tntbystc'/>
<input name='loc' type='hidden' value='en_US'/>
<input class='mbttext' name='email' onblur='if (this.value == &quot;&quot;) {this.value = &quot;Enter your email...&quot;;}' onfocus='if (this.value == &quot;Enter your email...&quot;) {this.value = &quot;&quot;}' type='text' value='Enter your email...'/>
<input alt='' class='mbtbutton' title='' type='submit' value='Submit'/>
</form>
</td>

<td><p style='color:#666; font-style:italic; margin:0px 0px 5px 0px;  '>Follow us!</p>
<a href='http://feeds.feedburner.com/TntByStc' rel='nofollow' target='_blank' title='Suscribe to RSS Feed'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhobvavP_mrRh1Qx3s16Axm3c_0zIorE6fcR7VTa0-RDDC7aCJM9H8V2EY0QIsUMpnctvJHu4rjk4jrAAIFSx5gc4MLh20JBoO9Jq5qDv3kbttHSBLtK1awhZ2SfXDxE9Y1PFZXQoaWzyvo/s40/w2bRSS+.png'/></a>
<a href='http://twitter.com/mybloggertricks' rel='nofollow' target='_blank' title='Follow us on Twitter'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg-B_pKPlBIeRoaxgnQDgPVL1U06bQk3Ph-USfnRROS7TYAMTUED6YKOGdwK7yhOBF4TxDXaYZR2jfoD6rw-9P4v02loLplVblJr1e3tQBRO_oAGfB83QZ5Aoc4wLGWvUhskgTv-1riSh9n/s40/w2bTwitter.png'/></a>
<a href='http://www.facebook.com/pages/My-Blogger-Tricks/147104632016744' rel='nofollow' target='_blank' title='Follow us on Facebook'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhiAMPwvZ6PxwcOvo-6-NcyrIwTA3XFABoIpce11IL7S9BEFl_hEez2Ln5KiaYn6YCJDdUUNb7l34Q-o5p3DLc0kvJZL8YPuV_T6efh8Tvn6Sq92qQFaCxTmvic2v0dGyEEFxxwGRzc6PpY/s40/w2bFaceBook.png'/></a>
</td>
</tr>
</tbody></table></div></div>
</b:if>




Ket:
Ubah #FF683F; dengan kode warna kesukaanmu. Untuk kode warnanya Klik di sini!

Sekarang ganti http://feedburner.google.com/fb/a/mailverify?uri=tntbystc dengan feed email milikmu.

Ganti Link oranye dengan feedburner anda
Ganti tulisan berwaran biru dengan link twitter anda misalnya http://www.twitter.com/deactivatednumi
 
Ganti tulisan berwarna ungu dengan link Facebook Anda Misalnya http://www.facebook.com/csnice


Jika berhasil, anda akan mendapat tampilan seperti ini di bawah postingan.

do you like this story? blogger widget


5. SELESAI!!!
  Semoga membantu





Share:

Membuat favicon animasi di blogspot

Trik blogspot-  Mau membuat gambar favicon anda bergerak(animasi)?  Caranya mudah kok! hanya beberapa langkah yang harus sobat lewati.  Tanpa mengulur waktu lagi, Lebih baik kita langsung saja ke TKPnya..

1.Pertama - tama yang sobat harus lakukan yaitu sobat harus mengunjungi Situs http://www.favicongenerator.org
2. kemudian scroll mouse hingga ke bagian bawah halaman. Maka sobat akan temukan tampilan seperti berikut

3. Klik pada tulisan browse, Kemudian masukan Gambar yang telah sobat sediakan sebelumnya
 di komputer sobat.
4. Masukkan Teks pada kotak Scrolling text(jika ada) digunakan untuk menghasilkan Favicon Teks Bergulir.
5. Setelah ikuti klik tulisan Generate favicon, maka akan tampil beberapa icon yang bisa sobat copy paste.
Caranya: klik kana pada mouse, klik Save Image As.
6. Upload gambar tersebut yang telah ada di komputer sobat ke Filehosting milik sobat. ( Photobucket,picasa web album dan lain - lain )
7. Ambil kode htmlnya.
8. Selanjutnya, login ke akun blog sobat
9. Klik rancangan --> edit HTML
10. Cari kode <head>
11.Letakan kode HTML yang di ambil dari file hosting tadi, diatasnya.
12.Dan selesai.

Bagaimana... Ribetkan? Okelah karena aku orangnya baik hati, ni gua kasih cara mudahnya. HEHEHE (bercanda)


1. login ke akun blog sobat.
2. Klik rancangan --> klik elemen laman
3. Cari tulisan Favicon tepatnya di bagian sudut kiri atas elemen laman, kemudian klik Edit.
4. Klik pada Tulisan Browse, kemudian otomatis akan di arahkan ke file yang di simpan di  komputer sobat.
5. Pilih gambar animasi favicon yang di download tadi.
6. Dan selesai sudah.

Gimana... mudah kan???
Share:

Cara memasang Mp3 di blogspot?

Tutorial blogspot - Masih mengenai perhiasan blog, kali ini ada trik yang harus sobat blogger coba. kita akan coba memasang Mp3 di blog. Widget kali ini mungkin akan menambah berat loading blog sobat tapi mungkin juga sebanding dengan hiburan bagi para pengunjung blog sobat. Karena itu ni ane kasih tutorialnya..

1. Pertama - tama sobat kunjungi dulu situs ini http://www.divine-music.info
2. Perhatikan pada sidebar kiri. Gambarnya seperti ini:
Home
Country Music
Hip Hop
Pop
Heavy Rock/Metal
R & B
Techno/Dance
Browse All
Amicons and Avatars
Glitter Lyrics
Myspace Layouts

3. Misalnya sobat memilih mp3 yang ber-genre R&B, maka tampilannya akan seperti berikut:



4. Misalnya, Sobat pilih Bruno mars maka akan muncul listnya beserta kode yang akan sobat pasang di widget sobat.
5. Copy kodenya, kemudian 
6. Masuk ke Dashboard blog sobat.
7. Klik  tata letak.
8. Klik add gadget.
9. Pilih html/java script.

10. Paste kode tadi, klik save.Nah.. selesai deh!!! semoga bermanfaat bagi sobat..


baca juga yah, artikel lain di blog ini.

Share:

POSTING TERBARU

Arsip Blog

Total Tayangan Laman

z

Tiket Pesawat Murah Ada: Disini

Sponsor

Sistema Enlaces Reciprocos
Code tukar link

Tampilan seperti ini: kabar berita