22 Mar 2012

Tugas Pertama ETIKA PROFESI

    Jelaskan Bagaimana Bentuk Profesionalisme
         =Dalam Profesi Seorang Guru=

Bagaimana Bentuk Profesionalisme Dalam Profesi Seorang Guru


bentuk - bentuk apa yang seharusnya diajarkan, kurikulum seharusnya juga didasarkan pada gudang pengetahuan yang memungkinkan manusia untuk meningkatkan peradaban, atau seharusnyapembelajaran kita fokus dalam membantu siswa berinteraksi secara lebih baik dengan teman - teman untuk meningkatkan harga diri dan prestasi akademik dan menyediakan kesempatan - kesempatan bagi mereka untuk mengembangkan pertemanan (Campbell, & Dickinson, 2004).Peran guru yang utama adalah memfasilitasi pembela ... profesional. Secara social siswa didorong untuk saling berinteraksi di pusat-pusat pembelajaran.Pertanyaan umum yang dihadapi oleh para guru adalah, Komponen pertumbuhan siswa apa yang merupakan tujuan terpenting yang harus dicapai dalam institusi sekolah umum? Apakah pertumbuhan intelektual akademik atau pertumbuhan emosional sosial? Selain dijelaskan dalam bentuk - bentuk apa yang seharusnya diajarkan, kurikulum seharusnya juga didasarkan pada gudang pengetahuan yang memungkinkan manusia ... Seorang guru dapat mendorong siswanya dalam sebagai pembelajar yang aktif. Pembelajar yang aktif ini merupakan salah satu aspek konstruktivisme, sebuah pandangan yang sedang berkembang mengenai pembelajaran yang nantinya akan kita bahas dalam bab khusus. Selain perolehan pengetahuan yang diinginkan, peningkatan sosial dan intelektual siswa merupakan tujuan utama yang harus dicapai oleh guru sebagai salah satu peran terpenting guru yang profesional. Secara social siswa didorong untuk saling ber ... guru dalam pembelajaran diharapkan dapat mencakup tiga hal, yaitu: mengembangkan pertumbuhan sosial, pertumbuhan emosional, dan pertumbuhan perolehan pengetahuan bagi para peserta didiknya. Seorang guru dapat mendorong siswanya dalam sebagai pembelajar yang aktif. Pembelajar yang aktif ini merupakan salah satu aspek konstruktivisme, sebuah pandangan yang sedang berkembang mengenai pembelajaran yang nantinya akan kita bahas dalam bab khusus. Selain perolehan pengetahuan yang diinginkan, peningk ... peran terpenting guru yang profesional. Secara social siswa didorong untuk saling berinteraksi di pusat-pusat pembelajaran.Pertanyaan umum yang dihadapi oleh para guru adalah, Komponen pertumbuhan siswa apa yang merupakan tujuan terpenting yang harus dicapai dalam institusi sekolah umum? Apakah pertumbuhan intelektual akademik atau pertumbuhan emosional sosial? Selain dijelaskan dalam bentuk - bentuk apa yang seharusnya diajarkan, kurikulum seharusnya juga didasarkan pada gudang pengetahuan ... pembelajaran diharapkan dapat mencakup tiga hal, yaitu: mengembangkan pertumbuhan sosial, pertumbuhan emosional, dan pertumbuhan perolehan pengetahuan bagi para peserta didiknya. Seorang guru dapat mendorong siswanya dalam sebagai pembelajar yang aktif. Pembelajar yang aktif ini merupakan salah satu aspek konstruktivisme, sebuah pandangan yang sedang berkembang mengenai pembelajaran yang nantinya akan kita bahas dalam bab khusus. Selain perolehan pengetahuan yang diinginkan, peningkatan sosial ... 
Peran guru dalam pembelajaran diharapkan dapat mencakup tiga hal, yaitu: mengembangkan pertumbuhan sosial, pertumbuhan emosional, dan pertumbuhan perolehan pengetahuan bagi para peserta didiknya. Seorang guru dapat mendorong siswanya dalam sebagai pembelajar yang aktif. Pembelajar yang aktif ini merupakan salah satu aspek konstruktivisme, sebuah pandangan yang sedang berkembang mengenai pembelajaran yang nantinya akan kita bahas dalam bab khusus. Selain perolehan pengetahuan yang diinginkan, peningkatan sosial dan intelektual siswa merupakan tujuan utama yang harus dicapai oleh guru sebagai salah satu peran terpenting guru yang profesional. Secara social siswa didorong untuk saling berinteraksi di pusat-pusatpembelajaran.Pertanyaan umum yang dihadapi oleh para guru adalah, Komponen pertumbuhan siswa apa yang merupakan tujuan terpenting yang harus dicapai dalam institusi sekolah umum? Apakah pertumbuhan intelektual akademik atau pertumbuhan emosional sosial? Selain dijelaskan dalam bentuk - bentuk apa yang seharusnya diajarkan, kurikulum seharusnya juga didasarkan pada gudang pengetahuan yang memungkinkan manusia untuk meningkatkan peradaban, atau seharusnya pembelajaran kita fokus dalam membantu siswa berinteraksi secara lebih baik dengan teman - teman untuk meningkatkan harga diri dan prestasi akademik dan menyediakan kesempatan - kesempatan bagi mereka untuk mengembangkan pertemanan (Campbell, & Dickinson, 2004).Peran guru yang utama adalah memfasilitasi pembelajaran siswa, yang secara luas dijabarkan, dengan berbagai cara.

