Tutorial Modifikasi Follow By Email Valid AMP

Tutorial Modifikasi Follow By Email Valid AMP ini mudah sekali di pahami karna tutorial singkat ini, banyak pengunjung yang lupa ada nya blog anda dan cara agar pengunjung blog lama anda tidak lupa dengan blog anda adalah dengan cara mengajak mereka dengan follow blog anda lalu mereka mendapatkan notifikasi setiap kali anda membuat postingan,

Sedangkan AMP blogger tidak selalu menerima semua script yang kamu pasang di blog karna jika kamu asal-asal memasang script di blog yang sudah valid AMP maka blog kamu akan menjadi tidak valid lagi , dan saya sudah membuat cara bagaimana memodifikasi follow by email yang sudah valid dengan amp silakan di perhatikan tutorial di bawah ini

Langkah Pertama

Silahkan masuk ke LAYOUT/TATA LETAK lalu tambahkan widget Follow by Email di sidebar maupun footer.

Langkah Kedua

Silahkan masuk ke EDIT HTML lalu silahkan ganti kode widget Follow by Email dengan kode di bawah ini.

 
           <b:widget id='FollowByEmail1' locked='false' title='Get FREE Updates in Your Inbox' type='FollowByEmail' version='1' visible='true'>
<b:includable id='main'>
<b:if cond='data:title != &quot;&quot;'><h2 class='title'><data:title/></h2></b:if>
<div class='widget-content'>
<div class='follow-by-email-inner'>
<form expr:action='&quot;https://feedburner.google.com/fb/a/mailverify?uri=&quot; + data:feedPath' method='get' target='_blank'>
<table>
<tr>
<td>
<input class='follow-by-email-address' name='email' placeholder='Your Email Address...' title='Your Email Address' type='text'/>
</td>
<td>
<input class='follow-by-email-submit' type='submit' value='Submit'/>
</td>
</tr>
</table>
<input expr:value='data:feedPath' name='uri' type='hidden'/>
<input name='loc' type='hidden' value='en_US'/>
</form>
<p>Submit Your Email Address to Get FREE Our Latest Products Directly in Your Inbox</p>
</div>
</div>
</b:includable>
</b:widget>

Langkah Ketiga

Gunakan kode CSS di bawah ini untuk memodifikasi tampilannya.

 div#FollowByEmail1{border:1px solid #dedede;background:#fff;border-radius:3px;padding:10px;width:100%;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}
#FollowByEmail1 h2{font-family:Roboto,sans-serif;font-size:18px;font-weight:300;text-transform:capitalize;color:#666;margin-bottom:15px;padding:0;line-height:1em}
#FollowByEmail1 p{font-family:Roboto,sans-serif;font-size:14px;font-weight:300;text-transform:capitalize;color:#666;margin-top:15px;padding:0;line-height:1em}
#FollowByEmail1 table{width:100%}
#FollowByEmail1 table td:nth-child(1){width:80%}
#FollowByEmail1 table td:nth-child(2){width:20%}
.FollowByEmail .follow-by-email-inner .follow-by-email-address{background:#efefef;width:100%;height:44px;padding:0 10px;font-family:Roboto,sans-serif;font-size:14px;border:0;outline:0;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}
.FollowByEmail .follow-by-email-inner .follow-by-email-submit{height:44px;font-family:Roboto,sans-serif;text-transform:uppercase;border-radius:0;padding:0 10px;width:100%;font-size:14px;background:#dd5d24;border:0;outline:0;cursor:pointer;color:#fff;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}

selesai semoga bisa membantu


Use parse tool to easy get the text style on disqus comments:

Show ParserHide Parser