Group Information
Date Created:
April 7, 2008
Category:
Education & Learning »
Computers & Internet
Group Type:
Public
  New Topic   ← Back to All Topics
AARP.org
Community Help
Technical hiccups? Error messages? 'How to' questions? We'll do our best to help. Please visit our Online Community FAQ for quick answers to common questions. You may also post your question below, including specifics about the operating system, browser version, and type of computer you are using. You are also welcome to contact us at community@aarp.org. Thanks in advance for your patience as we look into the issue.
  Post to Topic     Print   Profile tweak - member name
http://www.aarp.org/community/groups/displayTopic.bt?groupId=1&topicId=5268732
xpress said:
on November 2, 2009 09:55 PM ET

I have replaced the member name above my profile picture with an image.

Did you know that when you edit your "About Me", you can place an embedded stylesheet at the top?

Start with <style type="text/css> and end with </style>, then continue with whatever styles you want in your profile and About Me page. Not all of them will work, due to filtering, but a lot of them will work.

You can place various styles inside those tags. I have tweaked a few things in my profile to make it a little more colorful and unique.

Todays tip will be about changing the member name above the profile picture.

If you use an image, you'll need an image somewhere accessible by url on the internet. You can use web space provided by your ISP, a photobucket or flickr account, web hosting or whereever you have web storage.

I can't remember whether I created my image with Gimp or Inkscape, but it was one of those. You can create it with whatever you have, or use free online tools like cooltext.com or gifworks.com. The box the image is in is 222pixels wide and 22 pixels high. Ideally, you shouldn't exceed that.

Once you have an image online, use CSS to hide the existing text and put your image as a background image.

So, I have in my about me, at the very beginning:

<style type="text/css>

div.profileNav div.memberName, div.adminNav div.memberName {
color: rgb(255,255,255);
text-align: left;
text-indent: -100.0px;
background-color: rgb(255,255,255);
background-image: url(http://dlh1.com/images/xpress.jpg);
background-repeat: no-repeat;
background-position: center center;
}
</style>

Replace the background-image url with your own.

Actually, I have a few more styles, but the above is what replaces the member name with the image.

I'm also wondering if there is any interest in tips like this one. ??

I was thinking about starting a group about tweaking profiles, journals, or posts with CSS and HTMl, or one about web page creation in general. I'm not sure if I have enough time or whether there is any interest.

5 posts by 4 users
Post #5
geneloeb replied to xpress's Post #4 :
on November 4, 2009 11:00 PM ET

Xpress,

Thanks. I appreciate it. Now I don't feel so intimiidated, and now I will ry it.

Gene


Post #4
xpress replied to geneloeb's Post #3 :
on November 4, 2009 10:53 PM ET

OK. I added more detailed instructions to a group journal here. It might look like a lot, but it really isn't.

 


Post #3
geneloeb said:
on November 3, 2009 12:18 AM ET

Thanks for the information. This is very sophiticated, beyond me.I would like to learn it. Could you give an explantion for beginners?

Gene


Post #2
Bamrz said:
on November 2, 2009 11:22 PM ET

Way cool, thanks!! I have to sleep now, but I'll play with it when I get home from work tomorrow.


Sue


Post #1
davexyz3 said:
on November 2, 2009 10:12 PM ET

Hey, thanks for the information.  You are light-years ahead of me in programming skills, but I am working at it.