Tempatnya Download Aplikasi full Apk, Mod, Pro, Premium untuk semua Sahabat Android.

Tuesday, September 26, 2017

Tutorial Membuat Menu Tab Comel Di Tepi Blog

Screenshot Menu Tab Comel Di Tepi Blog

Tutorial

PS: PASTIKAN ANDA BACKUP DAHULU TEMPLATE BLOG ANDA UNTUK LANGKAH KESELAMATAN . Lihat sini >> 

1. Login ke akaun blogger anda.
2. Klik pada butang More Option dan klik Template

3. Klik Edit HTML

4. Klik pada ruang edit html dan tekan CTRL+F untuk paparkan ruang search

5. Cari (CTRL+F) kod dibawah:
]]></b:skin>
6Copy (CTRL+C) kod dibawah dan Paste (CTRL+V) sebelum kod " ]]></b:skin> :
/* Tab Menu Cute */
#tabmenucute { }
#tabmenucute ul { list-style:none;}
#tabmenucute ul li {
font-family:Georgia,serif,Times;
font-size:15px;margin:1px; }
#tabmenucute ul li a {
display:block;
width:80px;
height:28px;
background-color: #F03;
padding-left:20px;
border-radius: 1em 1em 1em 1em;
border: 1px solid #F00;
text-decoration:none;
color:#FFFFFF; }
#tabmenucute ul li a:hover {
-moz-transform:rotate(-5deg);
-moz-box-shadow:10px 10px 20px #FF0033;
-webkit-transform:rotate(-5deg);
-webkit-box-shadow:10px 10px 20px #FF0033;
transform:rotate(-5deg);
box-shadow:10px 10px 20px #FF0033; }
/* Tab Menu Cute */

7. Cari (CTRL+F) kod dibawah:
</body>
8. Copy (CTRL+C) kod dibawah
<div style='display:scroll; position:fixed; top:150px; left:-40px;'>
<div id='tabmenucute'>
<ul>
<li><a href='URL/LINK'>NAMA URL</a></li>
<li><a href='URL/LINK '>NAMA URL</a></li>
<li><a href='URL/LINK '>NAMA URL</a></li>
<li><a href='URL/LINK '>NAMA URL</a></li>
<li><a href='URL/LINK '>NAMA URL</a></li>
</ul>
</div>
</div>
Keterangan:
  • background-color: #F03; - Gantikan #F03 dengan kod warna bagi background tab menu .
  • padding-left:20px; - Gantikan nilai 20 untuk adjust posisi link anda.
  • border: 1px solid #F00; - Gantikan #F00 dengan kod warna bagi border .
  • URL/LINK - Gantikan dengan URL/LINK anda.
  • NAMA URL - Gantikan dengan NAMA URL anda.
9. Preview Template dan bila tiada error , Klik Save Template


#Selesai :)
Sumber https://faiz-tutorial.blogspot.co.id/

Share on Facebook
Share on Twitter
Share on Google+

Related : Tutorial Membuat Menu Tab Comel Di Tepi Blog