Peran dan tugas guru

bentuk watak bangsa serta mengembangkan potensi siswa. Kehadiran guru tidak tergantikan oleh unsur yang lain, lebih-lebih dalam masyarakat kita yang multikultural dan multidimensional, dimanaperanan teknologi untuk menggantikan tugas-tugas guru sangat minim.Guru memiliki perana yang sangat penting dalam menentukan keberhasilan pendidikan. Guru yang profesional diharapkan menghasilkan lulusan yang berkualitas. Profesionalisme guru sebagai ujung tombak di dalam implementasi kurikulum di kelas ... Profesionalisme guru sebagai ujung tombak di dalam implementasi kurikulum di kelas yang perlumendapat perhatian(Depdiknas, 2005).Dalam proses belajar mengajar, guru mempunyai tugas untuk mendorong, membimbing, dan memberi fasilitas belajar bagi siswa untuk mencapai tujuan. Guru mempunyai tanggung jawab uuntuk melihat segala sesuatu yang terjadi dalam kelas untuk membantu proses perkembangan siswa. Penyampaian materi pelajaran hanyalah merupakan salah satu dari berbagai kegiatan dalam bela ... profesional diharapkan menghasilkan lulusan yang berkualitas. Profesionalisme guru sebagai ujung tombak di dalam implementasi kurikulum di kelas yang perlumendapat perhatian(Depdiknas, 2005).Dalam proses belajar mengajar, guru mempunyai tugas untuk mendorong, membimbing, dan memberi fasilitas belajar bagi siswa untuk mencapai tujuan. Guru mempunyai tanggung jawab uuntuk melihat segala sesuatu yang terjadi dalam kelas untuk membantu proses perkembangan siswa. Penyampaian materi pelajaran h ... seorang guru harus :Mengumpulkan data tentang siswa.Mengamati tingkah laku siswa dalam situasi sehariu-hari.Mengenal para siswa yang memerlukan bantuan khusus.Mengadakan pertemuan atau hubungan dengan orang tua siswa, baik secara individu maupun secara kelompok, untuk memperoleh saling pengertian tentang pendidikan anak.Bekerjasama dengan masyarakat dan lembaga-lembaga lainya untuk membantu memecahkan masalah siswa.Membuat catatan pribadi siswa serta menyiapkannya dengan bai ... guru tidak tergantikan oleh unsur yang lain, lebih-lebih dalam masyarakat kita yang multikultural dan multidimensional, dimana peranan teknologi untuk menggantikan tugas-tugas guru sangat minim.Guru memiliki perana yang sangat penting dalam menentukan keberhasilan pendidikan. Guru yang profesional diharapkan menghasilkan lulusan yang berkualitas. Profesionalisme guru sebagai ujung tombak di dalam implementasi kurikulum di kelas yang perlumendapat perhatian(Depdiknas, 2005).Dalam prose ... peranan yang sangat strategis terutama dalam membentuk watak bangsa serta mengembangkan potensi siswa. Kehadiran guru tidak tergantikan oleh unsur yang lain, lebih-lebih dalam masyarakat kita yang multikultural dan multidimensional, dimana peranan teknologi untuk menggantikan tugas-tugas guru sangat minim.Guru memiliki perana yang sangat penting dalam menentukan keberhasilan pendidikan. Guru yang profesional diharapkan menghasilkan lulusan yang berkualitas. 

