Cara Mudah Menambahkan Nomor di Komentar Blog

Tutorial Cara Menambahkan Nomor di Komentar Blogspot - Cara lama yang mungkin beberapa orang belum tahu, yaitu menambahkan Nomor pada Komentar Pengunjung Blog. Cara ini digunakan di beberapa Blog yang saya rasa cukup bagus juga untuk diterapkan.

Cara Menambahkan Nomor di Komentar Blog

Anda bisa lihat script berikut dan silahkan di copy jika berminat :

1. Cari script ]]></b:skin>
2. Kopi Kode Berikut Sob, diatas no.1 tadi.

.comment-thread ol {
 counter-reset: countcomments;
}
.comment-thread li:before {
 content: counter(countcomments,decimal);
 counter-increment: countcomments;
 float: right;
 font-size: 22px;
 color: #555555;
 padding-left: 10px;
 padding-top: 3px;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjd6DKhwEsyM-hul2OIVxeSOEfOzsZv6oKBXjQL-dglhz18n4U74CCl3kp1IyrZavWFypN0ODYWpGFI4GAMHmC8fIiWZy6cbO9uFalaXEgqv6j099csytKDXuTUtZPGpFSV_d_l1GuNJk3x/s1600/comment+bubble2.png) no-repeat;
 margin-top: 7px;
 margin-left: 10px;
 width: 50px;
 /*image-width size*/
 height: 48px;
 /*image-height size*/
}
.comment-thread ol ol {
 counter-reset: contrebasse;
}
.comment-thread li li:before {
 content: counter(countcomments,decimal) "." counter(contrebasse,lower-latin);
 counter-increment: contrebasse;
 float: right;
 font-size: 18px;
 color: #666666;
}    

Oke demikian Cara Mudah Menambahkan Nomor di Komentar Blog, kemudian Save Template ente, semoga berhasil.

Gratis Download Contoh Poster Seminar CDR

Gratis Download Contoh Poster Seminar CDR - Free Download Poster Seminar 2013 Corel Draw X5  Project ini saya Bagikan Gratis dan ini Hasil editan saya untuk acara seminar di Kampus. Jika Berminat silahkan Berkomentar dibawah dan nanti saya akan kirimkan link Downloadnya.

Beberapa Poster yang pernah saya desain sendiri akan saya Upload berkala jika memang banyak yang membutuhkan, hee. Jadi jangan sungkan untuk berkomentar dibawah ya.ckckkc !!! GRATIS 110%.

Project yang saya bagikan ini dalam bentik CDR dan saya memakai Corel Draw X5. Sehingga Anda dapat memakainya versi X5 / X6.

Gratis Download Contoh Poster Seminar CDR

Jika Anda berminat silahkan tinggalkan Komentar dibawah Sob, ane akan kirimkan link Downloadnya untuk Ente (FREE).

Oke sekian dulu Curcol Ane tentang Gratis Download Contoh Poster Seminar CDR.

Jangan lupa komentarnya gan.

Jejualan.com tempat membuat Toko Online Cepat dan Berkualitas

Jejualan.com Tempat membuat Toko Online Cepat dan Berkualitas - Hanya dalam 20 detik, langsung mulai penjualan online ke seluruh dunia. Informasi menarik bagi Anda pelaku Bisnis yang masih belum menjual barang Anda secara Online atau Anda sedang mencari situs untuk membuatkan Toko Online Usaha anda. Soltsi Jitu aman dan berkualitas JEJUALAN.COM memberikan sejuta solusi untuk anda, dengan proses yang sangat cepat menjamin kenyamanan anda dalam melakukan proses jual-beli secara Online.

Hanya dalam 20 detik, langsung mulai penjualan online Anda. Proses yang sangat mudah, banyak pilihan desain menarik, Gratis domain .com .net seumur hidup dan hanya dengan 60ribu/bulan, merupakan jawaban dan solusi jitu untuk mengembangkan usaha anda melaui dunia Online.

