Add Guest Post form to Blogger

0
140
If you wish to Add Guest Posting to your blog in blogger / blogspot then you are at right place here i will help you to create page where you can offer the place to write Guest post directly on your blog.
By default Author option is available in the blogger but there is disadvantage of using that option. if you add any author than they directly publish their post and there is no moderation option available.
So you should always use the other way by which anyone can submit post and that post will reach you and you can check and publish the post.  

Let’s Start 

You can Customize this form as per your requirement (if you know the coding)

Step 1

Login to your Blogger.
Click on themes on left side panel
Click on the Edit HTML option
Tap anywhere in the Script and press CTRL + F
In the search Box paste this Code ” ]]></b:skin> ”  
Now paste the below code above this code and Press save Theme
.form-style-6{
    font: initial;
    margin: 10px auto;
    padding: 16px;
    background: #F7F7F7;
}
.form-style-6 input[type=”text”],
.form-style-6 input[type=”date”],
.form-style-6 input[type=”datetime”],
.form-style-6 input[type=”email”],
.form-style-6 input[type=”number”],
.form-style-6 input[type=”search”],
.form-style-6 input[type=”time”],
.form-style-6 input[type=”url”],
.form-style-6 textarea,
.form-style-6 select
{
    -webkit-transition: all 0.30s ease-in-out;
    -moz-transition: all 0.30s ease-in-out;
    -ms-transition: all 0.30s ease-in-out;
    -o-transition: all 0.30s ease-in-out;
    outline: none;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    background: #fff;
    margin-bottom: 4%;
    border: 1px solid #ccc;
    padding: 3%;
    color: #555;
    font: initial;
}
.form-style-6 input[type=”text”]:focus,
.form-style-6 input[type=”date”]:focus,
.form-style-6 input[type=”datetime”]:focus,
.form-style-6 input[type=”email”]:focus,
.form-style-6 input[type=”number”]:focus,
.form-style-6 input[type=”search”]:focus,
.form-style-6 input[type=”time”]:focus,
.form-style-6 input[type=”url”]:focus,
.form-style-6 textarea:focus,
.form-style-6 select:focus
{
    box-shadow: 0 0 5px #43D1AF;
    padding: 3%;
    border: 1px solid #43D1AF;
}
.form-style-6 input[type=”submit”],
.form-style-6 input[type=”button”]{
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    padding: 3%;
    background: #43D1AF;
    border-bottom: 2px solid #30C29E;
    border-top-style: none;
    border-right-style: none;
    border-left-style: none;   
    color: #fff;
}
.form-style-6 input[type=”submit”]:hover,
.form-style-6 input[type=”button”]:hover{
    background: #2EBC99;

}  

Step  2

Click on Pages.
Create New Page.
Write Title Thank You.
Write the thank you content as per your requirement.
Publish the Thank you Page.  

Step 3

Click on Pages.
Create New Page.
Write Title Guest Post.
Click on HTML.
Copy and paste the below code under the HTML option.
Go to Bottom side and Find yourid@gmail.com
Replace the the yourid@gmail.com with your email ID.
Find the “https://www.nirankariinfotech.com/p/guest-post-thank-you.html ” 
Replace the above URL with your URL 
Change the Guideline as per requirement  
<script src=”https://dl.dropboxusercontent.com/s/htbxax1y39i5oak/guests.js” type=”text/javascript”></script>
<script type=”text/javascript”>
     bkLib.onDomLoaded(function() {
          var myNicEditor = new nicEditor();
          myNicEditor.setPanel(‘myNicPanel’);
          myNicEditor.addInstance(‘wysiwyg’);
     });
</script>
<div class=”form-style-6″>
<form id=”contactform” method=”POST”>
<input name=”name” placeholder=”Your name” type=”text” />
<input name=”_replyto” placeholder=”Your email required” required=”” type=”email” />
<textarea name=”Details” placeholder=”This is an optional section. You can tell about yourself and post Your social links and site links here.” required=”” rows=”6″ style=”width: 50%;”></textarea>
<input name=”Post_title” placeholder=”Post Title (Required)” style=”width: 85%;” type=”text” />
<h3>
Write Post below</h3>
<div id=”myNicPanel” style=”width: 83%;”>
</div>
<textarea id=”wysiwyg” name=”message” rows=”20″ style=”background: white; overflow: scroll; width: 85%;”></textarea>
<input name=”tags” placeholder=”Enter your tags/label/category (optional)” style=”width: 85%;” type=”text” />
<input name=”_gotcha” style=”display: none;” type=”text” />
<input name=”_next” type=”hidden” value=”https://www.nirankariinfotech.com/p/guest-post-thank-you.html” />
<input type=”submit” value=”Post it for review” />
</form>
<b>

</b> <b>Please, Don’t post Spam!, Spams are excluded Automatically.</b></div>
<h2>
Guidelines for guest posting</h2>
<ol>
<li>Guideline no. 1</li>
<li>Guideline no. 2</li>
<li>Guideline no. 3</li>
</ol>
<script>
    var contactform =  document.getElementById(‘contactform’);
    contactform.setAttribute(‘action’, ‘//formspree.io/yourid@gmail.com‘);
</script>
<!–Hey don’t remove the below link as I worked very hard to make this form and email support. Thank you!–>
<a href=”
https://www.nirankariinfotech.com/2018/09/add-guest-post-form-to-blogger.html” style=” float: right; “> Add this form </a>
The section which need to change or replace that I have Marked in Red color.

NOTE: once you added the form successfully Please use it once and you will receive email to confirm your email id, once you confirmed your email id confirmation box will not appear to anyone. 
 a
Here is the Video that shows the step by step process of adding Guest Post Form to Blogger.
 
 

LEAVE A REPLY

Please enter your comment!
Please enter your name here