Tugas Guru dalam Proses Pembelajaran
bentuk manusia Indonesia yang berjiwa pancasila.Guru memiliki dan melaksanakan kejujuran profesionalGuru dalam berusaha memperoleh informasi tentang peserta didik sebagai bahan bimbingan dan pembinaanGuru menciptakan suasana sekolah sebaik-baiknya untuk menunjang berhasilnya pembelajaran.Guru memelihara hubungan baik dengan orang tua murid dan masyarakat seitarnya untuk membina peran serta dan tanggung jawab terhadap pendidikan.Guru secara pribadi dab bersama-sama mengembangkan da ... profesinya bahwa guru sebagai pendidik dan sebagai pengajar. Akan tetapi dari kedua peran tersebut sehingga dapat terjadi arena pembelajaran yang dengan tujuan bahwa guru dapat menciptakan suasana yang dan sitasi yang dapat diterima dalam belajar. Guru memainkan multi peran dalam proses pembelajaran yang menyelenggarakan dengan tugas yang amat bervariasi. Jika seorang guru telah berpegang dengan ketentuan dan amat bervariasi sehingga di dapatkan guru dapat mewujudkan suasana yang belajar dan me ... seorang guru telah berpegang dengan ketentuan dan amat bervariasi sehingga di dapatkanguru dapat mewujudkan suasana yang belajar dan mengajar.Guru sebagai konservator (pemelihara)Guru sebagai tramitor (penerus)Guru sebagai transformator (penerjemah)Guru sebagai perencana (planner)Guru sebagai manajer proses pembelajaranGuru Sebagai Pemandu (direktur).Guru sebagai organisator (penyelenggara)Guru sebagai komunikatorGuru sebagai fasilitatorGuru sebagai motivator ... guru dalam profesinya bahwa guru sebagai pendidik dan sebagai pengajar. Akan tetapi dari kedua peran tersebut sehingga dapat terjadi arena pembelajaran yang dengan tujuan bahwa guru dapat menciptakan suasana yang dan sitasi yang dapat diterima dalam belajar. Guru memainkan multi peran dalam proses pembelajaran yang menyelenggarakan dengan tugas yang amat bervariasi. Jika seorang guru telah berpegang dengan ketentuan dan amat bervariasi sehingga di dapatkan guru dapat mewujudkan suasana yang bel ... peran tersebut sehingga dapat terjadi arena pembelajaran yang dengan tujuan bahwa guru dapat menciptakan suasana yang dan sitasi yang dapat diterima dalam belajar. Guru memainkan multi peran dalam proses pembelajaran yang menyelenggarakan dengan tugas yang amat bervariasi. Jika seorang guru telah berpegang dengan ketentuan dan amat bervariasi sehingga di dapatkan guru dapat mewujudkan suasana yang belajar dan mengajar.Guru sebagai konservator (pemelihara)Guru sebagai tramitor (penerus) ... pembelajaran yang dengan tujuan bahwa guru dapat menciptakan suasana yang dan sitasi yang dapat diterima dalam belajar. Guru memainkan multi peran dalam proses pembelajaran yang menyelenggarakan dengan tugas yang amat bervariasi. Jika seorang guru telah berpegang dengan ketentuan dan amat bervariasi sehingga di dapatkan guru dapat mewujudkan suasana yang belajar dan mengajar.

