COLOR TEXT BOX: HOW TO ADD STYLISH COLORED TEXT BOX IN BLOGGER POST

Add Color Text Box in Blogger Post– Every bloggers tries to attract their visitors by making their blog look elegant. Apart from writing a good keyword rich perfect SEO friendly blog post, article design matters to a lot to appeal a visitor. A well design blog with beautifully curated contents makes visitors feel comfortable while reading a long descriptive article in a blog. One of the key tactics to beautify your blog post is by adding stylish html color text box with images or highlighted text with colored background.

In my previous tutorial, I wrote article relating How to Add Html Text box in Blogger Post and Color Code Box in Blogger Post. In this tutorial I came up with stylish HTML Color Text Box to beautify your blog post, where you can write appealing blog post with highlight text and colorful background. Also, you can add image inside the colorful text box to beautify your article. So, let’s dive in!!!

Contents

Why should you use Color Text Box in Blogger Post?

The main reason for adding colored text box in blogger post is to make readers feel comfortable while reading a long descriptive blog post. Nobody likes to read long descriptive black and white blog post. If an article is long descriptive then visitor gets bored, eventually they starts scrolling from top to bottom and they leave that page resulting bounce rate increases and visitors length decreases which is harmful for SEO.

Color Text Box for Blogger

A beautifully curated blog post with colorful background distracts readers from getting bored. Blog Post with colorful text box increases readers focus more into the article resulting reader spends more time on blog which decreases bounce rate & boosts SEO.

Sample Colored Text Boxes for Blogger Post

<div style=”background-color: #FFF8C6; margin-left: 20px; margin-right: 20px; padding-bottom: 8px; padding-left: 8px; padding-right: 8px; padding-top: 8px;”>Your Text Here </div>

<div style=”background-color: #FFF4D6; margin-left: 20px; margin-right: 20px; padding-bottom: 8px; padding-left: 8px; padding-right: 8px; padding-top: 8px;”>Your text here </div>

These were the sample color codes for the above two styles. For more styles you can check 10 stylish color Text Box for Blogger Posts.

How to add Color Text Box in Blogger Post?

To add the above colored text boxes in your blogger post follow the above steps:

Step 1: Login to your blogger dashboard and select your blog.

color text box in blogger post

Step 2: Go to Posts >All New Post > HTML.

Step 3: Paste color text box code in HTML area.

Step 3: Replace “Your Text Here” with your desired text.

◆ Customization: To customize above colored text box just just replace #FFF4D6 with your desired colored code. For various codes use this color code generator. Also, to add image inside color code just add image URL inside colored text box code area in HTML. You’re done!

◆ Last Word: Hope you are benefited by this article and learned something new. Let me know how this tutorial helped you to display color text box in your blog post. For any issues relating implementation of the code drop a comment below we are ready to help you. Also, if benefited please share with your friends in social media.

Summary
Review Date
Reviewed Item
COLOR TEXT BOX
Author Rating
51star1star1star1star1star

LEAVE A REPLY

Please enter your comment!
Please enter your name here