Jejualan.com Tempat membuat Toko Online Cepat dan Berkualitas 

Jejualan.com adalah sebuah situs yang menyediakan jasa untuk pembuatan Online shop /Toko Online. Memiliki Slogan Buat toko onlinemu dalam 20 detik. Dengan pelayanan Customer Service 24 jam maka anda tidak perlu kawatir jika anda orang yang sibuk dan hanya bisa Online ketika waktu malam. Dengan pelayanan Customer Service yang ramah dan selalu siap membantu kapanpun Anda memerlukan bantuan. Customer support jejualan.com siap melayani apapun kebutuhan Anda.

Anda akan dibantu dan dilayani dengan sepenuh hati oleh Customer Service dari Jejualan.com mulai dari pertanyaan sampai keluhan yang biasanya tidak dimiliki oleh situs sejenis lainnya. Percayakan pada Jejualan.com untuk pembuatan Situs Online Shop Anda.

SMS otomatis terkirim ke nomor ponselmu dan ponsel pelanggan tokomu setiap ada transaksi - Fasilitas dan Fitur Unggulan lainnya yang khusus dipersembahkan oleh Jejualan.com yaitu SMS Report.
Fasilitas SMS Repot memiliki keunggulan yang akan membuat Anda selalu terhubung dengan Toko Online Anda. SMS Repot ini berfungsi ketika ada pelanggan yang melakukan pemesanan barang Anda secara Online maka secara Otomatis Anda akan menerima SMS Pemberitahuan tentang details pemesan, transfer biaya dan barang yang akan dipesan, jika anda kurang jelas silahkan ditanyakan kepada Customer Sevice yang sudah siap melayani Anda.

Oke lanjut gan, masih banyak keunggulan lainnya yang bisa Anda dapatkan jika Anda menggunakan Jejualan.com sebagai situs kepercayaan Anda untuk membantu meng-Online kan usaha Anda.

Fitur berikutnya yang juga sangat penting bagi sebuah situs Penjualan secara Online adalah memaksimalkan pencarian atau Search Engine Optimizion (SEO). Kenapa SEO penting untuk web toko online anda..?? Jawabanya tak lain tak bukan adalah karena saingan Anda dalam dunia Online sangatlah banyak dan datang dari segala penjuru negeri ini bahkan dunia.

Fitur SEO yang dipersembahkan oleh Jejualan.com akan memaksimalkan toko online anda dalam pencarian google dan search engine lainnya semisal Bing. Dengan Fitur SEO ini Toko Online anda akan berada dihalaman pertama Google. Seperti dijelaskan dalam halaman depan Jejualan.com "Toko onlinemu akan berada di halaman pertama hasil pencarian google dengan teknologi SEO jejualan.com".

Masih banyak lagi Fitur unggulan lainnya sob, jadi jangan kemana-mana dulu. Berikutnya ini adalah Fitur Marketing Tools, dengan fitur ini Toko onlinemu akan lebih sukses dipromosikan dengan Marketing tools, seperti kirim newsletter gratis, kampanye promo, kode kupon diskon, dan masih banyak lagi. Dengan memanfaatkan fasilitas ini anda akan dengan mudah mempromokan Situs Online Anda ke berbagai media sosial dan email (newsletter) ataupun pemberian kupon Diskon jika membeli produk di toko anda. Sangat mudah dan anda tidak akan kesulitan dalam mengoperasikannya.


Lanjut ke Fasilitas unggulan lainnya brow sist yaitu Konsultasi Langsung dengan Pakar Ecommerce dari Jejualan.com. Pakar Ecommerce akan menganalisa dan memberikan masukan untuk memastikan strategi penjualan di toko anda berhasil. Dengan Konsultasi ini diharapkan Toko Anda akan memiliki pembeli yang lebih banyak dan loyal kepada Toko Online anda.

