Subscribe my YouTube channel: Click to Subscribe!

How to Create a Contact Us Page on Median UI Blogger Template - Satya Ki Pathshala

Median UI Blogger Template पर Contact Us पेज कैसे बनाये, आर्टिकल पढ़के समझमे आ जायेगा। मैंने अपने ब्लॉग को जैसे कस्टमाइज किया है उसका वीडियो जल्दी आपको
Please wait 0 seconds...
Scroll Down and click on Go to Link for destination
Congrats! Link is Generated
Median UI Blogger Template पर Contact Us पेज कैसे बनाये | How to Create Contact Us Page on Median UI Blogger Template - Satya Ki Pathshala

You all know that the Median UI Blogger Template is the best blogger template in today's time, which is owned by jagodesain. But if you want to customize it, then it is very important for you to have knowledge about coding. You will have to enable most of its features by coding yourself.

One of these is the contact page. How to make a Contact Us page on Median UI Blogger Template You will understand by reading the article about what you have to do to make a good contact page. You will soon get the video of the way I have customized my blog on my YouTube channel.

How to Create aContact Us Page on Median UI Blogger Template

First of all, you have to remove your blog id. For this, you have to right-click on the icon of your blogger and open it in a new tab.



Now you will get to see your blog id in the URL address.  




Now copy this code and save it in notepad. We will need this to create our contact page.

Now you have to create a new page. Whose name you have to give contact. Now you have to copy the code given below and paste it into the HTML section of that page.

Median UI Blogger Template V1.6 Contact Us page code


<!-- Median Ui v1.6 Contact Page Codes by SKPathshala --> 

<div class='ContactForm s-2' id='ContactForm1'>
  <form name='cForm'>
    <div class='cArea'>
      <label>
        <input class='cInpt cName' id='ContactForm1_contact-form-name' name='name' type='text'/>
        <span class='n'>Name</span>
      </label>
    </div>
    <div class='cArea'>
      <label>
        <input class='cInpt cMail' id='ContactForm1_contact-form-email' name='email' type='email'/>
        <span class='n req'>Email</span>
      </label>
      <span class='h'>Valid email required</span>
    </div>
    <div class='cArea'>
      <label>
        <textarea class='cInpt cMsg' id='ContactForm1_contact-form-email-message' name='message' rows='3'></textarea>
        <span class='n req'>Message</span>
      </label>
      <span class='h'>Empty messages not accepted</span>
    </div>
    <div class='cArea'>
      <input class='cBtn' id='ContactForm1_contact-form-submit' type='button' value='Submit' />
    </div>
    <div class='cArea nArea'>
      <p class='cNtf' id='ContactForm1_contact-form-error-message'></p>
      <p class='cNtf' id='ContactForm1_contact-form-success-message'></p>
    </div>
  </form>
</div>

<script src='https://www.blogger.com/static/v1/widgets/2271878333-widgets.js'></script>
<script>/*<![CDATA[*/ if (typeof(BLOG_attachCsiOnload) != 'undefined' && BLOG_attachCsiOnload != null) { window['blogger_templates_experiment_id'] = "templatesV1";window['blogger_blog_id'] = 'xxxxxxxxxxxxxxxxxx';BLOG_attachCsiOnload(''); }_WidgetManager._Init('//www.blogger.com/rearrange?blogID\xxxxxxxxxxxxxxxxxx','//www.your_blog.com/','xxxxxxxxxxxxxxxxxx');
_WidgetManager._RegisterWidget('_ContactFormView', new _WidgetInfo('ContactForm1', 'footer1', null, document.getElementById('ContactForm1'), {'contactFormMessageSendingMsg': 'Sending...', 'contactFormMessageSentMsg': 'Your message has been sent.', 'contactFormMessageNotSentMsg': 'Message could not be sent. Please try again later.', 'contactFormInvalidEmailMsg': 'A valid email address is required.', 'contactFormEmptyMessageMsg': 'Message field cannot be empty.', 'title': 'Contact Form', 'blogId': 'xxxxxxxxxxxxxxxxxx', 'contactFormNameMsg': 'Name', 'contactFormEmailMsg': 'Email', 'contactFormMessageMsg': 'Message', 'contactFormSendMsg': 'Send', 'submitUrl': 'https://www.blogger.com/contact-form.do'}, 'displayModeFull')); var inputs = document.querySelectorAll('.widget input[type=text], .widget input[type=email], .widget textarea'); for (var i = 0; i < inputs.length; i++) { var input = inputs[i]; input.addEventListener('input', function() {var bg = this.value ? 'fl' : 'nfl'; this.setAttribute('data-text',bg);}); } /*]]>*/</script>
  • Now you have to paste your blog id which you had earlier copied 'xxxxxxxxxxxxxxxxxx' in this code.
  • In place of www.your_blog.com, you have to enter the address of your blog.

Now your Contact Us Page is ready. Now you can test it to see if it is working properly or not.

Contact Us Page Video Tutorial


So how did you like this article on how to create a Contact Us page on Median UI Blogger Template, do tell by commenting. If you are facing any problem, then I will make a separate video on it, go check it. After that, your doubt will go away. Thank you for reading this post.  

Post a Comment

Please don't enter any spam link in the Comment Section. All comments are reviewed by the Admin!
Cookie Consent
We serve cookies on this site to analyze traffic, remember your preferences, and optimize your experience.
Oops!
It seems there is something wrong with your internet connection. Please connect to the internet and start browsing again.
AdBlock Detected!
We have detected that you are using adblocking plugin in your browser.
The revenue we earn by the advertisements is used to manage this website, we request you to whitelist our website in your adblocking plugin.
Site is Blocked
Sorry! This site is not available in your country.