How to Add a Stylish Comment Box to Your Wapkiz Blog

Add and Style a Custom Comment Box on Wapkiz Blog Pages
Please wait 0 seconds...
Scroll Down and click on Go to Link for destination
Congrats! Link is Generated
Hello! Welcome to DaudBD Blog.

In this article, I will share with you How to Add a Stylish Comment Box to Your Wapkiz Blog.

Step 1: Log in to Your Wapkiz Admin Panel

  1. Visit Wapkiz and log in to your account.
  2. Navigate to your dashboard.

Step 2: Select Your Blog Page

  1. In the dashboard, click on "Page Manager" or navigate to the section where you manage blog pages.
  2. Locate the blog page where you want to add the comment box. You can select an existing page or create a new one.

Step 3: Paste the Comment Box Code

  1. Open the page in the "Edit" mode.

  2. In the HTML Content section, paste the following code where you want the comment box to appear:

    
       /* HTML Style DaudBD.Com */
      <div class="hidden-md hidden-lg">
        <div class="mainblok">
            <div class="currentpage">
                Comments:<br />
                %notify%<br/>
                <textarea cols="40" rows="3" name="blogcmt_text"></textarea><br />
                <input type="submit" name="blogcmt_submit" value="Post"/>
            </div>
            <div class="nfooter">
                <a href="/site-myblog.html">My Blog</a> | <a href="/site-blogs.html">Blogs</a>
            </div>
        </div>
    </div>

    Save your changes.

    Wapkiz-comment

    Step 4: Add the CSS for Styling

    1. Go back to your Wapkiz admin panel and click on "CSS/JS" or a similar section for adding custom styles.

    2. Paste the following CSS code:

      /* Comment Box Styles DaudBD.Com */
      .hidden-md,
      .hidden-lg {
          display: block;
          margin: 20px auto;
          padding: 10px;
          max-width: 600px;
          background-color: #f9f9f9;
          border: 1px solid #ddd;
          border-radius: 5px;
          font-family: Arial, sans-serif;
          box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
      }
      
      .mainblok {
          padding: 10px;
      }
      
      .currentpage {
          text-align: center;
          margin-bottom: 10px;
      }
      
      textarea[name="blogcmt_text"] {
          width: 100%;
          height: 100px;
          padding: 10px;
          border: 1px solid #ccc;
          border-radius: 5px;
          font-size: 14px;
          font-family: Arial, sans-serif;
          resize: vertical;
          outline: none;
      }
      
      textarea[name="blogcmt_text"]:focus {
          border-color: #007bff;
          box-shadow: 0 0 5px rgba(0, 123, 255, 0.5);
      }
      
      input[name="blogcmt_submit"] {
          padding: 10px 20px;
          border: none;
          border-radius: 5px;
          background-color: #007bff;
          color: #fff;
          font-size: 14px;
          cursor: pointer;
          transition: background-color 0.3s;
      }
      
      input[name="blogcmt_submit"]:hover {
          background-color: #0056b3;
      }
      
      .nfooter {
          text-align: center;
          margin-top: 10px;
          font-size: 14px;
      }
      
      .nfooter a {
          color: #007bff;
          text-decoration: none;
          margin: 0 5px;
      }
      
      .nfooter a:hover {
          text-decoration: underline;
      }

      Save the CSS

      Step 6: Finalize and Publish

      1. Make any additional adjustments if required.
      2. Once satisfied, publish the changes.

      Your comment box is now successfully added and styled for your Wapkiz blog!

Conclusion

In this article, I have shared Simple Tutorial: Stylish Comment Box for Wapkiz Blogs. I hope you have liked it Please do share it with your friends and follow our blog for more.

About the Author

Hey! I'm Daud, Currently Working in IT Company BD. I always like to learn something new and teach others.

Post a Comment

To avoid SPAM, all comments will be moderated before being displayed.
Don't share any personal or sensitive information.
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.