Fasilitas ini memberikan manfaat yang sangat besar terhadap perkembangan Online Shop anda karena memang bagi anda yang masih awam dalam dunia online akan terasa kebingungan awalnya, namun dengan fasilitas Konsultasi Langsung dengan Pakar Ecommerce dijamin anda akan terbantu untuk memaksimalkan Toko Online anda.

Nimati juga layanan berikutnya yang dipersembahkan Jejualan.com yaitu Fitur Terima Pembayaran dari manapun. Tokomu bisa menerima pembayaran melalui transfer bank, Paypal & kartu kredit. Tentunya ini akan sangat membantu anda yang ingin kemudahan dalam proses transaksi. Pembayaran melalui Transfer Bank tentunya sudah tidak asing lagi dan ini menjadi pilihan bagi banyak orang dalam melakukan pembayaran.

Paypal juga merupakan solusi pembayaran untuk pembeli yang berasal dari Luar Negeri karena kebanyakan orang yang suka dengan Internet pastinya sudah punya akun Paypal.

Masih ada beberapa lagi keunggulan dari Jejualan.com sob jadi tetep lanjutin bacanya ya sambil ngopi juga boleh, Oke fitur berikutnya yang perlu anda tahu adalah Fitur Ongkos Kirim Otomatis, Semua data ongkos kirim dari JNE dan Pos Indonesia akan otomatis tersedia di tokomu. Fitur ini akan secara otomatis sudah ter include kan didalam online shop anda.

JNE dan Pos Indonesia adalah jasa pengiriman unggulan yang banyak dipakai oleh tolo online lainnya dan fasilitas ini sudah ada didalam online shop anda, sehingga calon pembeli akan dapat mengkalkulasikan biaya yang akan dikeluarkan olehnya, dan diharapkan dengan fasilitas ini pembeli kita akan mampu mengira-ngira biaya yang harus dikeluarkannya untuk produk yang akan dibelinya hingga sampai ditempatnya.

Dan serasa tidak kurang-kurangnya fitur layanan yang disediakan di Jejualan.com ini ada satu fitur lagi yang akan membuat toko online anda menjadi semakin sempurna. Terdapat Ratusan Fitur Ecommerce, Ayo buruan daftar sekarang dan dapatkan ratusan fitur ecommerce tercanggih lainnya. Sudah banyak konsumen yang menyatakan kepuasaan nya setelah melakukan pendaftaran di jejualan.com. Proses yang mudah, cepat dan pastinya sangat berkualitas.


RIBUAN TOKO ONLINE SUKSES MENGGUNAKAN JEJUALAN
Jika anda ingin mencobanya terlebih dahulu, jejualan.com juga menyediakan fitur GRATIS yaitu Free/ Gratis 15 Hari!!! untuk anda yang ingin mencobanya sebelum melakukan registrasi.

Untuk melihat demo dan mencoba Toko Online dari jejualan.com anda dapat menuju link dibawah ini dan silahkan anda pilih dengan meng-klik gambar/link.

Demo Toko Online : Disini

Ada 2 pilihan Paket yang ditawarkan di Jejualan.com yaitu paket Gold dan Platinum yang masing-masing dapat anda lihat spesifikasi seperti berikut ini :

Paket pilihan Gold dan Platinum

Spesifikasi Paket Gold :

• Harga Rp 60.000,-/bulan
• Gratis Domain (.com, .net, .org)
• Maksimal Produk 500
• Ratusan Fitur E-Commerce tercanggih 

Spesfikasi Paket Platinum :

• Harga Rp 200.000,- /bulan
• Gratis Domain  (.com, .net, .org)
• Unlimited Produk (Produk tak terbatas)
• Ratusan Fitur E-Commerce tercanggih 

Silahkan anda pilih paket sesuai dengan kebutuhan anda, silahkan klik link berikut untuk melakukan pendaftaran / registrasi untuk pemesanan. 

Klik disini

Info Kontak Jejualan.com

Call :  0857 41 444 520
Sms : 0857 30 700 700
web : www.jejualan.com

