At the end of every post we see the “Posted by.. <authorname>” ..followed by the number of comments, timestamp etc..etc…Some would perefer having their profile pictures instead of the boring “Posted by <authorname>” text.Do follow the instructions closely.
- SAVE AND BACK UP YOUR TEMPLATE
- IF YOU ALREADY HAVE THE PICTURE IN YOUR PROFILE..go to step 4
- UPLOADING PICTURE TO YOUR PROFILE
- Have a new test post and insert your picture using the ADD-IMAGE
- Take care that your picture has the right kind of dimentions that you would like to display at the end of each post.I dont think you would prefer, if your picture takes up half as much space as the post itself.
- Publish the post
- Copy the URL of the picture from the EDIT-HTML part of the post
- go to DASHBOARD—EDIT PROFILE–Give the URL in the Photo-URL
- Save Profile and assure yourself of the picture displayed
- Once you are satisfied with the picture in the profile.. you can delete the post that you have just now created..this will not affect the picture in the profile
- Go to Dashboard..Edit profile
- Copy the photo URL into a notepad
- Select LAYOUT of the blog(to which you wish to add the picture at the end of the posts)
- TEMPLATE–EDIT HTML
- Expand Widget Templates
- locate
<span class=’post-author’>
<b:if cond=’data:top.showAuthor’>
<data:top.authorLabel/>
<data:post.author/>
</b:if>
</span> - Insert <img src=”URL YOU HAVE COPIED FROM THE PROFILE PAGE as stated above” style=”border:none”/> below the <data:top.authorLabel/>
- Now your final code should look like this
<span class=’post-author’>
<b:if cond=’data:top.showAuthor’>
<data:top.authorLabel/>
<img src=”URL YOU HAVE COPIED FROM THE PROFILE PAGE as stated above” style=”border:none”/>
<data:post.author/>
</b:if>
</span> - SAVE and view your blog
- If you donot want the “POSTED BY…YOUR-NAME” to be displayed then
- TEMPLATE—PAGE ELEMENTS
- EDIT–Blog posts (element)
- Choose accordingly
- SAVE and view
- FOR PIC AT THE TOP OF THE POST..(like in newspapers)
- look for
<data:post.timestamp/> - Insert the<img src=”URL YOU HAVE COPIED FROM THE PROFILE PAGE as stated above” style=”border:none”/> below
- The Final code should look like this
<data:post.timestamp/>
<img src=”URL YOU HAVE COPIED FROM THE PROFILE PAGE as stated above” style=”border:none”/>This Will put the picture beside the date header of your posts.You would have noticed this on this blog itself - Some slight modifications might be needed for certain indiviaulistic templates…Just drop in a word..i shall help you fix it
- look for
Hope you were able to successfully add this feature to your blog using the instructions stated above.So drop in your opinion (good & bad) at the comments.Your comments motivate me to perform better…b/w dont forget to mention this link in your credits section..
hello Deepa, I’ve been trying to use a small jpg to replace the whole ‘posted by *my name*’
I was able to do this in my old blogger but can’t see where I can do it in beta.
I haven’t tried your idea of the profile picture yet, but I don’t think it will work for me as I have two blogs and previously was able to use a different jpg to sign each of them.
you can see what I mean in my blog here (the little green frog) http://crotchetygardener.blogspot.com/
I haven’t swapped this blog over yet to the beta layout, and can’t work out how to get this effect.
Welcome erica
If you have not yer swapped to beta..my advise is to swich .Sooner or later everone WILL be shifted to beta.so its better u get a headstart.
I shall be glad to help you in case of any diffficulty that might arise
Good luck
in the meantime i shall lookarounnd to achive this ins classic too
Deepa
< $BlogOwnerPhotoUrl$> –this is ur phto URL
< $I18NPostedByAuthorNickname$>–this is the posted by location
< $BlogDateHeaderDate$>–This the blogdate header..
so position the photo tag where ever it seems correct
Deepa
hello! i switched a month ago i think, and i agonized how i can change that “posted by — ” portion of the template —
your entry helped me. thank yoU!
Welcome Christina
I am happy that u got wat you were looking for.Thnks alot..Do drop in any new ideas that you all might have,,,i promise to try
🙂
Deepa
Hi Deepa
I have managed to get my jpg up and running.. But how can I go about taking out the [YOUR-NAME] from “POSTED BY…YOUR-NAME”?
e.g. “POSTED BY… [my jpg.]
Pls advise..
tks again and again… and again.
Hi jojo
Yopu just have to locate the
<p class=’post-footer-line post-footer-line-1′>
<span class=’post-author’>
<b:if cond=’data:top.showAuthor’>
<data:top.authorLabel/>
<img src=”URL YOU HAVE COPIED FROM THE PROFILE PAGE as stated above” style=”border:none”/>
<data:post.author/>
</b:if>
</span>
and delete the
<data:post.author/>.. this is what that displays the name you have given in the profile
Hope this helps
Deepa….
Thanks again.
You are welcome jojo..
Saw that the pic is up and running..
By God.. you are indeed making best use of the yahoo smilyes hack.. i never saw so many smilies at one place =d.,Thanks for linking to me
Hi Deepa
I want to do two things on my blog:
(1) I want to display pix of each member of my blog
(2) I want to display pic of each member at de start of the post
Can u help me figure it out, I am a total novice
I blog at askiblogspot.blogspot.com
Thanks
Kutchu
Welcome Kutchu
Actullay doing this will involve something like <pic of post author> unfortunately blogger doesnot have this kind og a tag for team blogs
You might have noticed this while adding the profile widget in a teamblog.. it will tell nothing baout “ABOUT ME”.. instead.. all u get is the list of contributors and thelinks to their profile in blogger.
What you are requesting is possible.. but takes lots of man hours to put into.
At the moment i am busy with few other commitmetns.. however as soon as i start working on this and get it ready.. you shall be the first one to get an alert