Kemampuan Berkomunikasi Sebagai Salah Satu Pilar Profesionalisme Guru dalam Membimbing Anak Usia Dini
bentuk pendidikannya dan lingkungan yang diperoleh, kemampuan kecerdasan anak hanya dapat diubah sebanyak 20%. Dari hasil penelitian tersebut berarti bahwa selama usia 4 tahun pertama dari kehidupan anak dan dari usia 4-8 tahun kecerdasan anak sudah berkembang sebanyak 80%. Hal ini menunjukkan betapa pesatnya pertumbuhan otak anak pada tahun-tahun tersebut.Demikian pesatnya dan pentingnya perkembangan yang terjadi pada masa-masa awal kehidupan anak sehingga masa awal ini dikatakan sebagai m ... profesional dalam mengusahakan prosespembelajaran yang menarik dan mengagumkan, yang dimulai dari penciptaan profil diri yang menarik dan berpengaruh.c. Kemampuan Berkomunikasi Pendidik Anak Usia Dini Pendidik anak usia dini adalah sosok individu yang memegang peranan penting dalam berbagai usaha yang terkait dengan pengembangan program pendidikan anak usia dini. Anak usia dini adalah anak usia emas yang memiliki kepribadian yang unik. Kepribadian ini ditandai dengan ciri-ciri dan si ... Seorang individu memerlukan pendidikan mumpuni yang selayaknya telah mulai dipupuk sejak anak berusia dini bahkan sejak anak masih berada dalam kandungan.Pentingnya stimulasi pendidikan anak sejak usia dini didukung oleh hasil penelitian yang menyatakan bahwa pada umur 4 tahun, anak telah mencapai separuh dari kemampuan kecerdasannya, dan pada umur 8 tahun mencapai 80%. Setelah umur 8 tahun, tanpa melihat bentuk pendidikannya dan lingkungan yang diperoleh, kemampuan kecerdasan anak hanya d ... guru. Peran orangtua sudah tentu sangat penting, begitu juga guru di sekolah. Guru merupakan orangtua kedua anak dalam pendidikan. Untuk itu seorang guruharuslah orang-orang yang memiliki integritas yang tinggi dalam mendidik anak. Mereka harus memiliki visi dan misi yang jelas tentang pendidikan, yang disertai oleh kecakapan dan bekal ilmu yang cukup untuk mendidik anak sebagai generasi penerus bangsa.Guru atau pun pamong bagi anak usia dini, haruslah memiliki latar belakang pendidikan ya ... peranan amat penting.Berkenaan dengan hal tersebut, dibutuhkan peranan yang besar dari pendidik yakni orangtua dan guru. 

Itulah Tugas QUIZ Etika Profesi 
buat teman-teman yang mau share silakan saja ini juga hasil Share dari alamat website 

17 Mar 2012

Cara menempatkan gambar di pojok kiri kanan atas bawah blog




Cara menempatkan gambar di pojok kiri kanan atas bawah blog
Alhamdulillah akhirnya postingan bisa aku lanjutkan setelah beberapa hari bahkan beberapa minggu tidak melakukan posting ke blog ini gara-gara ada keperluan pribadi yang menyangkut masalah pendidikan kami. Pada kesempatan kali ini saya akan membahas tentang cara Menempatkan gambar di pojok kiri kanan atas bawah blog. Cara ataupun Trik ini saya buat untuk menyimpan kode untuk membuat gambar di pojok kiri kanan atas bawah blog, sekalian berbagi kepada Sahabat Mabuprogram semua.

