Dalam posting ini saya akan menunjukkan cara
untuk menambahkan widget unik untuk blogger blog.
Seperti yang Anda lihat dari angka itu berisi link ke halaman fan Facebook, Google + halaman danmengikuti twitter tombol, RSS dan yang paling penting sebuah forum langganan yang menarik yang akan lebih meningkatkan jumlah daftar pelanggan. Kami menggunakan CSS dan jQuery untuk memperbaiki penampilan widget ini.
Seperti yang Anda lihat dari angka itu berisi link ke halaman fan Facebook, Google + halaman danmengikuti twitter tombol, RSS dan yang paling penting sebuah forum langganan yang menarik yang akan lebih meningkatkan jumlah daftar pelanggan. Kami menggunakan CSS dan jQuery untuk memperbaiki penampilan widget ini.
Cara memasang Widget ini ke blog anda .
Login ke akun Blogger anda
Klik Rancangan
Klik Tambahkan Widget
Lalu pilih HTML/Javascript
Masukkan kode di bawah ini di dalam HTML/Javascript
<style
type="text/css">.mdbar{width:300px;float:left;background:#FFF
url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiIWch2SOgwIACnAPOU4lILQX-9iTTFteyunlgga5w8dNk2vamuwomWgBUWaAt_0YzYlW8vhkSpn6nJXYmRznw6cNQSvnw6q_pOGFXrR2cK7yFRGhsaDpy4_8-bwt8lIJy-wCwq9h61yE63/s1600/%5Bwww.gj37765.blogspot.com%5Dsidebartop.gif)
top no-repeat;margin:0 0 10px;padding:10px;border:1px solid #DDD;}.mdbar
.md-credit{}.mdbar .md-credit
a{float:right;font-size:10px;font-weight:bold;text-shadow:1px 1px
white;color:#1E598E;text-decoration:none;}.mdbar
h2{background:URL(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhIXifuNdqGTzmMZK7ErokMsMgQVJSK4pfg0_89Mo_Jdg2sChwXqX69kAgo3X3rRclHmTLdP48GbgIi51JieiiHCotzUEPJY9xRFoHYnCICSf8y2hmh5i8xwYmdldgaN2nH4CxqQGpW5gLc/s1600/%255Bwww.gj37765.blogspot.com%255DSUBSCRIBE.gif)
no-repeat;height:50px;margin:0px 0 0px 0;padding:0px 20px 0px
0px;font-size:0px;font-family:Sans-serif, Arial,
Helvetica;font-weight:bold;text-transform:uppercase;color:#ffffff;text-shadow:0
1px 0 #fff;}.mdbar
.count{color:#F17C18;font-size:14px;font-weight:bold;font-family:Helvetica,
Arial;height:40px;line-height:40px;vertical-align:middle;width:310px;padding:0
0px 0 4px;margin:0;}.mdbar .count span.bigcount{color:#F17C18;font-size:24px;font-family:Helvetica,
Arial;line-height:39px;vertical-align:middle;margin:0px;padding:10px 0px 0px
0;}.mdbar .subicons{border-bottom:1px solid #e6e6e6;margin:0px 0 0px
0;float:left;width:300px;font-family:Helvetica, Arial;font-size:12px;}.mdbar .subicons
a{text-decoration:none;color:#333333;}.mdbar .subicons
a:hover{text-decoration:underline;color:#333333;}.mdbar .subicons
.rssicon{border-right:1px solid
#e6e6e6;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiF_r7AZqbDiScRbPDjxNQR8kNmCOUoL-sgQBXNkohpykQmFr0h-nLZcohZF68GAKukl_QxcQQg5jVviLeHPz298o4bWF4yG9aSMXfS9q_Y0msqHn6l7qJ0KrguJ2cEVuJDPEtiZTUjXgMT/s1600/%255Bwww.gj37765.blogspot.com%255Drsssprite.png)
no-repeat;background-position:0px
5px;min-width:2px;height:48px;line-height:57px;vertical-align:middle;float:left;padding:0px
10px 0px 30px;margin:0 0 0 5px;}.mdbar .subicons .googleicon{border-right:1px
solid
#e6e6e6;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiF_r7AZqbDiScRbPDjxNQR8kNmCOUoL-sgQBXNkohpykQmFr0h-nLZcohZF68GAKukl_QxcQQg5jVviLeHPz298o4bWF4yG9aSMXfS9q_Y0msqHn6l7qJ0KrguJ2cEVuJDPEtiZTUjXgMT/s1600/%255Bwww.gj37765.blogspot.com%255Drsssprite.png)
no-repeat;background-position:0px
-37px;min-width:2px;height:48px;line-height:57px;vertical-align:middle;float:left;padding:0px
10px 0px 30px;margin:0 0 0 5px;}.mdbar .subicons .fbicon{border-right:1px solid
#e6e6e6;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiF_r7AZqbDiScRbPDjxNQR8kNmCOUoL-sgQBXNkohpykQmFr0h-nLZcohZF68GAKukl_QxcQQg5jVviLeHPz298o4bWF4yG9aSMXfS9q_Y0msqHn6l7qJ0KrguJ2cEVuJDPEtiZTUjXgMT/s1600/%255Bwww.gj37765.blogspot.com%255Drsssprite.png)
no-repeat;background-position:0px
-79px;min-width:20px;height:48px;line-height:57px;vertical-align:middle;float:left;padding:0px
10px 0px 30px;margin:0 0 0 5px;}.mdbar .subicons
.twittericon{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiF_r7AZqbDiScRbPDjxNQR8kNmCOUoL-sgQBXNkohpykQmFr0h-nLZcohZF68GAKukl_QxcQQg5jVviLeHPz298o4bWF4yG9aSMXfS9q_Y0msqHn6l7qJ0KrguJ2cEVuJDPEtiZTUjXgMT/s1600/%255Bwww.gj37765.blogspot.com%255Drsssprite.png)
no-repeat;background-position:0px
-121px;min-width:20px;height:48px;line-height:57px;vertical-align:middle;float:left;padding:0px
10px 0px 30px;margin:0 0 0 5px;}.mdbar .emailsub{border-bottom:0px solid
#e6e6e6;padding:15px 0 0px 0;float:left;width:100%;font-family:Helvetica,
Arial;}.mdbar .emailsub
.emailicon{background:url(http://www.fordfarmhouse.com/images/email.png)
no-repeat 0 2px;float:left;padding:0px 15px 0px 50px;margin:0 0 0
5px;width:300px;line-height:20px;vertical-align:middle;font-size:14px;color:#333;}.mdbar
.emailsub .emailupdatesform{margin:15px 0 5px
5px;width:300px;float:left;}.mdbar .emailsub .emailupdatesform
input.emailupdatesinput{background:#fff !important;float:left;border:1px solid
#d2d2d2;padding:0px 8px 0px
8px;color:#a19999;font-size:12px;height:25px;width:185px;/*border-radius*/-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;}.mdbar
.emailsub .emailupdatesform input.joinemailupdates{/*linear-gradient*/background:-webkit-gradient(linear,left
top,left
bottom,color-stop(#F9EAD4,0),color-stop(#F9780E,1));background:-webkit-linear-gradient(top,#F9EAD4
0%,#F9780E 100%);background:-moz-linear-gradient(top,#F9EAD4 0%,#F9780E 100%);background:-o-linear-gradient(top,#F9EAD4
0%,#F9780E 100%);background:linear-gradient(top,#F9EAD4 0%,#F9780E
100%);background:-webkit-gradient(linear,left top,left
bottom,from(#57ABFE),to(#F9780E));border:1px solid
#F9780E;text-transform:none;font:bold 12px
arial;color:#fff;height:25px;padding:0 12px 0 12px;margin:0 0 0
5px;/*border-radius*/-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;cursor:pointer;}</style><div
class="mdbar"><h2 class='title'>Subscribe Now!</h2><div
class="count"><span class="bigcount"><a
rel="nofollow" href="http://feeds.feedburner.com/_deejayHan_"><img
style="border:0" alt=""
src="http://feeds.feedburner.com/%7Efc/_deejayHan_?bg=F2F2F2&fg=666&anim=1"
height="26" width="88" /></a> </span>Learn
Free Pro Tricks daily </div><div class="subicons"><div
class="rssicon"> <a rel="nofollow"
href="http://feeds.feedburner.com/_deejayHan_"
target="_blank"> RSS</a></div><div
class="googleicon"> <a
href="https://plus.google.com/u/0/101171096978172622292"
rel="author" target="_blank">
G+</a></div><div class="fbicon"> <a
href="https://www.facebook.com/Bloger-Newbie"
target="_blank"
rel="nofollow">FB</a></div><div
class="twittericon"> <a
href="https://www.twitter.com/a_dechandra" target="_blank" rel="nofollow">Twitter</a></div></div><div
class="emailsub"><div class="emailicon"><p
style=" width:270px; color:#3A3A3A; font-size: 13px; font-weight: normal;
font-family: Helvetica, Arial; padding:0; margin:0;">Receive Our
All Updates In Your Inbox by submitting your Email
ID below.</p></div><div
class="emailupdatesform"><form
action="http://feedburner.google.com/fb/a/mailverify"
method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=blogerseonewbie',
'popupwindow', 'scrollbars=yes,width=550,height=520');return
true"><input gtbfieldid="10"
class="emailupdatesinput" name="email" value="Enter
your email here..." onblur="if (this.value == '')
{this.value = 'Enter your email here...';}"
onfocus="if (this.value == 'Enter your email here...')
{this.value = '';}" type="text" /><input
value="blogerseonewbie" name="uri" type="hidden"
/><input value="Submit" class="joinemailupdates"
type="submit" /></form><span class="md-credit"
style="font-family: Arial, Helvetica, sans-serif;"><a
href="http://blogerseonewbie.blogspot.com" target="_blank"
>Blogger Widgets
>></a></span></div></div> </div>
Lalu Klik Simpan / Save
Keterangan :
- feed_bloger_newbie adalah
Feedburner saya , anda ganti dengan feedburner anda.
- 101171096978172622292 adalah
profil GooglePlus saya , maka anda ganti dengan profil GooglePlus anda
-
Bloger-Newbie adalah
Profil fan page facebook saya , anda ganti dengan profil fan page facebook
anda
-
a_dechandra adalah profil twitter saya , anda ganti dengan twitter anda.Selamat mencoba, Semoga bermanfaat.
No comments:
Post a Comment