On Blogger, a follow/subscribe by email gadget can be used, which incorporates the veteran Google's owned Feedburner services, to handle deployment of your blog post feed to your subscribers. Even though it is old, yet still relevant as based on our experience, we still receive massive traffic from various feed reader/technology to our many blog - with minimal effort.
By default, Blogger Follow by Email gadget/widget uses javascript to handle user interaction on a Blogger blog page. Since that user written javascript is prohibited on an AMP HTML page, this gadget needs some updates in order to validate as an AMP ready page in search results.
Blogr-AMP blog also covered & shared how to integrate & convert your Blogger template, use AMP components/tags and you can find it here at Getting Started, Create your 1st AMP Blogger Pages tutorial series.
Below are the detail HTML & code snippets/mark-ups to add Follow by Email gadget on Blogger template with AMP HTML integrations. CSS reference have been provided to easily add in your own custom styles ( at
amp-custom
style tag ) according to your blog layout.Get Your Unique PassCode
1 PassCode used on All exclusive datas in this AMP Blogger Blog!
PassCode Delivered by Google's FeedBurner | Privacy Policy | Terms
Show & Copy AMP HTML Subscribe by Email Gadget
If you have a unique PassCode from earlier datas, please re-enter your PassCode. Thank You.
How to Use
Adding new widget in Blogger's Template HTML:-
- At Blogger Dashboard > go to Template
- Backup template before proceeding
- Click Edit Template
- At template
<body>
find any<b:section> ... </b:section>
Blogger template layout tags. - Copy above codes inside any
<b:section>
tag - At
id='SubscribeByEmail**'
, replace**
with a unique integer/number. - Click Save Template
- Edit gadget title at dashboard > Layout
- Save widget
- Drag & drop widget anywhere in template Layout.
- Save Arrangements.
- Preview your changes.
Behavior
- No changes on application at Blogger > Layout.
- Edit widget title to display as the widget title.
- Go to https://feedburner.google.com, select blog Feed (by name) & custom set feed delivearables/subscribers management accordingly.
Improvements
- Removed all javascript codes used on existing Subscribe by Email gadget.
- Simplified widget, form & input fields with easy referenced class names (refer below)
- Blogger assigned blog feed URL's sync with feed account management automatically.
Common Styles
Common name references to use for Follow by Email widget for styling. Add CSS within
<style amp-custom="amp-custom"/>
tag in Blogger's > Template HTML.#FollowByEmail*
{ } #FollowByEmail*
h2 { } .follow-by-email-address { } .follow-By-email-submit { }
Where
*
is the unique number/integer assigned for the Follow by Email widget.If you find any issues, please do not hesitate to leave a comment below or contact us here.
Working to get connected...
Ooops! We're having trouble connecting. Please refresh your page or contact us...