Logo Jejualan.com

Oke Bro Sist, selamat menikmati berbagai macam fitur unggulan yang sudah disediakan oleh Jejualan,com dan terimakasih telah berkunjung ke blog aregnoz.blogspot.com.

Artikel diatas diketik langsung oleh Admin Blog ini, diharapkan rekan-rekan tidak ada yang mengcopynya karena artikel ini di ikut sertakan dalam lomba review dari jejualan.com. Terimakasih atas pengertiannya sob.

18 Situs Editing CSS CSS3 dengan Cepat

18 Situs Editing CSS CSS3 dengan Cepat - Situs untuk menunjang Edit Blog dengan CSS dan CSS 3 dengan cepat. Kalian akan sangat dibantu jika menggunakan web atau situs-situs berikut ini. Mulai dari membuat button hover, menu, css gradien, transition dan masih banyak lagi tool untuk memodifikasi blog kita dengan CSS tentunya.

Lanjut Bos, berikut ini daftar ke 18 Blog Situs Editing CSS-CSS3 dengan Cepat.

1. CSS Table Generator
2. CSS3 Generator
3. Ultimate CSS Gradient Generator
4. CSS Border Radius
5. CSS Box Shadow
6. CSS Generators
7. CSS3 Button Generator
8. HTML Tabble Style Generator
9. CSS Button Maker
10. CSS3 Generator
11. CSS3 Transforms
12. CSS3 Button Generator
13. CSS3 Gradiente Generator
14. CSS3 Playground
15. CSS Menu Builder
16. Creative CSS3 Animation Menus
17. CSS3 Generator-Webtutorials
18. CSS Menu Maker

Oke, semoga link-link diatas dapat membantu Anda memaksimalkan Blog kesayangan Anda. Selamat Mencoba dan semoga lancar-lancar sadja, heee.

Cara Mudah Membuat Scrool di Komentar

Cara Mudah Membuat Scrool di Komentar - Cara Paling Mudah membuat Scrool kotak di komentar blog. Related Post adalah sebuah list artikel lainnya yang bisa dibaca oleh pengunjung blog ketika sudah membaca satu artikel, biasanya berada dibawah postingan. Related post ini biasanya diset untuk menemukan artikel sejenis dari label yang di buat oleh admin blog. berikut ini tips Cara Mudah Membuat Scrool di Komentar. 

Cara Mudah Membuat Scrool di Komentar

Pertama silahkan Login ke blog Anda kemudian masuklah ke Edit HTML.

Setelahnya silahkan Centang Expand Widget

Ketiga tekan ctrl+f kemudian ketik <data:post.body/>, jika ada 2 pilih saja yang atas.