Untuk menerapkannya di blog Anda Silahkan ikuti langkah-langkah berikut:
Pertama :
Masuk ke blog Anda.

Kedua :
Dari Dasbor, masuk ke Rancangan lalu Edit HTML.

Ketiga :
Cari kode ]]></b:skin> (cara mencari: Ctrl + F)
Copy dan paste kode di bawah ini tepat di atas kode ]]></b:skin>

Keterangan :
kode di atas: top = atas, bottom = bawah, left = kiri, right = kanan. Silahkan diganti sesuai dengan keinginan Anda.
#gambarpojok {position:fixed;_position:absolute;top:0px; right:0px;clip:inherit;_top:expression(document.documentElement.scrollTop+document.documentElement.clientHeight-this.clientHeight); _left:expression(document.documentElement.scrollLeft+ document.documen

Keempat :
Cari lagi kode </body>
<div id='gambarpojok'><a href='NAMABLOGANDA.blogspot.com/#'><img border='0' src='URL GAMBAR YANG DITAMPILKAN'/></a></div>

Atau bisa juga dengan
<a href="javascript:popup('pop up overlay')">
<img src="http://4.bp.blogspot.com/-wk-1FghqP1Y/Tzx-3ltDOUI/AAAAAAAAABI/_y_WCKcCEjc/s320/buku-tamu.gif" /></a>
<div id="dialog-overlay"></div>
<div id="dialog-box"><div class="dialog-content">
<div style="text-align: center;text-valign: top;">

<iframe src="http://s1.fibox.ws/chat.php?6919" width="450px" scrolling="auto" height="500px" frameborder="0"></iframe>

<div id="dialog-message"></div><a class="button" href="#">TUTUP</a></div></div>
<style type="text/css">
#dialog-overlay {width:100%; height:100%;filter:alpha(opacity=80);
-moz-opacity:0.5;-khtml-opacity: 0.5;opacity: 0.5;background:#000000;position:absolute;top:0; left:0;z-index:3000;display:none;}#dialog-box {-webkit-box-shadow: 2px 4px 10px grey;-moz-box-shadow: 2px 4px 10px grey;-moz-border-radius: 5px;-webkit-border-radius:5px;background:white;width:auto;position:absolute;z-index:5000;display:none;}#dialog-box .dialog-content {text-align:left;padding:5px;margin:13px;color:#fff; text-shadow: 1px 1px 2px #fff;font-family:arial;font-size:15px;}a.button {margin:10px auto 0 auto;text-align:center;display: circle;width:20px;padding: 5px 10px 6px;color: #fff;text-decoration: none;font-weight: bold;line-height: 1;background-color:blue;-moz-border-radius: 5px;-webkit-border-radius: 5px;-moz-box-shadow: 0 1px 3px rgba(0,0,0,0.5);-webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.5);text-shadow: 0 -1px 1px rgba(0,0,0,0.25);border-bottom: 1px solid rgba(0,0,0,0.25);position: relative;cursor: pointer;}
a.button:hover {background-color: #000;}#dialog-box .dialog-content p {font-weight:700;
margin:0;}#dialog-box .dialog-content ul {margin:10px 0 10px 10px;padding:0;height:50px;}</style>
<script src="http://andysmile.googlecode.com/files/latoverlay.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {$('a.btn-ok, #dialog-overlay, #dialog-box').click(function () {$('#dialog-overlay, #dialog-box').hide();return false;});
$(window).resize(function () {if (!$('#dialog-box').is(':hidden')) popup();}); });
function popup(message) {var maskHeight = $(document).height();var maskWidth = $(window).width();var dialogTop = (maskHeight/1.5) - ($('#dialog-box').height());
var dialogLeft = (maskWidth/2) - ($('#dialog-box').width()/2);$('#dialog-overlay').css({height:maskHeight, width:maskWidth}).show();$('#dialog-box').css({top:dialogTop, left:dialogLeft}).show();$('#dialog-message').html(message);}</script></div>

