Sebenarnya cara membuat link pada gambar atau tulisan itu hanya menggunakan sedikit kode html yang sangan mudah.Ok deh tidak usah berlama-lama kita langsung mulai saja tutorialnya.Kalau teman - teman masih pada bingung coba kalian lihat contoh dibawah ini kemudian klik gambarnya :
1. Upload Gambar yang kalian inginkan di image directory seperti http://pages.google.com/ atau http://www.photobucket.com/
2.
<a href="http://www.liveconnector.com/296786" target="new"><img src="http://www.liveconnector.com/images/promote/my_profile_blue.gif" border="0" alt="My Profile at LiveConnector"></a>
Ganti tulisan http://www.liveconnector.com/296786 yang berwarna merah dengan URL
yang kalian mau.
ganti juga tulisan http://www.liveconnector.com/images/promote/my_profile_blue.gif dengan URL gambar yang kalian upload lalu ganti judul tulisan My Profile at LiveConnector dengan judul yang kalian mau.
lalu kalau ingin membuat link pada tulisan kalian tinggal merubah tulisan yang berwarna merah yaitu dengan <a href="http://klinik-tutorial.blogspot.com/ target="new" title="Dinas Kesehatan Blog">Resep Blog</a>
Selamat mencoba
Kali ini saya akan memberikan tutorial bagaimana cara membuat Artikel Yang Berhubungan atau sering disebut dengan RElated Post atau kalau kalian masih bingung coba kalian lihat contohnya ini :
Ok langsung saja kita mulai tutorialnya :
1. Sign in Blogger
2. Layout
3. Edit HTML
4. Jangan lupa berikan tanda centang pada Expand Widget Templates
5. Copy kode ini :<b:if cond='data:blog.pageType == "item"'>
<div class='similiar'>
<div class='widget-content'>
<h3>Related Posts by Categories</h3>
<div id='data2007'/><br/><br/>
<script type='text/javascript'>
var homeUrl3 = "<data:blog.homepageUrl/>";
var maxNumberOfPostsPerLabel = 4;
var maxNumberOfLabels = 10;
maxNumberOfPostsPerLabel = 100;
maxNumberOfLabels = 3;
function listEntries10(json) {
var ul = document.createElement('ul');
var maxPosts = (json.feed.entry.length <= maxNumberOfPostsPerLabel) ?
json.feed.entry.length : maxNumberOfPostsPerLabel;
for (var i = 0; i < maxPosts; i++) {
var entry = json.feed.entry[i];
var alturl;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
alturl = entry.link[k].href;
break;
}
}
var li = document.createElement('li');
var a = document.createElement('a');
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 < json.feed.link.length; l++) {
if (json.feed.link[l].rel == 'alternate') {
var raw = json.feed.link[l].href;
var label = raw.substr(homeUrl3.length+13);
var k;
for (k=0; k<20; k++) label = label.replace("%20", " ");
var txt = document.createTextNode(label);
var h = document.createElement('b');
h.appendChild(txt);
var div1 = document.createElement('div');
div1.appendChild(h);
div1.appendChild(ul);
document.getElementById('data2007').appendChild(div1);
}
}
}
function search10(query, label) {
var script = document.createElement('script');
script.setAttribute('src', query + 'feeds/posts/default/-/'
+ label +
'?alt=json-in-script&callback=listEntries10');
script.setAttribute('type', 'text/javascript');
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 = "<data:label.name/>";
var test = 0;
for (var i = 0; i < labelArray.length; i++)
if (labelArray[i] == textLabel) test = 1;
if (test == 0) {
labelArray.push(textLabel);
var maxLabels = (labelArray.length <= maxNumberOfLabels) ?
labelArray.length : maxNumberOfLabels;
if (numLabel < maxLabels) {
search10(homeUrl3, textLabel);
numLabel++;
}
}
</b:loop>
</b:loop>
</script>
</div>
</div>
</b:if>
6. Paste kode diatas tepat di bawah kode ini <data:post.body/>
Kalau kalian pakai Readmore taruh kode diatas tepat di bawah kode yang pertama bukan yang kedua.
7. Save dan lihat hasilnya
Jika kalian ingin mengganti namanya tinggal klik layout kemudian edit HTML lalu cari tulisan ini "Related Posts by Categories" kemudian ganti dengan sesuai keinginan kalian.
Apa kalian pernah melihat Blog yang di backgroundnya ada efek2 salju seperti contoh blog ini Nah kalau sudah kali ini saya akan memberikan tutorial bagaimana cara membuat efek salju pada BLog atau website kita.Ok deh langsung saja kita mulai tutorialnya :
1. Sign in di Blogger
2. Kemudian pilih layout
3. Tambahkan Elemen HTML / Javascript
4. Copy dan paste kode dibawah ini :
/***********************************************
* Diambil dari Klinik BLog
* Snow Effect without images-by Kurt Grigg at http://www.btinternet.com/~kurt.grigg/javascript
* Script featured & available at Dynamic Drive at http://www.dynamicdrive.com/
* Please keep this notice intact
***********************************************/
</script>
Apa kalian pernah melihat blog yang seperti dibawah ini :
Ini dinamakan Kotak Komentar terbaru di blogger. Dulu kelemahan dari BLogger adalah dalam hal memberikan comment yang terlalu susah dan ribet tapi kali ini Blogger sudah menutupi kelemahannya.Oke deh langsung saja kita mulai tutorialnya :
1. Sign in http://draft.blogger.com/
2. Pilih setting kemudian pilih comment
3. Pilih Embed Below post pada kotak Comment Form Placement
4. Klik Save dan lihat hasilnya
Jika masih belum ada kotak komentarnya di bawah postingan coba pakai cara ini :
cari kode ini :
kemudian ganti dengan kode ini :
Yahoo Emotion merupakan ekspresi-ekspresi seseorang yang biasa kita lihat di Yahoo Messenger atau yang biasa kita lihat di blog atau website.Kalo kalian masih bingung coba kalian lihat yang ini :
Ok deh langsung saja kita mulain tutorialnya :
1. Setting dulu kotak komentar anda di bawah postingan. Kalo masih bingung coba kalian klik ini
2. Layout
3. Edit HTML
4. Jangan lupa berikan tanda centang pada Expand Widget Templates
5. Masukan kode di bawah ini dan taruh diatas kode :
type='text/javascript'/>
6. Lalu untuk menaruh Javascript emotion nya di bawah postingan kalian cari kode :
<p
class='comment-footer'>
7. Kemudian masukan kode di bawah ini tepat di bawahnya :
:))
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/100.gif'/>
:)]
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/71.gif'/>
;))
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/5.gif'/>
;;)
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/4.gif'/>
:D
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/3.gif'/>
;)
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/10.gif'/>
:p
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/20.gif'/>
:((
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/1.gif'/>
:)
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/2.gif'/>
:(
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/8.gif'/>
:X
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/12.gif'/>
=((
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/13.gif'/>
:-o
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/7.gif'/>
:-/
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/11.gif'/>
:-*
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/22.gif'/>
:|
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/35.gif'/>
8-}
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/102.gif'/>
~x(
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/104.gif'/>
:-t
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/66.gif'/>
b-(
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/62.gif'/>
:-L
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/14.gif'/>
x(
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/24.gif'/>
=))</b>
8. Save Changes dan lihat hasilnya.
