Group Information
Date Created:
April 7, 2008
Category:
Education & Learning »
Computers & Internet
Group Type:
Public

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.

  New Topic   Group Forum (1513)

Group Photos (5)

Group Videos (0)

This group doesn't have any videos yet.

Group Journals (11)

I made a post in Community Help recently about tweaking the member name displayed in your profile page above your profile picture. This journal entry is a step-by-step guide to doing it which should be easier to understand for beginners than what I posted in the Community Help group forum.

This is what we are going to change, (outlined in red):

You'll need a graphic image of your member name to display in place of the default text. I kind of suck at graphics, but I'll try.

The graphic will display in a box that is 222 pixels wide and 22 pixels high. You'll need something that will fit in there. No matter how you make it, it should be either a .jpg or .gif format. .png may also work for newer browsers, but I recommend sticking with one of the first two. My graphic looks like this:

The next step is to upload your graphic somewhere on the internet so you can access it via URL. I happen to have server space available, but if you don't, don't worry. You can use web space provided by your ISP, or use a free photo sharing site like flickr. I was surprised at how easy flickr is. If you already have a Yahoo account, you can sign into Flickr and begin using it. I actually started a flickr account for this tutorial. I have an image uploaded there. The URL is http://farm3.static.flickr.com/2599/4072304259_3f32a5aa1d_m.jpg

To get the URL, go to your flickr photostream and right-click on your graphic image. Choose "properties" from the drop-down menu. You should get a box with the image properties, including the URL. Highlight the URL and copy it. Paste it into something like Notepad and save it for later.

Now for the fun part. Copy the following code and paste it into Notepad, (or any plain text editor):

<style type="text/css>
div.profileNav div.memberName {
text-align: left;
text-indent: -100.0px;
background-image: url(replace this text with the URL);
background-repeat: no-repeat;
background-position: center center;
}
</style>

Where it says, "replace this text with the URL", do just that. Copy the URL to your graphic and put it in there in place of that text. Be careful to leave the brackets intact. Once edited, highlight all of the code and copy.

Go to your AARP community profile. If you are logged in, you'll see the "edit about me" button.

 Click it and go to the edit page. Paste, ( control + v ), the code into the top in the first box. It should look like this:

 Don't forget to save your changes:

That's it. Look at your profile page and you should see your member name graphic instead of the default text.

Helpful hint: I made a graphic at cooltext.com. It wasn't exactly the right size, so I opened it in irfanview, a free image editor program. First I clicked EDIT and auto-cropped borders, then I clicked IMAGE and Resize/resample. I resized to 22 pixels height and made it  longer, about 100 pixels or so. preserve aspect ratio was unchecked.