AllTechGurukul


Its Naveen's Wiki

How to put submit form along with file attachment in blogger post

To upload a file with text in Blogger without creating a post, you can use a file upload form. Here’s a step-by-step guide:

Step-by-Step Guide:

  1. Create a New Page or Open an Existing Page: Go to your Blogger dashboard and either create a new page or open an existing one.

  2. Switch to HTML View: Click on the "HTML" tab to edit the page in HTML mode.

  3. Add the File Upload Form: Copy and paste the following HTML code into your page:

html
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css">
<div class="container">
  <form target="_blank" action="https://formsubmit.co/your-email@example.com" method="POST" enctype="multipart/form-data">
    <div class="form-group">
      <div class="form-row">
        <div class="col">
          <input type="text" name="First-Name" class="form-control" placeholder="First Name" required>
        </div>
        <div class="col">
          <input type="text" name="Last-Name" class="form-control" placeholder="Last Name" required>
        </div>
      </div>
      <div class="form-row">
        <div class="col">
          <input type="email" name="email" class="form-control" placeholder="Email Address" required>
        </div>
      </div>
      <br>
      <div class="form-group">
        <div class="form-row">
          <div class="col">
            <input type="file" name="attachment">
          </div>
        </div>
      </div>
      <label for="Message">Message *</label>
      <div class="form-group">
        <textarea placeholder="Message" class="form-control" name="message" rows="5" required></textarea>
      </div>
      <button type="submit" class="btn btn-lg btn-dark btn-block">Submit Form</button>
    </div>
  </form>
</div>
  1. Replace Email Address: Change your-email@example.com to your actual email address where you want to receive the files.

  2. Update and Publish: Save and publish the page.

Notes:

  • File Size Limit: The service allows a maximum file size of 5MB.

  • Activation: Make sure to test the form by submitting a file to ensure it works correctly.






NOTE: Modify the link if necessary to enable direct downloading (e.g., change www.dropbox.com to dl.dropboxusercontent.com).



Post a Comment

Previous Post Next Post