How to Write some text in a Stylish Box on Blogger
As you may have seen on blog, placing some text inside a blog post without a stylish box around it does not look particularly pleasing to the eye. And it is not very practical.
So how do you add some text boxes to your Blogger posts?
There are two ways, one is fairly simple and best suited for beginners and the other is an advanced method which gives your text box a more professional look.
If you prefer a Professional Text Box or Code Box look, the method is:
- Sign in to your Blogger Account Go to Dashboard –> Design –> Edit HTML.
- Find for (CTRL+F): ]]>
- Add the following code right ABOVE ]]>
.code {
background:#f5f8fa;
background-image:none;
background-repeat:no-repeat;
border: solid #5C7B90;
border-width: 1px 1px 1px 20px;
color: #000000;
font: 13px ‘Courier New’, Courier, monospace;
line-height: 16px;
margin: 10px 0 10px 10px;
max-height: 200px;
min-height: 16px;
overflow: auto;
padding: 28px 10px 10px; width: 90%;
}
.code: hover {
background: #FAFAFA; background-image:none;
background-repeat:no-repeat;
}
And Save Template. Now go to your Dashboard and create a new post on the blog where you added the Professional Code Box.Just paste the follwing code in the Edit HTML tab:
YOUR Test Here
