Contact Us:

If You Have Any Problem, Wanna Help, Wanna Write Guest Post, Find Any Error Or Want To Give Us Feedback, Just Feel Free To Contact Us. We Will Reply You Soon.

Name: *


Email: *

Message: *


Skillblogger

Download our app on Google Play Store

Friday, April 12, 2013

Add Liltel Image Beside Your Posts Titles

Add Liltel Image Beside Your Posts Titles
Welcome everybody, as I used to write every time for ways to decorate Blogs Blogger and make them more aesthetic, which makes Visitor more interested in whether your posts or the additions that you added, and all of this is positive, so today’s tutorial is about adding a little picture beside the title of each post in your blog.Be sure that this addition will make your posts more attractive and better than before. This addition is one of the most additions that you might found in the biggest popular websites, and i'm using it on my website too, because i want to make my website more attractive, and i know that you will like it too and surely you will add it too.
You can add your personal picture or a little image quoted from your header image as i did :)  and for example it will look like this:


Install:

  • Go To Blogger » Design » Edit HTML
  • Don't forget to make a backup to your template
  • Now search for the following tag .post h3  you can search for this tag also: .post h2
  • look CAREFULLY and you will see a code just like the following:

.post h3 {
color: #7CA2C4;
font-size: 20px;
font-family: Arial, sans-serif;;
font-weight: normal;
margin: 0px;
padding: 0px 10px 0 47px;
}

Now replace it with the following code:



.post h3 {
background:url(PUT HERE THE IMAGE LINK OF YOUR PROFILE PIC) no-repeat top left;
color: #289728;
font-size: 20px;
font-family: Arial, sans-serif;;
font-weight: normal; height:45px;
margin: 0px;
padding: 0px 10px 0 47px;
line-height:1.1em;
}

Replace the green text with your image link. Make your avatar size to be 40px by 40px . designe your own avatar with white background and colored border.

Just go to google images and search for images 40x40 and select what you want from them or draw your own avatar

Settings:


  • Change this Colo#289728 with the one that your title would like to appear.

After all press save.


And This is it, congratulations with the new addition. If you have any problem in any step, just put it in comment and I’ll answer about it as fast as i can.
Happy Blogging.
Like the Post? Share with your Friends:-

Team SB
Posted By: Team SB

0 comments :

POST A COMMENT

Download our app on Google Play Store

Contact Us

Name

Email *

Message *

 
Copyright © . Skill Blogger . All Rights Reserved.
Designed by :- Way2themes