Ganti Tulisan Biru dengan shoutbox atau link gambarmu
<a href='NAMABLOGANDA.blogspot.com/#'><img border='0' src='URL GAMBAR YANG DITAMPILKAN'/></a>
Simpan Template dan lihat hasilnya.
Selamat mencoba! 

Cara Memasang Gambar Animasi Di Pojok Bawah Blog


Postingan ini merupakn postingan kedua hari ini setelah saya sudah lama tidak melakukan posting untuk blog ini. Untuk kali ini masih menyangkut masalah Tutorial Blogging kami beri judul Cara Memasang Gambar Animasi Di Pojok Bawah Blog. 


Silahkan ikuti Petunjuk di bawah ini :

Pertama :

Login ke www.blogger.com lalu klik "Layout -->> Edit HTML 

Kedua :

Cari kode : ]]></b:skin> . Jika sudah ketemu, letakkan kode berikut ini di atasnya.

#cah-reyog { 
position:fixed;_position:absolute;bottom:0px; left:0px; 
clip:inherit; 
_top:expression(document.documentElement.scrollTop+ 
document.documentElement.clientHeight-this.clientHeight); _left:expression(document.documentElement.scrollLeft+ document.documentElement.clientWidth - offsetWidth); }
Keterangan :
Text yang dicetak tebal adalah posisinya, jika ingin mengganti di posisi pojok kanan bawah tinggal diganti text "left" dengan "right". Begitu juga tulisan "bottom", jika ingin di posisi atas bisa diganti dengan "top"


Ketiga :
Langkah selanjutnya yaitu letakkan script berikut ini sebelum kode : </body>

<div id="cah-reyog"> 
<a href="http://cahreyog.blogspot.com/"> 
<img src="http://i559.photobucket.com/albums/ss40/putraaremba_babix/joget.gif" border="0" /></a> 
</div>
Keterangan :
"http://cahreyog.blogspot.com/" adalah link blog. Ganti dengan link blog anda. 
"http://i559.photobucket.com/albums/ss40/putraaremba_babix/joget.gif" adalah lokasi gambar. Ganti dengan lokasi gambar anda. 

Memasang Content Slider di Blog


Memasang Content Slider di Blog

Postingan Kedua Hari ini Setelah sebelumnya Postingan kami beberapa menit yang lalu mengenai Cara Membuat Slideshow di Blog. Dan untuk postingan Kedua Hari ini masih Menyangkut mengenai Tutorial Blogging. Teman-teman yang bermain jejaring sosial tadi biarkan saja dulu (Aku Cuek). Kali ini Kami postingkan dan kami bagikan tutorial dengan Judul Memasang Content Slider di Blog. Alhamdulillah Cara / Tutorial ini sedang kami gunakan di Blog ini. Perhatikan saja di Halaman Depan Blog ini.

Content slider ini mengandalkan dan menggunakan Kode JQuery untuk Sildeshownya dan sedikit script-script UI yang digunakan sebagai pendukung JQuerynya. Content Slider ini memang banyak digunakan oleh para Blogger yang mengedepankan Kreatifitas dan Modif serta Desain buat blog Mereka.

Berikut Silahkan ikuti langkah-langkahnya :
Pertama :
Login Ke Akun Blogger

Kedua :
Pergi ke Rancangan >> Edit HTML

