Blogger Ever

Add message in Contact Form and Follow By E-mail widget in Blogger without using Javascript

Add message in Contact Form and Follow By E-mail widget in Blogger without using Javascript

As a Blogger user I know that how does the Blogger template works.With my little knowledge I get to know a easy way to add message in Contact Form and Follow By E-mail.As,in my previous tutorials I taught a way but it was done by using Jquery.But this no Javascript and something like that,just simple Hypertext.

For Jquery method,the links are:

For Follow By E-mail

  • So lets begin by saving the template as a backup.
  • Go to Template > Edit HTML
  • Find type='FollowByEmail'
  • Then you will find something like this one.
<b:widget id='FollowByEmail1' locked='false' title='Follow by Email' type='FollowByEmail'>
              <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'>
                      <span class='e-message'>Get our web development and design articles right into your inbox to make sure that you do not miss any aticle.</span>
                      <form action='http://feedburner.google.com/fb/a/mailverify' expr:onsubmit='&quot;window.open(\&quot;http://feedburner.google.com/fb/a/mailverify?uri=&quot; + data:feedPath + &quot;\&quot;, \&quot;popupwindow\&quot;, \&quot;scrollbars=yes,width=550,height=520\&quot;); return true&quot;' method='post' target='popupwindow'>

  • Now find the red part that is <div class='follow-by-email-inner'> and paste the blue part that is <span class='e-message'>Get our web development and design articles right into your inbox to make sure that you do not miss any aticle.</span> just below that.
  • Second step is you can add style in this message according to your self with a class e-message.

For Contact Form

  • Go to Template > Edit HTML
  • Find type='ContactForm'
  • Then you will find something like this one.
<b:widget id='ContactForm1' locked='false' title='Contact Form' type='ContactForm'>
    <b:includable id='main'>
        <b:if cond='data:title != &quot;&quot;'>
           
<h2 class='title'><data:title/></h2>
        </b:if>
        <div class='contact-form-widget'>
            <div class='form'>
                <form name='contact-form'>
                    <p/>
                    <data:contactFormNameMsg/>
                    <br/>
                    <input class='contact-form-name' expr:id='data:widget.instanceId + &quot;_contact-form-name&quot;' name='name' size='30' type='text' value='' />
                    <p/>
                    <data:contactFormEmailMsg/> <span style='font-weight: bolder;'>*</span>
                    <br/>
                    <input class='contact-form-email' expr:id='data:widget.instanceId + &quot;_contact-form-email&quot;' name='email' size='30' type='text' value='' />
                    <p/>
                    <data:contactFormMessageMsg/> <span style='font-weight: bolder;'>*</span>
                    <br/>
                    <textarea class='contact-form-email-message' cols='25' expr:id='data:widget.instanceId + &quot;_contact-form-email-message&quot;' name='email-message' rows='5' />
  • Now find the red part that is <p/> and replace each of them by the blue part that is <span class='contact-message'>MESSAGE GOES HERE</span>.
  • Second step is you can add style in this message according to your self with a class contact-message.
  • Make sure that your change the MESSAGE GOES HERE with your desire text.
Blogger

2013-2016 Copyright Blogger E\ver . Coded, managed and founded by Mohammad Hamza (@hamzadhamiya) . Hosted on Blogger and fonts used are Raleway and Open Sans.