Gudang Tutorial Blog

Masih seperti artikel kemarin tentang modifikasi form feedburner, kali ini saya akan berbagi modifikasi form feedburner yang bisa di letakkan di bawah postingan blog.

1. Login blogger
2. Template > edit html
3. cari kode <data:post.body/> dan letakkan kode css dan html berikut di bawah <data:post.body/>

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style>
form.feedburner{
margin:20px 0 0;
display:block;
clear:both;
}

.style{
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgNwxNs29mbh7ivviqLMG40CSbDdPvnYsDk_L8wwszMFm00e3nfmZGGxK8qw6XTAEsgH_pgCofNyKqf-V44WSf0ra4qeR1woE5GsJn-D87kXrfdJMakCpCCn6cPK4aoFK5LZm7YkWrdVGY/s1600/email-icon.png) no-repeat scroll -8px center #fff;
padding:7px 15px 7px 35px;
color:#666;
font-weight:bold;
text-decoration:none;
border:1px solid #D3D3D3;
} .submit{
background-color:#ffc477;
-webkit-border-top-left-radius:20px;
-moz-border-radius-topleft:20px;
border-top-left-radius:20px;
-webkit-border-top-right-radius:20px;
-moz-border-radius-topright:20px;
border-top-right-radius:20px;
-webkit-border-bottom-right-radius:20px;
-moz-border-radius-bottomright:20px;
border-bottom-right-radius:20px;
-webkit-border-bottom-left-radius:20px;
-moz-border-radius-bottomleft:20px;
border-bottom-left-radius:20px;
text-indent:-3.44px;
border:1px solid #eeb44f;
display:inline-block;
color:#ffffff;
font-family:Arial;
font-size:16px;
font-weight:bold;
font-style:normal;
height:27px;
line-height:27px;
width:86px;
text-decoration:none;
text-align:center;
}

#emailwidget-outer {
background: none repeat scroll 0 0 #fff;
border: 1px solid #D3D3D3;
padding: 8px;
width:520px;
}

#emailwidget-outer td{
padding:3px 0;
}

</style>
<center>
<div id='emailwidget-outer'>
<div id='emailwidget'>
<table style='border:none; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;' width='100%'>
<tbody>
<tr style='border:none; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;'>
<td align='left' style='border:none; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;'> <p style='color:#666; font-weight: bold; font-size: 18px; margin:0px 0px 5px 0px; '>Get free daily email updates!</p>

<form action='http://feedburner.google.com/fb/a/mailverify' class='feedburner' method='post' onsubmit='window.open(&apos;http://feedburner.google.com/fb/a/mailverify?uri=mig33eagle&apos;, &apos;popupwindow&apos;, &apos;scrollbars=yes,width=550,height=520&apos;);return true' style='margin: 0pt;' target='popupwindow'>

<input name='uri' type='hidden' value='mig33eagle'/>

<input name='loc' type='hidden' value='en_US'/>

<input class='style' 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='submit' title='' type='submit' value='Submit'/>
</form>
</td>

<td style='border:none; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;'><p style='color:#666; font-weight: bold; font-size: 14px; margin:0px 0px 5px 0px; '>Follow us!</p>

<a href='http://feedburner.google.com/fb/a/mailverify?uri=mig33eagle' rel='nofollow' target='_blank' title='Suscribe to RSS Feed'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgSfIBFX64XAFUqoQ3T6uXHHeuH5ej_luCZukluMF05IChVXyi6ScV15U_htzwcnBvYbxpBsy3nDWDEGLLhqSMLUHeu5AYFvcz-JmjUUVG2uxD7JhTUPW8VsZMp8gLHCwcwlwrnNKSv8e8/s200/rss.png'/></a>

<a href='http://twitter.com/mig33eagle' rel='nofollow' target='_blank' title='Follow us on Twitter'><img src=' https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJBovb5LCO_w3N6camwtYxxA8lfMGB-P0OoWyuEM0q59KP0nfg_-1aSQDiWjColLzvt_Vh5g6dqpiOGmmS42lVxSCCUjpvsi00b0UPODYZWLH_poFdXCV8PSrvR2vLFP1GexkWMVA6o8w/s1600/twitter.png'/></a>

<a href='https://www.facebook.com/pages/Mig33-Eagle/327653677253564' rel='nofollow' target='_blank' title='Follow us on Facebook'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhLTs0GPuMZDz4WdHToJm2IBGkSvZnff5-LSA4fnCjS_xKsriZMbmHBtEGe7x4Xfx_Y6FSLpRKgWqrftW_vK0nvjmfMaCVHAF5vaLLPz4i1H3BiUl2t0U2FfHxTnggHeWH_1rimPSbzp5I/s200/facebook.png'/></a>