Setelah itu Copykan script Scrool Komentar ini di Atas cara ketiga tadi.

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<br/>
<br/>
<H2>Related Post:</H2>
<div class='rscr'>
<div style='margin:0; padding:10px;height:200px;overflow:auto;border:1px solid #ccc;'>
<div id='albri'/>
<script type='text/javascript'>
var homeUrl3 = &quot;<data:blog.homepageUrl/>&quot;;
var maxNumberOfPostsPerLabel = 4;
var maxNumberOfLabels = 10;
maxNumberOfPostsPerLabel = 10;
maxNumberOfLabels = 3;
function listEntries10(json) {
var ul = document.createElement(&#39;ul&#39;);
var maxPosts = (json.feed.entry.length &lt;= maxNumberOfPostsPerLabel) ?
json.feed.entry.length : maxNumberOfPostsPerLabel;
for (var i = 0; i &lt; maxPosts; i++) {
var entry = json.feed.entry[i];
var alturl;
for (var k = 0; k &lt; entry.link.length; k++) {
if (entry.link[k].rel == &#39;alternate&#39;) {
alturl = entry.link[k].href;
break;
}
}
var li = document.createElement(&#39;li&#39;);
var a = document.createElement(&#39;a&#39;);
a.href = alturl;
if(a.href!=location.href) {
var txt = document.createTextNode(entry.title.$t);
a.appendChild(txt);
li.appendChild(a);
ul.appendChild(li);
}
}
for (var l = 0; l &lt; json.feed.link.length; l++) {
if (json.feed.link[l].rel == &#39;alternate&#39;) {
var raw = json.feed.link[l].href;
var label = raw.substr(homeUrl3.length+13);
var k;
for (k=0; k&lt;20; k++) label = label.replace(&quot;%20&quot;, &quot; &quot;);
var txt = document.createTextNode(label);
var h = document.createElement(&#39;b&#39;);
h.appendChild(txt);
var div1 = document.createElement(&#39;div&#39;);
div1.appendChild(h);
div1.appendChild(ul);
document.getElementById(&#39;albri&#39;).appendChild(div1);
}
}
}
function search10(query, label) {
var script = document.createElement(&#39;script&#39;);
script.setAttribute(&#39;src&#39;, query + &#39;feeds/posts/default/-/&#39;
+ label +
&#39;?alt=json-in-script&amp;callback=listEntries10&#39;);
script.setAttribute(&#39;type&#39;, &#39;text/javascript&#39;);
document.documentElement.firstChild.appendChild(script);
}
var labelArray = new Array();
var numLabel = 0;
<b:loop values='data:posts' var='post'>
<b:loop values='data:post.labels' var='label'>
textLabel = &quot;<data:label.name/>&quot;;
var test = 0;
for (var i = 0; i &lt; labelArray.length; i++)
if (labelArray[i] == textLabel) test = 1;
if (test == 0) {
labelArray.push(textLabel);
var maxLabels = (labelArray.length &lt;= maxNumberOfLabels) ?
labelArray.length : maxNumberOfLabels;
if (numLabel &lt; maxLabels) {
search10(homeUrl3, textLabel);
numLabel++;
}
}
</b:loop>
</b:loop>
</script>
</div>
<script type="text/javascript">RelPost();</script>
</div>
</b:if>

Untuk tulisan yang berwarna merah bisa Anda sesuaikan.

Langkah berikutnya ini adalah menempatkan code CSS, cari ]]></b:skin> lalu copy script berikut diatas code tersebut.

.rscr{border: 1px solid rgb(192, 192, 192);padding: 5px;
background-color: #f0f0f0;-moz-border-radius:5px; margin:5px;}
.rscr:hover{background-color: rgb(255, 255, 255);}

Setelahnya silahkan Save template Anda.

Download Pengajian KH Anwar Zahid Terbaru 2013

Download Pengajian KH Anwar Zahid Terbaru 2013 - Kulhu ae lek identik dengan KH Anwar Zahid yang memang mengemaas dengan berbeda gaya pengajian yang walau lucu tetep menyimpan banyak makna yang perlu kita contoh dan ikuti. Sebagian adalah versi Lawas sehingga mohon di ceck dulu agar tidak terjadi download file yang sama.

KH Anwar Zahid, yang berasal dari Dsn. simo Desa simorejo kanor Bojonegoro Jatim. Dab melihat peminat yang sangat banyak yang mencari ceramah beliau saya coba ikut membagi link mp3 nya untuk bisa disave di HP dan didengar kala senggang. Kalau untuk Versi Videonya agan-agan bisa mendownloadnya di You Tube yang sudah tentu banyak yang menguploadnya.

Insya Allah akan terus saya Update linknya agar dapat berbagi dengan agan-agan semua. Oke langsung menuju link dibawah untuk mendownloadnya.

Ceramah Lucu Kyai Bojonegoro KH Anwar Zahid di SMA Persatuan Kedungpring Lamongan

Download

Ceramah Lucu Kyai Bojonegoro Anwar Zahid di Desa Kepohagung, acara Walimatul Ursi.

Download : Part 1, Part 2

Ceramah KH Anwar Zahid di Desa Goreng Rengel Tuban, halal bihalal jamaah Miftahul jannah

Download

Ceramah Lucu Kyai Bojonegoro KH Anwar Zahid di Desa Pucangarum (video .3gp)

Download

Pengajian KH Anwar Zahid Di TPQ Al Mustofa Sambeng Kasiman Bojonegoro (audio .wma)

Download

Ceramah KH Anwar Zahid di Desa Lohgawe

Download

Ceramah KH Anwar Zahid di Blongsong Baureno Bojonegoro
Part 1
Part 2
Part 3
Part 4
Part 5
Part 6
Part 7

INFORMATION !!! TOLONG DI CECK KOLEKSI MP3 NYA, SAYA MINTA MAAF JIKA ADA LINK YANG SAMA DAN BERISI MATERI YANG SAMA, KARENA SAYA BINGUNG MAU MEMBERI JUDUL DARI  CERAMAH PAK ANWAR ZAHID INI. BIG THANKS TO ALL.

Membuat Log in dan Sign up dengan CSS dan J-Query

Membuat Log in dan Sig up dengan CSS dan J-Query - Cara membuat Simple Effective Drop Down Log in dan Sign Up dengan CSS dan Jquery. Anda dapat melihat gambarannya seperti gambar dibawah ini. Anda dapat mengkombinasikan dengan PHP misalkan untuk proyek Website Anda.

Membuat Log in dan Sign up dengan CSS dan J-Query

Tampilan yang dihasilkan nantinya adalah seperti diatas, anda dapat melihatnya dengan mengklik gambar karena saya tidak membuatkan untuk demonya.

Analogi dari proyek membuat drop Log  in

Oke lanjut untuk script dalam membuat Log in dan Sig up dengan CSS dan J-Query sebagai berikut :

HTML

<nav>
<ul>
<li id="login">
<a id="login-trigger" href="#">
Log in <span>▼</span>
</a>
<div id="login-content">
<form>
<fieldset id="inputs">
<input id="username" type="email" name="Email" placeholder="Your email address" required>
<input id="password" type="password" name="Password" placeholder="Password" required>
</fieldset>
<fieldset id="actions">
<input type="submit" id="submit" value="Log in">
<label><input type="checkbox" checked="checked"> Keep me signed in</label>
</fieldset>
</form>
</div>                  
</li>
<li id="signup">
<a href="">Sign up FREE</a>
</li>
</ul>
</nav>

CSS

nav ul {
  margin: 0;
  padding: 0;
  list-style: none;
  position: relative;
  float: right;
  background: #eee;
  border-bottom: 1px solid #fff;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;  
}
nav li {
  float: left;        
}
nav #login {
  border-right: 1px solid #ddd;
  -moz-box-shadow: 1px 0 0 #fff;
  -webkit-box-shadow: 1px 0 0 #fff;
  box-shadow: 1px 0 0 #fff;
}
nav #login-trigger,
nav #signup a {
  display: inline-block;
  *display: inline;
  *zoom: 1;
  height: 25px;
  line-height: 25px;
  font-weight: bold;
  padding: 0 8px;
  text-decoration: none;
  color: #444;
  text-shadow: 0 1px 0 #fff;
}
nav #signup a {
  -moz-border-radius: 0 3px 3px 0;
  -webkit-border-radius: 0 3px 3px 0;
  border-radius: 0 3px 3px 0;
}
nav #login-trigger {
  -moz-border-radius: 3px 0 0 3px;
  -webkit-border-radius: 3px 0 0 3px;
  border-radius: 3px 0 0 3px;
}
nav #login-trigger:hover,
nav #login .active,
nav #signup a:hover {
  background: #fff;
}
nav #login-content {
  display: none;
  position: absolute;
  top: 24px;
  right: 0;
  z-index: 999;  
  background: #fff;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#eee));
  background-image: -webkit-linear-gradient(top, #fff, #eee);
  background-image: -moz-linear-gradient(top, #fff, #eee);
  background-image: -ms-linear-gradient(top, #fff, #eee);
  background-image: -o-linear-gradient(top, #fff, #eee);
  background-image: linear-gradient(top, #fff, #eee);
  padding: 15px;
  -moz-box-shadow: 0 2px 2px -1px rgba(0,0,0,.9);
  -webkit-box-shadow: 0 2px 2px -1px rgba(0,0,0,.9);
  box-shadow: 0 2px 2px -1px rgba(0,0,0,.9);
  -moz-border-radius: 3px 0 3px 3px;
  -webkit-border-radius: 3px 0 3px 3px;
  border-radius: 3px 0 3px 3px;
}
nav li #login-content {
  right: 0;
  width: 250px;
}
/*--------------------*/
#inputs input {
  background: #f1f1f1;
  padding: 6px 5px;
  margin: 0 0 5px 0;
  width: 238px;
  border: 1px solid #ccc;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  -moz-box-shadow: 0 1px 1px #ccc inset;
  -webkit-box-shadow: 0 1px 1px #ccc inset;
  box-shadow: 0 1px 1px #ccc inset;
}
#inputs input:focus {
  background-color: #fff;
  border-color: #e8c291;
  outline: none;
  -moz-box-shadow: 0 0 0 1px #e8c291 inset;
  -webkit-box-shadow: 0 0 0 1px #e8c291 inset;
  box-shadow: 0 0 0 1px #e8c291 inset;
}
/*--------------------*/
#login #actions {
  margin: 10px 0 0 0;
}
#login #submit {   background-color: #d14545;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#e97171), to(#d14545));
  background-image: -webkit-linear-gradient(top, #e97171, #d14545);
  background-image: -moz-linear-gradient(top, #e97171, #d14545);
  background-image: -ms-linear-gradient(top, #e97171, #d14545);
  background-image: -o-linear-gradient(top, #e97171, #d14545);
  background-image: linear-gradient(top, #e97171, #d14545);
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  text-shadow: 0 1px 0 rgba(0,0,0,.5);
  -moz-box-shadow: 0 0 1px rgba(0, 0, 0, 0.3), 0 1px 0 rgba(255, 255, 255, 0.3) inset;
  -webkit-box-shadow: 0 0 1px rgba(0, 0, 0, 0.3), 0 1px 0 rgba(255, 255, 255, 0.3) inset;
  box-shadow: 0 0 1px rgba(0, 0, 0, 0.3), 0 1px 0 rgba(255, 255, 255, 0.3) inset;  
  border: 1px solid #7e1515;
  float: left;
  height: 30px;
  padding: 0;
  width: 100px;
  cursor: pointer;
  font: bold 14px Arial, Helvetica;
  color: #fff;
}
#login #submit:hover,
#login #submit:focus {   background-color: #e97171;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#d14545), to(#e97171));
  background-image: -webkit-linear-gradient(top, #d14545, #e97171);
  background-image: -moz-linear-gradient(top, #d14545, #e97171);
  background-image: -ms-linear-gradient(top, #d14545, #e97171);
  background-image: -o-linear-gradient(top, #d14545, #e97171);
  background-image: linear-gradient(top, #d14545, #e97171);
}
#login #submit:active {   outline: none;
  -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.5) inset;
  -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.5) inset;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.5) inset; }
#login #submit::-moz-focus-inner {
  border: none;
}
#login label {
  float: right;
  line-height: 30px;
}
#login label input {
  position: relative;
  top: 2px;
  right: 2px;
}

J-Query

$(document).ready(function(){
$('#login-trigger').click(function(){
$(this).next('#login-content').slideToggle();
$(this).toggleClass('active'); if ($(this).hasClass('active')) $(this).find('span').html('&#x25B2;')
else $(this).find('span').html('&#x25BC;')
})
});

Oke, selesai dan selamat mencobanya.

thanks TRD for sharing about this tutorial.

Follow my blog with Bloglovin