Berikut ini previewnya:
Cara Membuat Footer Blog Elegant SEO Friendly :
Masuk dulu ke akun Blogger anda
Buka menu pengeditan template
Salin kode berikut sebelum atau diatas kode ]]></b:skin>
#footer {-webkit-box-shadow:inset 0px 1px 0px rgba(0,0,0,0.4), inset 0px 2px 0px rgba(255,255,255,0.2), 0px 1px 3px rgba(0,0,0,0.4);-moz-box-shadow:inset 0px 1px 0px rgba(0,0,0,0.4), inset 0px 2px 0px rgba(255,255,255,0.2), 0px 1px 3px rgba(0,0,0,0.4);box-shadow:inset 0px 1px 0px rgba(0,0,0,0.4), inset 0px 2px 0px rgba(255,255,255,0.2), 0px 1px 3px rgba(0,0,0,0.4);background:#1F8F07 repeat-x;width:100%;margin-bottom:0px;padding:0 auto}Salin kode berikut dibawah kode <div id='footer'> dengan hasil pemasangan seperti berikut ini :
#footer-content {color:#ddd;font-size:12px;margin:20px auto;padding-top:5px;width:980px;text-align:left;}
#footer-content a {color:#EBF5FA;font-size:12px;}
#footer-content a:hover {color:#FFFFFF;font-size:12px;}
#footer-content img {border:none;}
#footer-menu {float:left;margin-left:80px;width:200px;}
#footer-menu ul#vmenu {border-top: none;}
#footer-menu ul#vmenu li {border-bottom: 1px dotted #AAA;}
#footer-menu ul#vmenu li a:link, #footer-menu ul#vmenu li a:visited {color:#ddd;}
#footer-menu ul#vmenu li a:hover {color:#FFF;}
#social{}
#twitter {float:left;margin:10px 0 0 0 ;}
#fb {float:left;margin:10px 0 0 10px;}
#gplus {float:left;margin:10px 0 0 10px;}
#linkedin {float:left;margin:10px 0 0 10px;}
#pinterest {float:left;margin:10px 0 0 10px;}
#tumblr {float:left;margin:10px 0 0 10px;}
#reddit {float:left;margin:10px 0 0 10px}
<div id='footer-content'>ganti : >> '#' << tanpa tanda petik dengan url yang akan di tuju jika diklik
<div style='float:left;width:450px;'>
<div style='border-bottom:1px dotted #aaa'>Support by:</div>
<div style='margin-top:10px'>
<a href='http://google.co.id' style='margin-right:5px' target='_blank'><img border='1px solid #eee' height='20' src='https://www.google.co.id/images/srpr/logo4w.png' title='Google Indonesia' width='65'/></a>
<a href='http://blogger.com' style='margin-right:5px;' target='_blank'><img border='1px solid #eee' height='20' src='http://www.blogger.com/img/blogger-logo-small.png' title='Blogger' width='65'/></a>
</div>
<div style='margin-top:15px;border-bottom:1px dotted #aaa'>SocialNetwork:</div>
<div id='social'>
<div id='twitter'><a href='#' rel='nofollow'><img alt='twitter' height='32' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgs-7kZzmXJUsXzOOhJE1rVjr-qCIvCtWE2fsT7HoQBrnPUyvlFS3V1eH5RPM5BzPoiB1y7cbmlWAAWz_Nmwadp08YRnznnionqxADpP2ts19fUwwL68Rs3aXhbU9x8qdvQbPLsBjZkaMdY/s1600/twitter.png' width='32'/></a>
</div>
<div id='fb'>
<a href='#' rel='nofollow'><img alt='facebook' height='32' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEinNk0kHPuz0Fk1rMy0_oBYzaJgueBhscjvk4bNbhAyUW7KTGvA4DJhZfcv4JYUBJ1ROWgGQF-Xtm72wu4tY0b0hCGHiA4KQflZGAKojSBloOTHdSd7i7_sX0tWnOJmuEV6ITzQDAWuhHS1/s1600/facebook.png' width='32'/></a>
</div>
<div id='gplus'><a href='#' rel='nofollow'><img alt='google plus' height='32' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhhYL0m8PqERMBdRmL0TeO7Aljp0Z2FroaGLDkIFf1tbREAISeOVUoBUo4W8GZVZatZP2RWFFXqXsuWwunPxoI-xWCD17n6_xRFydfefi8zaY0OZpCSo5TlEz9NKfGqmmdjTd8tUw0RxNS7/s1600/google+.png' width='32'/></a>
</div>
<div id='linkedin'><a href='#' rel='nofollow'><img alt='linkedin' height='32' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhoEfdzK1GWVnebwiwYBpFEzoxTsJFGSyFEE5-uQpuTJ7CMjTMFVLWhP6O1_2aedk6UpuYS_QeDpcPzoIlcC2A8x73w-BqAwh5pMaimVa-jk4eTHACIE7lZYVbJL7ZaL4WZmE2tQpa2STI6/s1600/linkedin.png' width='32'/></a>
</div>
<div id='pinterest'><a href='#' rel='nofollow'><img alt='pinterest' height='32' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhgP7hrFZhwtjm9FY0kKW65tBk0D901XwWgdfm0V32gAPccHNvxfnYQhGTBv5ULBPn1xOyKPTxJLYsXJm_oQKG3ARYgJOFFGjVeDpFAGJui0ioCDsJW7zOMu8CooWDK2NNw9ncC795mOnql/s1600/pinterest.png' width='32'/></a>
</div>
<div id='tumblr'><a href='#' rel='nofollow'><img alt='tumblr' height='32' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiUqoK-QnPx7z0sLQFB_7Y7PXume6WFKDZ75HkcunHekdgYo_1yfMMEY05CE9DBORfN-oeDDX7lKF2DcNKt_KYtTLpanC8t3WP_N4RiD_EHl-eEsPikF845B-gCh0TLFgR5eHom7uXDLerS/s1600/tumblr.png' width='32'/></a>
</div>
<div id='reddit'><a href='#' rel='nofollow'><img alt='reddit' height='32' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiaDMNcuTixm9dFayGWtX9hHjDaB3D_lqoB0VwnHId62SpUENQCXDY4TRO8ZKopHRKglbEHUm86SRfkubf1NXPyBasXbOftxPti5CENrd-Q4g8FEcVr44B4QdjtA76eeu_Ug72qN5-gEt33/s1600/reddit.png' width='32'/></a>
</div>
</div>
</div>
<div style='margin-left:30px;float:left;width:200px;'><h5><div style='border-bottom:1px dotted #aaa'>TRIK HALUS Template Design by:</div></h5><div style='margin-top:10px'>
<a href='https://trikhalus.blogspot.co.id/'>TRIK HALUS</a></div>
<!-- Begin Mail -->
<div style='margin-top:15px;border-bottom:1px dotted #aaa'>Subscribe to our newsletter</div>
<div>
<div id='mc_embed_signup'>
<div id='joinfeed'>
<a href='https://trikhalus.blogspot.co.id/feeds/posts/default' rel='alternate' title='Subscribe to avail https://trikhalus.blogspot.co.id/' type='application/rss+xml'>RSS</a>
<style>.ptb {padding-left:2px;padding-right:2px;color:white;font-weight:500;background-color:#FF8000;-moz-box-shadow: 1px 1px 1px #888;-webkit-box-shadow: 1px 1px 1px #888; box-shadow: 1px 1px 1px #888;}.ptb:hover {-moz-box-shadow: 0 0 0; -webkit-box-shadow: 0 0 0; box-shadow: 0 0 0;}</style>
<form action='http://feedburner.google.com/fb/a/mailverify' method='post' onsubmit='window.open('http://feedburner.google.com/fb/a/mailverify?uri=FeedBlog Anda', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true' target='popupwindow'><input name='email' placeholder='email address' style=' color:#5C6AA4; background: #fff; border:1px solid #5C6AA4; padding:10px 0;width:210px' type='text'/><input name='uri' type='hidden' value='TRIK HALUS'/><input name='loc' type='hidden' value='en_US'/> <input class='ptb' onmouseout='this.className='ptb'' onmouseover='this.className='ptb ptbhov'' style='-moz-border-radius: 3px; border-radius: 3px;' type='submit' value='Submit'/></form>
</div>
</div>
<!--End Mail-->
</div>
</div>
<div id='footer-menu'>
<ul id='vmenu'>
<li><a href='#'>Home</a></li>
<li><a href='#'>Masakan Daerah</a></li>
<li><a href='#'>Cara Memasak</a></li>
<li><a href='#'>Tentang</a></li>
<li><a href='#'>Hubungi Kami</a></li>
<li><a href='#'>Credits</a></li>
<li><a href='#'>Uncategorized</a></li>
</ul>
</div>
<div style='margin:40px 0 20px 0;clear:both'><p>© 2013 <a expr:href='data:blog.homepageUrl' style='margin-right:10px;'><data:blog.title/></a> Created by TRIK HALUS All rights reserved.</p></div>
<div style='clear:both;height:20px'/>
</div>
Selesai. Silahkan klik Preview terlebih dahulu sebelum anda menyimpan pembaharuan kode template anda untuk melihat apakah ada error atau tidak. Jika ada yang error, cari kodenya dan perbaiki. Jika tidak ada yang error, simpan template.PENTING Karena kode CSS dari membuat footer blog ini menggunakan kode yang sama dengan kode footer aslinya yaitu #footer sehingga akan membuat ID html yang sama juga yaitu <div id='footer'> maka anda harus menghapus kode yang ada yang sama dengan kode pada artikel ini agar tidak menimbulkan bentrok. Sekian dan Terima Kasih :D
0 Response to "Cara Membuat Footer Blog Elegant SEO Friendly 2019 | TRIK HALUS"
Posting Komentar