<a href='https://plus.google.com/u/0/+AshNareswari/posts' rel='nofollow' target='_blank' title='Follow us on Google+'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgVNGTIca0Qo8iXEQV8VkLydCVuiZSeCwpuAO-FF43EdW_n9ccRbP3-qsHqDpeN7rPLrYcOk0VR7EoXNJct9ErRXKGKUdgglE-qtY8ZUl2Zte2WW2DAKvRY8hqhpx95ie_kBbUHir_Gtk4/s1600/google+.png'/></a>

</td>
</tr>
</tbody></table>

<div align='right'><span style='font-style: italic; font-size: 8px; color: solid #3333FF;'><a href='http://www.mig33eagle.com/2014/02/form-feedburner-di-bawah-post-blog.html' style='text-decoration: none;' target='_blank'><font color='#3333FF' decoration='none'>Get this widget</font></a></span></div>
</div></div>

</center></b:if>

4. Simpan template

note:
Ganti yang berwarna di kode atas dengan akun sosial anda.

Hasilnya:

Eagle Injector 11 Februari 2014



Update kali ini work di sc ISAT, XL, TSEL with PREMIUM PROXY (di tkp ane)

Silahkan bagi member yang mau download.

1. Download Eagle Injector 11 Februari 2014

2. Extract (password RAR: www.mig33eagle.com)

3. Copy dan Replace 'Injector.exe' yang ada di folder installan Eagle Vpn 'C:\Program Files\Eagle VPN\'

4. Jalankan seperti biasa.



 Note: HANYA WORK BUAT MEMBER EAGLE SSH :D



 Salam.

Disini ane mau share cara erotin kartu TSEL biar qos nya naek sampe 8mbps.

Karena deffaultnya qos TSEL yang ga punya paket apapun cuma 512kbps :D

Berikut langkah-langkahnya.

1. Siapin sc tsel (recomended S*MPATI, soalnya qos nya lebih besar daripada As)

2. Sms ketik FLASH ON 3000 ke 3636, tunggu ada sms lalu  balas FLASH YA.

3. Call *363*3*1*2*1#

4. Call *999*501#, tunggu ada sms lalu balas FLASH YA.

5. Sms ketik FLASH OFF ke 3636 tunggu ada sms lalu , balas FLASH YA.



Lalu untuk cek apakah berhasil atau tidak Sms ketik UL INFO kirim ke 3636.

Jika mendapat balasan 'Sisa Fair Usage anda berlaku hingga E99' maka QOS kartu ente udah 8mbps.

Jika belum silahkan ulangi lagi ampe bisa :D



 Salam.

Kemarin saya telah menuliskan tutorial tentang modifikasi email subscriber.

Sama dengan form feedburner. Widget ini diperuntukkan bagi yang ingin memperoleh konten gratis langsung dikirimkan via email..



Modifikasi form feedburner kali ini simpel:

1. Login blogger

2. Layout > add gadget >html/javascript

3. Masukkan kode css dan html berikut

<style>

.form {

border:1px solid #ccc; /* warna garis pinggir form */

background: #ffffff /* warna background form */

padding:3px; /* spasi form */

width:380px; /* panjang form */

height:180px /* tinggi form */

}

.rss {

background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiK_Pw0Caj2KFGG4IgkYk74KH5papZgx0umFgfT9u8iLcnWTzBPWl4PInegLbw0y1aEyhjupo-oCKsOpX4f2Lz6KyS7lkrXlZ5Gksn-jLxIAtOnhfVIC2laLr4OizglyocgKtZQQGevikI/s1600/images.png") no-repeat bottom right;

}

.button {

background: #006699; /* warna tombol subscribe */

color: #FFFFFF; /* warna font subscribe */

font-size: 11px; /* ukuran font subscribe */

font-family: Arial, Tahoma, Verdana; /* font subscribe */

margin-left: 5px; /* margin kiri tombol subscribe */

border: 1px solid #234B69; /* warna garis pinggir tombol subscribe */

padding:3px 5px 3px 5px; /* jarak antara font dengan garis pinggir tombol subscribe */

font-weight: bold;

}

</style>

<div class="form">

<div class="rss">