Ketiga :
Masukkan Kode di bawah ini Setelah Kode <head>
<link href='http://sites.google.com/site/bloggermintcom/style1.css' rel='stylesheet' type='text/css'/>  
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript">
<script src='http://ajax.googleapis.com/ajax/libs/jqueryui/1.5.3/jquery-ui.min.js' type='text/javascript'/>
<script type='text/javascript'>
$(document).ready(function(){
$(&quot;#featured&quot;).tabs({fx:{opacity: &quot;toggle&quot;}}).tabs(&quot;rotate&quot;, 5000, true);
$(&quot;#featured&quot;).hover(
function() {
$(&quot;#featured&quot;).tabs(&quot;rotate&quot;,0,true);
},
function() {
$(&quot;#featured&quot;).tabs(&quot;rotate&quot;,5000,true);
}
);
});
</script>

Keempat :
Letakkan Kode berikut Sebelum kode </head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" ></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.5.3/jquery-ui.min.js" ></script>
<script>$(document).ready(function(){ 
        $("#featured > ul").tabs({fx:{opacity: "toggle"}}).tabs("rotate", 5000, true); 
    });</script>


Keterangan :
5000 adalah keterangan kecepatan Slidenya

Kelima :
Letakkan Kode berikut Sebelum Kode ]]></b:skin>

#featured{
width:400px;
padding-right:200px;
padding-left:5px;
position:relative;
border:5px solid #ccc;
height:260px;
background:#fff;
}
#featured ul.ui-tabs-nav{
position:absolute;
top:0; left:400px;
list-style:none;
padding:0; margin:0;
width:200px;
}
#featured ul.ui-tabs-nav li{
padding:1px 0; padding-left:13px;
font-size:12px;
color:#666;
}
#featured ul.ui-tabs-nav li img{
float:left; margin:2px 5px;
background:#fff;
padding:2px;
border:1px solid #eee;
}
#featured ul.ui-tabs-nav li span{
font-size:11px; font-family:Verdana;
line-height:18px;
}
#featured li.ui-tabs-nav-item a{
display:block;
height:60px;
color:#333;  background:#fff;
line-height:20px;
}
#featured li.ui-tabs-nav-item a:hover{
background:#f2f2f2;
}
#featured li.ui-tabs-selected{
background:url('http://i47.tinypic.com/6jojr4.jpg') top left no-repeat;
}
#featured ul.ui-tabs-nav li.ui-tabs-selected a{
background:#ccc;
}
#featured .ui-tabs-panel{
width:400px; height:200px;
background:#999; position:relative;
}
#featured .ui-tabs-panel .info{
position:absolute;
top:180px; left:0;
height:70px;
background: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEihuTBmtXqnKN5cTLOGH8xayf1FDKEPIgqIjOJgGfWWw43HcpQUyj0u3Xqgbdo06fbbyZP47d_4vqImPndMiMIsf5sSWnLJRXHpUCBGAy15Woh4Txn0cxn8pT9RI7OVFwa7wT1qaH_tIvI/s1600/transparent-bg.png');
}
#featured .info h2{
font-size:18px; font-family:Georgia, serif;
color:#fff; padding:5px; margin:0;
overflow:hidden;
}
#featured .info p{
margin:0 5px;
font-family:Verdana; font-size:11px;
line-height:15px; color:#f0f0f0;
}
#featured .info a{
text-decoration:none;
color:#fff;
}
#featured .info a:hover{
text-decoration:underline;
}
#featured .ui-tabs-hide{
display:none;
}

Keterangan :
Silahkan ganti Kode berwarna biru di atas dengan Selera Anda

Keenam :
Letakkan Kode di bawah ini Setelah Kode  <div id='content-wrapper'> atau Tempat Lainnya

