Tampilkan postingan dengan label Blogger Widget. Tampilkan semua postingan
Tampilkan postingan dengan label Blogger Widget. Tampilkan semua postingan

Kamis, 14 Februari 2013

Sosial Bookmarking & Kotak Berlanganan Artikel Untuk Blogger

Sosial Bookmarking & Kotak Berlanganan Artikel Untuk Blogger - D-Copy Blog | Hai sobat blogger, seperti pada widget-widget yang sama namun dengan desain yang berbeda, pada tutorial ini kita akan membahas bagaimana membuat sosial bookmarking & kotak berlangganan artikel untuk blogger.

Sosial Bookmarking & Kotak Berlanganan Artikel Untuk Blogger

Langkah Membuat Sosial Bookmarking & Kotak Berlanganan Artikel Untuk Blogger :

  1. Buka akun blogger Anda
  2. Masuk ke menu tata letak, add gadget > HTML/Javascript
  3. Pastekan kode dibawah ini :
<style>
#socialbox{border:2px solid black;
width:270px;padding: 5px 5px 5px 5px;  }
img.beintouch:hover {
    background: none repeat scroll 0 0 #ffbc99;
    border-radius: 16px 16px 16px 16px;
    box-shadow: 0 0 10px #ffbc12;
}
.emailtext {
    background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgq-iYLwEsqfJi5aNbIeRGZOtZcBWq4nomNw5y6UzU3aHkzACVmD1AIFtEW_MKC9zr6MUiNqx1UOSe1KHgg1swvHaCheA5JIaaqF3itMTn9onP3cvfHMLE8YzAzUkIzQFw4sIvwPrcG604/s1600/mailbox.png") no-repeat scroll 4px center transparent;
    border: 1px solid #7E4E27;
    border-radius: 4px 4px 4px 4px;
    box-shadow: 1px 1px 4px #7E4E27 inset;
    color: #444444;
    font-weight: bold;
    margin-left: 2px;
    padding: 7px 15px 7px 35px;
    text-decoration: none;
    width: 120px;
}
.ebutton {
    background: #D55959;
    border: 1px solid #D3D3D3;
    border-radius: 4px 4px 4px 4px;
    color: #FFFFFF;
    cursor: pointer;
    font-weight: bold;
    margin-left: -18px;
    margin-top: 5px;
    padding: 6px 15px;
    text-decoration: none;
    text-shadow: 1px 1px 0 #000000;
}
</style>
<br />
<div id="socialbox">
<table align="" cellpadding="1px" cellspacing="0px" style="width: 290pxpx;"><tbody>
<tr><td>
<a href="http://facebook.com/Bloggertrix" rel="nofollow" target="_blank"> <img class="beintouch" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhNjOM6FmNnAaCF1wJ7J-n4SPS6uhyphenhyphenmsPJA6bkbuL61xV6itzTng84StByJZYZ2V6VGlef0sA93K9UL12QGIFnsYLFH1hBHkYm2kTta3cev5hwAR8VyUgegAUj_FcJtlQvymN1OIOuix_M/s1600/bloggertrix-facebook-icon.png" /></a></td><td>
<a href="http://twitter.com/ID Twitter Anda" rel="nofollow" target="_blank"><img class="beintouch" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg5GT-UoKtsiAhcbsv01_rodfVyYQKVEbdpBQQw49_ireY0jdIxWvtr_YtYoxjl2yIwkY1b96_HOwd3IPXzgyWsPp1xOygRXl8aTvZcFbUdvZwTzdqCRK6xAbbItzpKX7Uaq2Mw-I1OSEY/s1600/bloggertrix-twitter-icon.png" /></a></td><td>
<a href="http://pinterest.com/ID Pinterst Anda" rel="nofollow" target="_blank"><img class="beintouch" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEho2BaMf40vEl1V5sHlaPSSlvJ5gMwVqH_-a_bKQxDnfjhMyFG9AYOPgtE2iMHQK2u-r2CY2nYw3PRUrd4GkUkR2U0vF2SakixNbaNwMyP_Kh5-cKzn7srZ0CwOu15AvA3F8-68zvFRwuc/s1600/bloggertrix-pinterest-icon.png" /></a></td><td>
<a href="URL Google+ Anda" rel="nofollow" target="_blank"><img class="beintouch" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjzVi9Vd2UC2KpJXjVCLFAYl2ZdG4jj60K2X49Q8n_lb5O3GVjXwWn9NQKpUijZs2fobf-cXzVE-om9lYwm0WDIaKWaFs2tD8ozno5lch_gOA5Jj_YAC8WGMWn6HQElUHrtIXxCNKFWpJY/s1600/bloggertrix-google-icon.png" /></a></td><td>
<a href="http://feeds.feedburner.com/ID Feedburner Anda" rel="nofollow" target="_blank"><img class="beintouch" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEghhVhOUcMIwjzUa939TSHaWiwdhIS82_6mZ4aRIm0ThfQ_bwJP9mcEwWdqMQpaPWc46Tzuo-1REjvT71Oi7yZpjGQDkLclBtPrvl5iIXyc6wtNFWurMnRh8TQO-UqsuXiu65j6zLuVqU8/s1600/bloggertrix-rss-feed-icon.png" /></a></td></tr>
</tbody></table>
<div>
<center>
<b>Dapatkan Artikel Kami Dengan Email</b></center></div>
<form action="http://feedburner.google.com/fb/a/mailverify" class="emailform" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=ID Feedburner Anda', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" style="margin: 0pt;" target="popupwindow">
<input name="uri" type="hidden" value="ID Feedburner Anda" />
<input name="loc" type="hidden" value="en_US" />
<input class="emailtext" name="email" onblur="if (this.value == &quot;&quot;) {this.value = &quot;Enter your email...&quot;;}" onfocus="if (this.value == &quot;Enter your email...&quot;) {this.value = &quot;&quot;}" type="text" value="Enter your email..." />
<input alt="" class="ebutton" title="" type="submit" value="Subscribe" />
</form>
</div>