<div style="font-weight:bold; color:#333333; font-size:15px; padding:10px 5px 5px 10px;"><a href="http://feeds.feedburner.com/mig33eagle"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg13TZtvdU7qjj0Icnr9bL-fUwkFpjNrEuzh4zNFAEZkRQ3UEhvw431ZKnMxoHdqDMY_hIT-bEMWRPp62yRhOxXe1xNr0vVWyL0K6F84jf7p3v3Xo6QOI3Vcwj4efmms6e9xaQMoSEwpOMJ/s800/005.png" /></a> <a href="http://feeds.feedburner.com/mig33eagle">GET UPDATE VIA RSS</a></div>

<div style="font-weight:bold; padding:10px 10px;">GET UPDATE VIA EMAIL</div>

<div style="padding-left:10px">Dapatkan kiriman artikel terbaru langsung ke email anda!</div>

<form action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=mig33eagle', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true"><div style="padding-left:10px; padding-bottom:10px; padding-top:10px"><input type="text" style="width:160px; height:18px" name="email" onblur="if (this.value == &quot;&quot;) {this.value = &quot;Ketik email anda disini...&quot;;}" onfocus="if (this.value == &quot;Ketik email anda disini...&quot;) {this.value = &quot;&quot;}" type="text" value="Ketik email anda disini..." /> <input type="hidden" value="mig33eagle" name="uri" /><input type="hidden" name="loc" value="en_US" /><input class="button" type="submit" value="GO" /></div></form>

<div style="padding-left:10px"><a href="http://feeds.feedburner.com/mig33eagle"><img src="http://feeds.feedburner.com/~fc/mig33eagle?bg=ff7c00&amp;fg=444444&amp;anim=0" width="88" height="26" style="border:0" alt="" /></a></div>

</div></div>

mig33eagle berwarna cyan diatas adalah nama akun feedburner, ganti saja dengan nama akunfeedburner anda.

4. Simpan dan selesai.



Hasil dari kode css dan html di atas:

Label pada blog dapat di katakan sebagai kategori. Dan fungsi label adalah mengelompokkan postingan berdasarkan kategori.



Beberapa hari yang lalu saya pernah posting cara membuat label dengan thumbnail bulat efek berputar.

Tutorial kali ini tentang label dengan thumbnail kotak simpel.



Caranya,simak yang berikut:

1. Login blog

2. Template > Edit html

3. Letakkan kode css berikut di atas  ]]></b:skin>

img.label_thumb {

float:center;

padding:3px;

background:#CCC;

border:1px solid #A4A4A4;

width:100px;

height:75px;

margin-right:10px;

margin-top:10px }



img.label_thumb:hover {

opacity:0.8;

filter:alpha(opacity=80);

-moz-opacity:0.80;

-khtml-opacity:0.8 }

4. Tambahkan kode script di bawah  ]]></b:skin>

<script type='text/javascript'>

//<![CDATA[

function labelthumbs(json){document.write('<div>');for(var i=0;i<numposts;i++){var entry=json.feed.entry[i];var posttitle=entry.title.$t;var posturl;if(i==json.feed.entry.length)break;for(var k=0;k<entry.link.length;k++){if(entry.link[k].rel=='replies'&&entry.link[k].type=='text/html'){var commenttext=entry.link[k].title;var commenturl=entry.link[k].href;}

if(entry.link[k].rel=='alternate'){posturl=entry.link[k].href;break;}}

var thumburl;try{thumburl=entry.media$thumbnail.url;}catch(error)

{s=entry.content.$t;a=s.indexOf("<img");b=s.indexOf("src=\"",a);c=s.indexOf("\"",b+5);d=s.substr(b+5,c-b-5);if((a!=-1)&&(b!=-1)&&(c!=-1)&&(d!="")){thumburl=d;}

else thumburl='';}

document.write('<a href="'+posturl+'" title="'+posttitle+'"><img class="label_thumb" src="'+thumburl+'"/></a>');

if(i!=(numposts-1))

document.write('');}

document.write('</div>');}

//]]>

</script>

5. Simpan template

6. Masuk ke layout > HTML/JAVASCRIPT

7. Copast kode berikut

<script type='text/javascript'>var numposts = 6;</script>

<script type="text/javascript" src="/feeds/posts/default/-/Blogging?orderby=updated&alt=json-in-script&callback=labelthumbs"></script> 

Note:

* var numposts = 6 adalah jumlah thumbnail yang akan di tampilkan

* ... /feeds/posts/default/-/Blogging?.... adalah nama label yang akan di tampilkan



8. simpan dan lihat hasilnya.

Eagle Injector 9 Februari 2014



Update kali ini work di sc ISAT, XL, TSEL (di tkp ane)

Silahkan bagi member yang mau download.



1. Download Eagle Injector 9 Februari 2014

2. Extract (password RAR: www.mig33eagle.com)

