Menampilkan Title Post Pada Title Bar

Assalaualaikum , Kali ini MSue ingin berkongsi ngan korang bagaimana hendak menampilkan Title Post Pada Title Bar blog korang .

1. Login ke Blogspot .

2. Klik Layout - Edit HTML(Tandakan pada kotak Expand widget)

3. Cari kod di bawah .

<title><data:blog.pagetitle/></title>

4. Gantikan kod tersebut ngan kod di bawah ini

<b:if cond="’data:blog.pageType">
<title><data:blog.title/></title>
<b:else>
<title><data:blog.pagename/></title>
</b:else>
</b:if>

5. Preview dan Save template .


Via - Antoxide

Membuat Hide/Show Url atau Elements

Assalamualaikum , Petang ini Msue ingin berkongsi ngan korang bagaimana hendak membuat Show/Hide Url atau Elements . Ia macam dropdown menu tetapi yang ini menggunakan fungsi hide/show . Korang boleh gunakan untuk meletakkan korang punya link list ataupun element tertentu untuk menjimatkan ruang di sidebar korang .

1. Login ke Blogspot .

2. Klik Layout - Edit HTML(Tandakan pada kotak Expand widget)

3. Cari kod di bawah .

</head>

4. Pastekan kod di bawah ini di atas atau sebelumnya .

<style type="text/css">
.texthidden {display:inline}
.shown {display:block}
</style>


<script type="text/javascript">
document.write('<style>.texthidden {display:none} </style>');
</script>


<script type="text/Javascript">
function expandcollapse (postid) {
whichpost = document.getElementById(postid);
if (whichpost.className=="shown") {
whichpost.className="texthidden";
}
else {
whichpost.className="shown";
}
}
</script>

5. Preview dan Save template .

6. Klik pada Add a Gadget - HTML/Javascript .

7. Masukkan kod di bawah ke dalamnya .

<ul><a href="javascript:void(0);" onclick="expandcollapse('KEYWORD')"> [+/-] Kategori</a></ul>

<ul class="texthidden" id="KEYWORD">

<li><a href="http://linkataulinkelement.com">NAMA LINK ATAU NAMA ELEMENT 1</a></li>

<li><a href="http://linkataulinkelement.com">NAMA LINK ATAU NAMA ELEMENT 2</a></li>

<li><a href="http://linkataulinkelement.com">NAMA LINK ATAU NAMA ELEMENT 3</a></li>

<li><a href="http://linkataulinkelement.com">NAMA LINK ATAU NAMA NAMA ELEMENT 4</a></li>

<li><a href="http://linkataulinkelement.com">NAMA LINK ATAU NAMA ELEMENT 5</a></li>

</ul>

Note: Highlight merah - tukarkan yang bersesuaian , Highlight biru -Pada perkataan KEYWORD Gantikan ngan keyword korang sendiri(pastikan keywordnya sama)


Via - Muncet

Membuat DropDown Menu Untuk URL

Assalamualaikum , MSue ingin berkongsi ngan korang bagaimana hendak membuat DropDown Menu Untuk URL untuk menjimatkan ruang pada sidebar blog korang .

1. Login ke Blogspot .

2. Klik Layout - Add a Gadget - HTML/Javascript .

3. Copy kod di bawah .

<!--script from http://www.antoxite.co.cc-->
<form name="dropdown">
<div align="center">
<select name="url" size="1" onChange="window.open(this.options[this.selectedIndex].value,'_top')">
<!--MASUKKAN NAMA MENU DROPDOWN ANDA-->
<option selected>Nama Menu</option>
<!--MASUKKAN ALAMAT YANG AKAN DITUJU!-->
<option value="http://www.msueroomz.blogspot.com">NAMA WEB 1</option>
<option value="http://www.msueroomz.blogspot.com">NAMA WEB 2</option>
<option value="http://www..blogspot.msueroomzcom">NAMA WEB 3</option>
<option value="http://www.msueroomz.blogspot.com">NAMA WEB 4</option>
<option value="http://www.msueroomz.blogspot.com">NAMA WEB 5</option>
<option value="http://www.msueroomz.blogspot.com">NAMA WEB 6</option>
</select>
</div>
</ form>

4. Pastekan ke dalamnya .

5. Save dan Preview .

Note 1 : Highlight merah - url yang korang nak letak , biru - nama url yang korang letak tu , hijau - Nama untuk dropdown menu itu .

Note 2 : Jika korang hendak menambah lagi url ke dalam dropdown tersebut , korang just tambahkan <option value="http://www.msueroomz.blogspot.com">NAMA WEB</option&gt;

CONTOH

<!--script from http://www.antoxite.co.cc-->
<form name="dropdown">
<div align="center">
<select name="url" size="1" onChange="window.open(this.options[this.selectedIndex].value,'_top')">
<!--MASUKKAN NAMA MENU DROPDOWN ANDA-->
<option selected>Nama Menu</option>
<!--MASUKKAN ALAMAT YANG AKAN DITUJU!-->
<option value="http://www.msueroomz.blogspot.com">NAMA WEB 1</option>
<option value="http://www.msueroomz.blogspot.com">NAMA WEB 2</option>
<option value="http://www.msueroomz.blogspot.com">NAMA WEB 3</option>
<option value="http://www.msueroomz.blogspot.com">NAMA WEB 4</option>
<option value="http://www.msueroomz.blogspot.com">NAMA WEB 5</option>
<option value="http://www.msueroomz.blogspot.com">NAMA WEB 6</option>
<option value="http://www.msueroomz.blogspot.com">NAMA WEB</option>
</select>
</div>
</ form>

