Show/Hide Back toTop, Navigator dan Headline News

Hai Bloggersz,
Kali ini saya akan memposting Show/Hide Back to Top,Navigator, Dan Headline News. Maaf kalau panjang hehe :D . Kalian bisa melihat demonya yang ada nama show/hide Back to Top di samping kanan Blog ini. Maukan seperti itu nih saya kasih Tutorialnya langsung ke TKP :
1. Login Ke Blogger
2. Ke Rancangan
3. Edit HTML
4. Cari </body>
5. Taruh kode HTML ini di atas </body>

<div style='clear:both;'></div>
<div class='GRbottomToolbar' onmouseout='(this.style.bottom="-40px")' onmouseover='(this.style.bottom="0")'>
<b:section class='toolbarngisor' id='toolbarngisor' maxwidgets='1'/>
</div>

6. Sehabis itu, taruh css buat html tersebut di atas ]]&gt;&lt;/b:skin&gt; :

.box {width: 400px;height: 100px;margin: 0px auto;padding: 20px 10px;overflow: auto;}

7. Jika sudah di simpan dan kelangkah selanjutnya.
 Memasukkan CSS dan HTML Toolbarnya.
1. Jika tadi sudah di simpan, jangan kemana-mana dan tetap di ]]&gt;&lt;/b:skin&gt; .
2. Masukkan CSS lagi di atas ]]&gt;&lt;/b:skin&gt;
*{margin:0; padding:0}
.GRbottomToolbar{ position:fixed;  overflow:hidden;  text-align:left;  height:70px;  color:#000;  bottom:0;  margin:0;  padding:0;  width:100%;  -o-transition:all 08s ease-in;  -moz-transition:all 0.8s ease-in;  -webkit-transition:all 0.8s ease-in}
.toolbarcontrol{ position:absolute;  right:4px;  top:0; /* original code by:gubhugreyot.blogspot.com */ height:16px;  width:170px;  cursor:pointer;  border:1px solid #555;  border-bottom:0;  font-size:11px;  font-weight:bold;  font-family:Verdana;  text-align:left;   color:#930;  padding:5px 8px;  margin-left:5px}
.toolbarcontrol:hover{ color:#0CF}
.toolbarcontent{ margin-top:28px;  height:35px;  padding:4px 10px;  background:#ddd;  border:1px solid #777;  width:100%}
.toolbarcontent:hover{ opacity:1.0;  filter:alpha(opacity=100)}
.toolbarcontent a{ font-size:14px;  font-weight:bold;  text-decoration:none;  color:#036;  border-right:1px solid #888;  border-left:1px solid #888;  padding:1px 8px;  margin-right:10px}
.toolbarcontent a:hover{ color:#F00}
.toolbarcontrol a.btop{ display:block; /* original code by:gubhugreyot.blogspot.com */ position:absolute;  font-size:11px;  top:4px;  right:6px;  padding:1px 5px;  color:#000}
.toolbarcontrol a.btttop:hover{ color:#fff}
a.bttbot{ display:block;  float:right;  border-left:1px solid #777;  margin-right:23px}
3. simpan dan langsung pergi ke elemen laman.
4. lihat paling bawah template ada tempat add gadget.
5. klik add gadget dan pilih HTML/Javascript.
6. Masukkan kode di bawah ini
<div class='toolbarcontrol'>Show/Hide

<a class='btop' href='#'>Back to top</a>

</div>

<div class='toolbarcontent'>

<a href='URL' target='_blank'>NamaLink1</a>

<a href='URL' target='_blank'>NamaLink2</a>

<a href='URL' target='_blank'>NamaLink3</a>



<a class='bttbot' href='#'>back to top</a>

<!-- Bagian recent update marquee -->

<script style="text/javascript" src="http://digitalgupshup.110mb.com/DigitalGupshup_scrolling_blogger_posts.js"> </script><script style="text/javascript">var nMaxPosts = 25; var sBgColor; var nWidth; var nScrollDelay = 200; var sDirection="left"; var sOpenLinkLocation="N"; var sBulletChar="<font color='red' face='arial' style='font-size:12px;'><a href='http://tangerangblogs.blogspot.com' style='color:red;font-family:arial;font-size:12px;'><b>(TBNews)</b></a></font>"; </script> <script style="text/javascript" src="http://tangerangblogs.blogspot.com/feeds/posts/default?alt=json-in-script&callback=RecentPostsScrollerv2"> </script>

</div>
Yang warna merah di ganti dengan nama headline mu misalnya namanya tangerang blogs di singkat jadi TB dan sebagainya.
Yang warna kuning di ganti dengan Link blog mu
Yang warna Jingga/oranye diganti dengan URL
yang warna agak putih diganti dengan nama link
7. Simpan dan lihat hasilnya.
8. Semua cssnya dapat di ganti sesuai selera kalian :D

Akhir kata,
Semoga bermanfaat dan berguna bagi kalian yang mencarinya