3. Copy dan Replace 'Injector.exe' yang ada di folder installan Eagle Vpn 'C:\Program Files\Eagle VPN\'

4. Jalankan seperti biasa.



 Note: HANYA WORK BUAT MEMBER EAGLE SSH :D

 Salam.

Apa FeedBurner Email?



Email FeedBurner adalah layanan yang memungkinkan penerbit untuk menyampaikan konten pakan mereka ke pelanggan melalui email.



Siapa yang butuh layanan ini dan mengapa?



Blogger, podcasters, dan penerbit pribadi dan komersial yang ingin pelanggan untuk memiliki metode alternatif untuk menerima konten umpan - pengaturan akrab inbox email mereka.



Apa yang akan membantu penerbit bahwa mereka tidak dapat lakukan hari ini?



Hari ini, jika pelanggan ingin membaca / melihat / menonton konten online sindikasi, mereka biasanya harus pergi ke mana konten-host atau tahu bagaimana untuk berlangganan feed dan mengkonsumsi konten dalam agregator atau pembaca (misalnya MyYahoo!, FeedDemon, iTunes, dll) Dengan kemampuan langganan email, pelanggan kini dapat menerima informasi ini dalam inbox mereka, mirip dengan e-newsletter.



Bagaimana cara kerjanya?



Dari dalam Publicize tab aplikasi, penerbit mengaktifkan layanan dengan mudah klik, kemudian paste kode ke dalam template blog atau situs web. Lihat apa ini tampak seperti di blog atau dibangun langsung ke halaman BrowserFriendly Anda . Sebuah digest harian yang berisi konten baru dari feed dikirimkan ke pelanggan yang telah memilih untuk menerima konten ini. Lihat email sampel .



Mengapa FeedBurner Email begitu istimewa?



Selain yang didukung oleh segel FeedBurning persetujuan, email FeedBurner memiliki fokus yang sangat spesifik - itu adalah benar-benar layanan publisher. Tidak ada halaman arahan pelanggan di FeedBurner dan tidak ada dashboard bagi pelanggan untuk masuk ke dan mengelola email mereka. Selain kesederhanaan dalam konfigurasi dan pengiriman, FeedBurner Email olahraga fitur utama sebagai berikut:



Mudah dibaca, teks atau email HTML berisi pesan-pesan terbaru.

Pesan sebagian besar "brandless," yang berarti bahwa a) email dikirim sebagai "dari" penerbit, tidak FeedBurner dan b) tidak ada sundulan FeedBurner dan hanya sangat ringan "yang disampaikan oleh" footer.

Penerbit memiliki akses ke alamat email yang berlangganan feed mereka, dan mereka dapat mengekspor alamat ini dan bergerak dari FeedBurner ke layanan lain setiap saat.



Nah agar form feedburner tidak membosankan, kita modif aja. Kali ini saya kasi nama style form email subscription 1. Karena, kalau ada kesempatan otak atik lagi, saya akan bikin style yang lain.



Cara Modifikasi Form Email Subscription:

1. Login blogger

2. Layout >HTML/javascript

3. Copast css dan html berikut

<style type="text/css">

.subscribe_outer {

     background: url("http://dl9.glitter-graphics.net/pub/1317/1317309lsk5aj07xu.gif") no-repeat ;

float:left;margin: 0px -10px;padding: 5px 0px;

border:double 3px #0099ff;

-moz-border-radius: 2px;

-webkit-border-radius: 2px;

border-radius: 2px;

}

.subscribe_wrapper {

     background: url("http://dl9.glitter-graphics.net/pub/1317/1317309lsk5aj07xu.gif") no-repeat transparent;font-size: 15px;line-height: 20px;

text-align:center;padding: 38px 50px 18px 38px;



}

.stext {

     color: #000;

font-weight:bold;

}

.sidebar .subscribe_wrapper h5,.subscribe_wrapper h5 {

     color:#FF7F29;

font-size:18px

}

#btntEmailsub {

     clear: both;display: block;margin: 10px 0px;

}

form.btntEmailform {

     clear: both;display: block;margin: 20px 0px 0px;width: auto;

}

.emailText {

     background: url("http://lh6.googleusercontent.com/-mrp8bAEiUas/ULc875mjBCI/AAAAAAAAAAY/ORduMx38cYI/s800/email.png") no-repeat scroll 10px center #FFFFFF;border-radius: 4px 4px 4px 4px;border: 0px none;

     box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.05) inset;

     color: #444444;margin: 0px 0px 15px;padding: 10px 40px;text-decoration: none;width: 70%;

}

