Home
Code

How to Add Template Information to Your Blogger Post

SSR-TECH

If you're sharing or selling templates on Blogger, adding a "Template Information" section can make your post look professional and informative. Here's how you can do it.

Example Template Information Section

Below is an example of a "Template Information" section. You can customize it according to your needs.

Steps to Add the Section to Blogger

  1. Open Blogger Editor: Log in to your Blogger account and open the post editor for the post you want to add the template information to.
  2. Switch to HTML View: In the Blogger editor, switch to "HTML" mode.
  3. Paste the Code: Copy and paste the above HTML code where you'd like the "Template Information" section to appear.
  4. Customize: Replace the example text (e.g., "DragaManga," "v1.0," etc.) with your actual template details.
  5. Preview and Publish: Preview your post to ensure everything looks correct, then publish it.
 
        <div style="max-width: 400px; margin: 20px auto; font-family: 'Poppins', sans-serif; border: 1px solid #e0e0e0; border-radius: 12px; box-shadow: 0 4px 10px rgba(137, 10, 251, 0.4); overflow: hidden; background: #fff;">
  <div style="background: linear-gradient(90deg, #3912ff, #8c12ff, #3912ff, #8c12ff); text-align: center; padding: 15px; border-radius: 12px 12px 0 0;">
    <h2 style="color: #fff; font-size: 18px; font-weight: bold; margin: 0;">TEMPLATE INFORMATION</h2>
  </div>
  <table style="width: 100%; border-collapse: collapse; text-align: left;">
    <tr>
      <td style="padding: 12px 15px; border-bottom: 1px solid #e0e0e0; font-weight: 500; color: #555;">Template Name</td>
      <td style="padding: 12px 15px; border-bottom: 1px solid #e0e0e0; color: #000;">DragaManga</td>
    </tr>
    <tr>
      <td style="padding: 12px 15px; border-bottom: 1px solid #e0e0e0; font-weight: 500; color: #555;">Version</td>
      <td style="padding: 12px 15px; border-bottom: 1px solid #e0e0e0; color: #000;">v1.0</td>
    </tr>
    <tr>
      <td style="padding: 12px 15px; border-bottom: 1px solid #e0e0e0; font-weight: 500; color: #555;">Price</td>
      <td style="padding: 12px 15px; border-bottom: 1px solid #e0e0e0; color: #000;">0$</td>
    </tr>
    <tr>
      <td style="padding: 12px 15px; border-bottom: 1px solid #e0e0e0; font-weight: 500; color: #555;">Created on</td>
      <td style="padding: 12px 15px; border-bottom: 1px solid #e0e0e0; color: #000;">Aug 2024</td>
    </tr>
    <tr>
      <td style="padding: 12px 15px; border-bottom: 1px solid #e0e0e0; font-weight: 500; color: #555;">Last updated on</td>
      <td style="padding: 12px 15px; border-bottom: 1px solid #e0e0e0; color: #000;">Dec 28</td>
    </tr>
    <tr>
      <td style="padding: 12px 15px; border-bottom: 1px solid #e0e0e0; font-weight: 500; color: #555;">Platform/CMS</td>
      <td style="padding: 12px 15px; border-bottom: 1px solid #e0e0e0; color: #000;">Blogger</td>
    </tr>
    <tr>
      <td style="padding: 12px 15px; font-weight: 500; color: #555;">Developer</td>
      <td style="padding: 12px 15px; color: #000;">SSR TECH</td>
    </tr>
  </table>
</div>

Why Add Template Information?

  • Transparency: Helps users understand what the template offers.
  • Professionalism: Makes your blog posts look polished and well-organized.
  • Trust Building: Users are more likely to download or purchase a template if they see clear details.

Conclusion

Adding a "Template Information" section to your Blogger posts is simple and effective. Use the provided HTML code to enhance your post design and attract more users to your templates.

Post a Comment

Code Copied!