How To Add Together Dissimilar Background Colouring Cloth Or Picture Inward Each Blogger Post

When y'all bring multiple authors on a Blogger blog too desire to brand a specific post service stand-out, y'all tin alter anytime the background color of your posts or apply a background icon behind them. And this tin move easily done past times wrapping the post's HTML inward a 'div' element. You tin apply this play tricks to your already published posts or y'all tin change/remove it afterward if that's your wish.

Related: How to Add Different Backgrounds inward Blogger Pages

So, this tutorial volition exhibit y'all how to agency each post service differently past times adding unopen to code snippets inward your Blogger posts. Please complaint that this play tricks won't piece of employment if y'all bring implemented the auto-read to a greater extent than function.

Demo Blog

How to Change the Background Color of a Blogger Post

Step 1. Log inward to your Blogger account, click on your weblog too press the 'New Post' button.

Step 2. Once y'all bring finished writing the post, switch to the 'HTML' tab too add together the next code only at the get-go too at the halt of the post service content.

<div style="background-color: #444; color: #fff; padding: 10px;">
Your text goes here...
</div>

Note:

• replace the hex value in blue to alter the background color too the color value in green alongside the color of the post's text. You tin usage this Color Code Generator tool to selection your favorite color.
• "Your text here...." is where the Post content should go, i.e. betwixt the <div style="..."></div> tags.

How to Add a Background Image inward a Blogger Post

If y'all desire to add together a background icon inward a post, add together the next code only at the get-go too halt of the post service content:

<div style="background: url(IMAGE-URL-HERE); background-size: cover; color: #000; padding: 10px;">Your text goes here...
</div>

Note:

• paste the URL address of your hosted film (use Photobucket, Tinypic etc.) where it says IMAGE-URL-HERE
• the line inward red too the </div> tag has to move added at the get-go too at the halt of the post's HTML.
• if the background icon is dark, thence y'all volition postulate to alter the text color - supplant the #000 color value alongside #fff
• "Your text here...." musical note tells y'all where the Post content should go.

Step 3. Now click the 'Publish' push clit too y'all are done.

Share this post