Note: highlight merah adalah url yang di tambah .

Selamat mencuba .

Via - Antoxite

Memasang Simple Bookmark

Assalamualaikum dan salam sejahtera kepada semua . Sebelum ini MSue ada membuat Tutorial Page Peel Social Bookmark . Kali ini MSue ingin berkongsi ngan korang bagaimana memasang Bookmark yang jenis biasa dan ringkas pada setiap ruangan posting korang .Mari kita lihat bagaimana caranya .




1. Pergi ke web ADDTHIS .

2. Pilih button Bookmark yang korang suka .

3. Pada pertanyaan Where itu korang pilih on blog .





4. Klik Get Your Botton Code .

Note: Jika korang belum mendaftar, klik register untuk mendaftar .

5. Copy kod yang ada di bahagian bawah .


Cara untuk meletakkan di setiap posting korang .


1. Login ke Blogspot seperti biasa .

2. Klik Layout - Edit HTML(Tandakan pada kotak Expand widget) .

3. Cari kod di bawah(Gunakan Ctrl + F untuk memudahkan korang mencarinya)

<div class='post-footer'>

4. Paste kod yang korang copy tadi di atas kod tersebut .

5. Preview dan Save template .


Via - Antoxite

Membuat Langganan Artikel via E-mail

Assalamualaikum dan salam sejahtera kepada korang sume . Kali ini MSue ingin berkongsi lagi ngan korang bagaimana hendak membuat Langganan Artikel via E-mail atau dalam bahasa omputihnye "E-mail Subscribe" . Kebaikan "E-mail Subscribe" ini pengunjung blog korang boleh melanggan setiap artikal yang korang paparkan secara automatik di email mereka .Mari kita nengok bagaimana membuatnye .



1. Pergi ke web Feedburner

2. Masukkan url feed korang atau url korang bagi yang belum register untuk feed .

Contoh : http://www.msueroomz.blogspot.com/feeds/posts/default.
Note:Pada highlight merah tukarkan dengan url blog korang .

3. Klik Next (jangan tandakan pada kotak I am podcaster) .

4. Korang akan jumpa "Welcome! Let us burn a feed for you", isi pada kotak yang tersedia .

5. Klik Activate Feed .

6. Klik Skip directly to feed management.

7. Pilih Tab Publicize .

6. Pilih E-mail Subscription pada sidebar kiri .

7. Klik Activate .

8. Copy kod pada kotak Subscription Form Code .


Cara untuk memasang di blog korang pula.

1. Login ke Blogspot seperti biasa .

2. Klik layout - Add a Gadget - HTML/JavaScript .

3. Masukkan kod yang korang copy tersebut ke dalamnya .

4. Save dan Preview .


Via - Antoxite

Membina (Page Peel)

Assalamualaikum , pagi yang ceria dan baik ini MSue ingin berkogsi ngan korang bagaimana Membina Page Peel atau dengan bahasa mudah Muka Surat Selak pada bahagian atas penjuru blog korang .

1. Login ke Blogspot seperti biasa .

2. Klik Layout - Edit HTML(Tandakan pada kotak Expand widget)

3. Cari kod di bawah (Gunakan Ctrl + F untuk memudahkan korang mencari)

]]></b:skin>

4. Pastekan kod di bawah ini di bawah kod tersebut

<style type='text/css'>
img { behavior: url(iepngfix.htc) }
#pageflip {
position: relative;
right: 0; top: 0;
float: right;
}
#pageflip img {
width: 50px; height: 52px;
z-index: 99;
position: absolute;
right: 0; top: 0;
-ms-interpolation-mode: bicubic;
}
#pageflip .msg_block {
width: 50px; height: 50px;
overflow: hidden;
position: absolute;
right: 0; top: 0;
background: url(http://1.bp.blogspot.com/_LZtXSNcp76A/SwfKGkyNaMI/AAAAAAAAAmA/4MybL0iiLcQ/s320/PageSubscribe.png) no-repeat right top;
}
</style>

<script src='http://code.jquery.com/jquery-latest.js' type='text/javascript'/>
<script type='text/javascript'>
$(document).ready(function(){

//Page Flip on hover

$(&quot;#pageflip&quot;).hover(function() {
$(&quot;#pageflip img , .msg_block&quot;).stop()
.animate({
width: &#39;307px&#39;,
height: &#39;319px&#39;
}, 500);
} , function() {
$(&quot;#pageflip img&quot;).stop()
.animate({
width: &#39;50px&#39;,
height: &#39;52px&#39;
}, 220);
$(&quot;.msg_block&quot;).stop()
.animate({
width: &#39;50px&#39;,
height: &#39;50px&#39;
}, 200);
});


});
</script>

5. Cari kod ini di bawah ini pula .

<body>

6. Pastekan kod dibawah ini di bawah kod tersebut .

<div id='pageflip'>
<a href='http://feeds2.feedburner.com/msueroomz'><img alt='' src='http://4.bp.blogspot.com/_LZtXSNcp76A/SwfKDG6SAhI/AAAAAAAAAl4/GT-uqh6aeOo/s320/pageflip.png'/></a>
<div class='msg_block'/>
</div>

Note: Pada highlight biru tukarkan dengan image pilihan korang sendiri , highlight merah korang tukarkan dengan url pilihan korang .

Via - NescafeAis