How To Convert Blogger Contact Form in A Contact Page | IT Sat Blogger
Ad Networks Reviews Ad Posting Adobe Photoshop Adobe Photoshop CS3 Adsense Advertising Definition Affiliate Afganistani Channels Alternate Android App Android Mobile as Webcam for PC – Wi-Fi & USB Mode AntiVirus Any Video Converter Apps Arabsat Argent Global Network Avira Biss Keys Black Friday Blog Design Blogger Templates Blogging Blogging Tools Branch Less Banking Broadband Tips Browsers CCcam Section CD and DVD Channel News Channel Updates Chargi Chrome Cinco De Mayo Comments computer Contact Forms Converter CPA CPC CPL CPM CPT CPV Cryptoworks Keys CSS & HTML CTR Cyber Monday DCW Keys Dictionary Digads Digital Receivers Dish Tv Dish Tv Bazar Djuice DM Digital Add New Channel Paksat IR at 38°East Downloader Dreambox Driver Updates Easypaisa Echolink Encryption Software English to Urdu and Urdu to English Dictionary Entertainment Channels Exchange Rate Facebook Fight Sport Firefox Flash Sale Format Factory 3.0 Free Download Wedding Album Maker Gold Software Frequencies Google Chrome Graphics Hosting Sale Hostings Hotspot Shield How To How to Download YouTube Videos on Android Devices How to Generate Adsense Revenue IDM Imtoo Video Converter Indian Channels Infolinks Internet Internet Download Manager Irdeto Keys IT News IT Tips Labels Language Softwares Live Channels Make Money Mardi Gras Sales Media Players MicroBox Mix Receivers Mobilink 3G Mobilink Offers MoboLive Review – Download (.apk) for Android Mozilla MP3 Cutter Mystery Sales NBA POOL EUROPE 1 Update New Biss Key Neosat Nero Burnning Rom 11 News Channels Offers okpay Online Payment Processors Online Sales Online Services OpenBox Optimization Tools Pakistani Channels Paksat Password Manager Payoneer Payza PC Drivers Perfectmoney Photo Editors Pixillion Image Converter 2.28 Posts PowerVu Keys PPC PPV PTC Ptcl Offers Regional Channels Religious Channels RoboForm RPM Samsung J7 Pro Samsung Mobiles Satellite News Satellite Tips and Tricks SEO Tips Sim Lagao Offers Snappy's Birthday Sales Social Media Social Media Exchange Sites Softcam Keys Softwares Sports Channels Sports News Spring Sale St.Patrick's Day Star Track Starsat System Tools Telecomunication Telenor 3G Telenor Offers TeraCopy Full Version Tiger Sat Tiger T800 Mini HD Digita Satellite Receiever New Software Top 10 Top 5 Highest AdSense Earners in the World Total Video Converter 3.61 Tour De Rouge Sale TP Link u Torrent Ufone Offers Ulead 3d 3.5 UltraISO Premium Edition 9 Uploading Valentine's Day Sales Viaccess Keys Video Marketing Video Monetization VLC media player Warid 3G 4G Packages Warid Offers Web Freer 2013 Web Traffic Widgets Windows Wingle WinRAR 4.02 WinZip Pro 17.0 Withdraw Money in Pakistan Wordpress Xiaomi Yayvo Zam tv On Paksat IR at 38°East Zong 3G and 4G LTE Zong Offers Zong Sim Lagao Offer

In last tutorial, I showed you how to add Blogger’s official contact form to your Blogger blog. You can also Add Blogger contact form into a Contact us Page of your Blogger website. It will work absolutely fine and it will not break anything. Let me show you how:
Note: In order to add contact form to a page, you first need to add the contact form widget to the sidebar of your Blogger.



Sometimes, we don't want to show a contact form widget at blogger sidebar or else where, So this post will help you to how to hide contact form widget and create a contact us page with official blogger contact us widget. This style works good and all messages send to your blogger emailbox.Also you can add multifunction contact us widget like upload option.  

Hiding Contact Form From Your Sidebar

First, you need to hide the default contact form from your Blogger’s sidebar widget. Navigate to your Dashboard > Template > Edit HTML. Search ]]></b:skin> and paste below code just above.
]]></b:skin>
#ContactForm1{
display: none !important;
}

Save your template.

Adding Contact Form To A Page

Now, we will add the contact form to a static page of your Blogger blog. Navigate to yourDashboard > Posts, and click on New Page and select Blank Page.
Now, in your blank page, click on HTML option to switch to HTML editor mode. Add following code and publish your page:
<form name='contact-form'>
<p></p>
Name<br />
<input class='contact-form-name' id='ContactForm1_contact-form-name' name='name' size='30' value='' type='text' />
<p></p>
Email
<span style='font-weight: bolder;'>*</span><br />
<input class='contact-form-email' id='ContactForm1_contact-form-email' name='email' size='30' value='' type='text' />
<p></p>
Message<span style='font-weight: bolder;'>*</span><br />
<textarea class='contact-form-email-message' cols='25' id='ContactForm1_contact-form-email-message' name='email-message' rows='5'></textarea>
<p></p>
<input class='contact-form-button contact-form-button-submit' id='ContactForm1_contact-form-submit' value='Send' type='button' />
<p></p>
<div style='text-align: center; max-width: 222px; width: 100%'>
<p class='contact-form-error-message' id='ContactForm1_contact-form-error-message'></p>
<p class='contact-form-success-message' id='ContactForm1_contact-form-success-message'></p>
</div>
</form>
That’s it! You can also customize the contact form with custom CSS styling or jQuery.
You can change Name, Email and Email Message in your own words like your good name to name.
If you are facing any difficulty to adding this widget or its not work properly please feel free to contact us or use another method to create contact us page with official blogger contact us form.
Labels: , ,

Post a Comment

Author Name

{picture#http://1.bp.blogspot.com/-60UhuKBkPJg/VqtduelZhHI/AAAAAAAAdUM/VR5bHxk6PMk/s1600/itsatblogger%2Bauthor.jpg} Hello Friends, My name is Muhammad Ahsan Yousuf founder of ITSATBLOGGER and Nusratcollection.com. I'm not guru in blogging but love it try to deliver good and informative content and news to my readers. {facebook#https://www.facebook.com/ahsan9226} {twitter#} {google#https://plus.google.com/u/0/+MuhammadAhsan871} {pinterest#YOUR_SOCIAL_PROFILE_URL} {youtube#YOUR_SOCIAL_PROFILE_URL} {instagram#YOUR_SOCIAL_PROFILE_URL}

Contact Form

Name

Email *

Message *

Powered by Blogger.

itsatblogger