+ Login ke Blogger kemudian pilih "Layout"
+ Klik pada "Edit HTML" dan paste kode berikut :
1. Letakkan kode berwarna merah tepat di bawah kode hijau muda
<html>
<head>
<!-- begin Smooth Gallery scripts -->
<link rel="stylesheet" type="text/css" href="http://www.geocities.com/adeha_182/jd2.gallery.css" />
<script src='http://www.geocities.com/adeha_182/mootools2.v1.11.js' type='text/javascript'/>
<script src='http://www.geocities.com/adeha_182/jd2.gallery.js' type='text/javascript'/>
<!-- end Smooth Gallery scripts -->
<b:skin><![CDATA[/*
DISINI TEMPAT KODE2 CSS
]]></b:skin>
</head>
<body>
<div id='main-wrapper'>
2. Kemudian letakkan kode berwarna merah di bawah ini, tepat di atas kode hijau muda
<div id='isismoothgallery'>
<b:if cond='data:blog.homepageUrl == data:blog.url'>
<style>
#myGallery, #myGallerySet, #flickrGallery {
width: 400px;
height: 300px;
z-index:5;
border: 1px solid #000;
margin: 0 0 30px;
}
.jdGallery .slideInfoZone
{
position: absolute;
z-index: 10;
width: 100%;
margin: 0px;
left: 0;
bottom: 0;
height: 85px;
background: #000;
color: #fff;
text-indent: 0;
overflow: hidden;
}
</style>
<script type='text/javascript'>
function startGallery() {
var myGallery = new gallery($('myGallery'), {
timed: true
});
}
window.addEvent('domready',startGallery);
</script>
<div id='myGallery'>
<div class='imageElement'>
<h2>Featured Article #1</h2>
<p>This is an example ...</p>
<a class='open' href='http://genx4shared.blogspot.com/2009/04/award4shared-spirit-award-for-bloggers.html' title='Read More'/>
<img class='full' src='http://www.geocities.com/blacklist1304/AWARD4Shared.jpg'/>
<img class='thumbnail' src='http://www.geocities.com/blacklist1304/AWARD4Shared.jpg'/>
</div>
<div class='imageElement'>
<h2>Featured Article #2</h2>
<p>This is an example ...</p>
<a class='open' href='http://genx4shared.blogspot.com/2009/03/lets-try-to-costumize-facebook-layout.html' title='Read More'/>
<img class='full' src='http://1.bp.blogspot.com/_Eyj7k5Gl3Q0/SceGbuBBZKI/AAAAAAAAAJo/RJu6dujpYGY/s320/myfacebook.JPG?imgmax=400'/>
<img class='thumbnail' src='http://1.bp.blogspot.com/_Eyj7k5Gl3Q0/SceGbuBBZKI/AAAAAAAAAJo/RJu6dujpYGY/s320/myfacebook.JPG?imgmax=400'/>
</div>
<div class='imageElement'>
<h2>Featured Article #3</h2>
<p>This is an example ...</p>
<a class='open' href='http://genx4shared.blogspot.com/2009/04/mozilla-firefox-is-great-freeware.html' title='Read More'/>
<img class='full' src='http://www.hwdot.com/images/firefox.png'/>
<img class='thumbnail' src='http://www.hwdot.com/images/firefox.png'/>
</div>
</div>
</b:if>
</div>
<b:section class='main' id='main' showaddelement='no'>
<b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog'/>
</b:section>
</div>
</body>
</html>
+ Ganti tulisan Featured Article #1, Featured Article #2, Featured Article #3 yang bercetak tebal dengan Judul artikelmu.
+ Ganti tulisan yang berwarna Merah sesuai ukuran lay out mu.
- width: 500px; (lebar Smooth Gallery)
- height: 400px; (tinggi Smooth Gallery)
- margin: 0px 0px 0px 30px; (jarak atas,kanan,bawah,kiri Smooth Gallery)
+ Ganti tulisan yang berwarna Biru dengan Ringkasan artikelmu.
+ Ganti tulisan yang berwarna Hijau dengan Link artikelmu.
+ Ganti tulisan yang berwarna Ungu dengan Link Gambarmu.
+ Untuk menambah elemen slideshow, copy kode yang sebelumnya dan paste dibawahnya kode tersebut.
Simpan dan Lihat Hasilnya.