Keterangan :
Ganti kode-kode yang sudah diwarnai diatas, sesuai dengan kebutuhan Anda.

    4.  Save template Anda.

Jumat, 28 Desember 2012

Cara Buat Tombol Widget "Add To Blogger" untuk Blogger

Cara Buat Tombol Widget "Add To Blogger" untuk Blogger - D-Copy Blog | Seperti yang Anda lihat dalam beberapa blog bahwa mereka memberikan tombol untuk menambahkan kode HTML JAVASCRIPT bukannya menunjukkan code. Jadi saya di sini untuk menunjukkan bagaimana mereka melakukan hal ini dalam pengkodean yang sangat mudah mudah. Anda langsung saja nikmati tombol ini.

Add To Blogger Button

Langkah :

  1. Buka akun blogger Anda
  2. Masuk ke menu tata letak
  3. Add gadget
  4. HTML/Javascript > pastekan kode dibawah ini :
<center>
<form action="http://www.blogger.com/add-widget" method="post" target="_blank">
<span style="font-size: large;">
<b>Widget Title: </b>
</span>
<input name="widget.title" size="25" type="text" value="Widget Title Here" />
</center>
<br>
<center>
<input name="go" style="font-size: 20px; width: 180px;" type="submit" value="Add to Blogger" />
<textarea name="widget.content" style="display: none; height: 0px; width: 0px;">
+++Masukkan Kode Anda Disini+++
</textarea>
<input name="infoUrl" type="hidden" value="URL Situs Anda disini" />
<input name="logoUrl" type="hidden" value="URL Gambar Anda disini - Contoh untuk Favicon : http://d-copy.blogspot.com/favicon.ico" />
</form>
</center>
Keterangan :
Ganti kode yang diwarnai diatas sesuai dengan keterangan yang terlah diberikan.

     5. Save template Anda.