<b:if cond='data:blog.pageType == &quot;index&quot;'>
<div id='featured'>
<ul class='ui-tabs-nav'>
<li class='ui-tabs-nav-item ui-tabs-selected' id='nav-fragment-1'><a href='#fragment-1'><img alt='pic1' src='https://sites.google.com/site/idesainerweb/hpsmart_80x50.jpg'/><span>Modem Smart di Linux (Ubuntu)</span></a></li>
<li class='ui-tabs-nav-item' id='nav-fragment-2'><a href='#fragment-2'><img alt='blogger' src='https://sites.google.com/site/idesainerweb/MultiLevel-DropDown-Menu-With-Out-J-Query-Onlt-HTML-CSS_80x50.jpg'/><span>Toolbar Multi DropDown di Blogger </span></a></li>
<li class='ui-tabs-nav-item' id='nav-fragment-3'><a href='#fragment-3'><img alt='buzz' src='https://sites.google.com/site/idesainerweb/sosialmediakiri_80x50.jpg'/><span>Sosial Media di Sisi Kiri Blogger</span></a></li>
<li class='ui-tabs-nav-item' id='nav-fragment-4'><a href='#fragment-4'><img alt='chat' src='https://sites.google.com/site/idesainerweb/social-networking_80x50.jpg'/><span>Social Network Teknik Floating</span></a></li>
</ul>
<!-- First Content -->
<div class='ui-tabs-panel' id='fragment-1' style=''>
<img alt='mac' src='https://sites.google.com/site/idesainerweb/hpsmart.jpg'/>
<div class='info'>
<h3><a href='http://idesainer.blogspot.com/2012/02/pasang-modem-smart-di-linux.html'>Pasang Modem Smart di OS Linux (Ubuntu)</a></h3>
<p>Memasang Modem Smart di Linux dapat dilakukan dengan....<a href='http://idesainer.blogspot.com/2012/02/pasang-modem-smart-di-linux.html'>read more</a></p>
</div>
</div>
<!-- Second Content -->
<div class='ui-tabs-panel ui-tabs-hide' id='fragment-2' style=''>
<img alt='' src='https://sites.google.com/site/idesainerweb/MultiLevel-DropDown-Menu-With-Out-J-Query-Onlt-HTML-CSS.png'/>
<div class='info'>
<h3><a href='http://idesainer.blogspot.com/2012/02/membuat-toolbar-menu-drop-down-di-blog.html'>Membuat Multi DropDown JQuery di Blog</a></h3>
<p>Toolbar Multi DropDown adalah toolbar yang berisi...<a href='http://idesainer.blogspot.com/2012/02/membuat-toolbar-menu-drop-down-di-blog.html'>read more</a></p>
</div>
</div>
<!-- Third Content -->
<div class='ui-tabs-panel ui-tabs-hide' id='fragment-3' style=''>
<img alt='' src='https://sites.google.com/site/idesainerweb/sosialmediakiri.jpg'/>
<div class='info'>
<h3><a href='http://idesainer.blogspot.com/2012/02/memasang-sosial-media-di-sisi-kiri-blog.html'>Sosial Media di Bagian Kiri Blog</a></h3>
<p>Media Sosial yang kami maksud disini adalah Facebook...<a href='http://idesainer.blogspot.com/2012/02/memasang-sosial-media-di-sisi-kiri-blog.html'>read more</a></p>
</div>
</div>
<!-- Fourth Content -->
<div class='ui-tabs-panel ui-tabs-hide' id='fragment-4' style=''>
<img alt='' src='https://sites.google.com/site/idesainerweb/social-networking.jpg'/>
<div class='info'>
<h3><a href='http://idesainer.blogspot.com/2012/02/cara-memasang-sosial-network-dengan.html'>Sosial Network dengan Teknik Floating</a></h3>
<p>Memasang Sosial Network di Blog dengan Floating....<a href='http://idesainer.blogspot.com/2012/02/cara-memasang-sosial-network-dengan.html'>read more</a></p>
</div>
</div> </div>


</b:if>
Keterangan :
Silahkan Edit Kode di atas dengan link dan deskripsi blog Anda Sendiri

Terakhir :
Simpan Template

Selamat Mencoba tutorial ini Related Posts Plugin for WordPress, Blogger...