.emailButton {

    -moz-border-radius:3px;

    -webkit-border-radius:3px;

    border-radius:3px;

    -moz-box-shadow:1px 1px 2px rgba(0, 0, 0, 0.5);

    -webkit-box-shadow:1px 1px 2px rgba(0, 0, 0, 0.5);

    box-shadow:1px 1px 2px rgba(0, 0, 0, 0.5);

    background: -moz-linear-gradient(19% 65% 90deg,#0087B4, #0099CC, #0099CC 51%);

    background: -webkit-gradient(linear, 0% 45%, 0% 60%, from(#0099CC), to(#0087B4));

    color:#f0f0f0;float:left; font-family:arial,helvetica,sans-serif;font-size:14px;font-weight:bold;

    text-shadow:0 1px 1px rgba(0, 0, 0, 0.5);

    border: 1px solid #267ed4;padding: 10px 40px;

    cursor: pointer;

    width:100%;

}

.emailButton:hover {

    background: -moz-linear-gradient(19% 65% 90deg,#0082AD, #0099CC, #0099CC 51%);

    background: -webkit-gradient(linear, 0% 45%, 0% 60%, from(#0099CC), to(#0082AD));

    color: #f1f1f1;

}

</style>

<div class="subscribe_outer">

 <div class="subscribe_wrapper">

  <h5>Subscribe Via Email</h5>

  <p class="stext">Subscribe to our newsletter to get all the latest updates to your inbox..!</p>

    <div id="btntEmailsub">

    <form target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=[YOUR_FEED_NAME]', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" method="post" action="http://feedburner.google.com/fb/a/mailverify">

    <input type="hidden" value="[YOUR_FEED_NAME]" name="uri">

    <input type="hidden" value="en_US" name="loc">

    <input type="text" value="Enter your email..." onfocus="if (this.value == &quot;Enter your email...&quot;) {this.value = &quot;&quot;}" onblur="if (this.value == &quot;&quot;) {this.value = &quot;Enter your email...&quot;;}" name="email">

    <input type="submit" value="Signup Now!" title="" class="emailButton"><br/>

    </form>

    </div>

  </div>

</div>

[YOUR_FEED_NAME] = nama akun feedburner, misal "mig33eagle"



4. Simpan



hasilnya dari style form di atas:

Atribut ALT dirancang untuk menjadi sebuah deskripsi teks alternatif untuk gambar untuk Menampilkan teks ALT sebelum foto tersebut dimuat dalam browser utama dan bukan foto dalam berbasis teks browser. ALT adalah elemen yang dibutuhkan untuk gambar dan hanya dapat digunakan untuk tag gambar karena tujuan khususnya adalah untuk menggambarkan gambar. Fungsi dari ALT sendiri adalah menggambarkan citra dan informasi judul dalam tabel, link, dan menggambarkan tujuan dari elemen saat menggunakan kata kunci bertarget.



ALT dan TITLE melakukan tugas ganda yaitu meningkatkan upaya promosi dan aksesibilitas situs Anda. Dikarnakan Search engine spider menyukai kata kunci. Jadi gunakanlah atribut ALT dan Title disetiap kalian memposting suatu halaman diblog kalian karna itu bisa mempermudah mesin pencari untuk mengindex setiap postingan dari blog anda



Sedari kemarin demi seo friendly saya edit memberi title dan alt gambar pada postingan di semua post blog.

Fiuh... manual euy. Cape juga edit 300 postingan dan edit gambarnya satu-satu.

Akhirnnya dapat juga script memberi tags title dan alt secara otomatis di setiap gambar post blog.



Penasaran gmna caranya?



1. Login blogger

2. Edit template > edit html

3. Letakkan script berikut di atas kode </body>

<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js' type='text/javascript'/>

<script type="text/javascript">

//<![CDATA[

$(document).ready(function() {

 $('img').each(function(){

 var $img = $(this);

 var filename = $img.attr('src')

 if (!$img.attr("title") || $img.attr("title") == ""){

 $img.attr('title', filename.substring((filename.lastIndexOf('/'))+1, filename.lastIndexOf('.')));

}

  if (!$img.attr("alt") || $img.attr("alt") == ""){

 $img.attr('alt', filename.substring((filename.lastIndexOf('/'))+1, filename.lastIndexOf('.')));

}

 });

});

//]]>

</script>

note: jika di template anda sudah ada jquery librarynya, maka anda tidak perlu mengcopy

 <script src='https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js' type='text/javascript'/>



4. Simpan template



Udah deh, check aja semua gambar yang ada di post elu. Selamat mencoba tutorial nya...