Hacking MySpace

MySpace mod enthusiast George recently emailed me with a great tip on how to embed fonts in your MySpace profile using Microsoft Weft. George was kind enough to agree to be a guest blogger to help share this technique with you all. Over to you George…

George’s profile with embedded fonts (click on the image to visit George’s profile)

In a search to find a unique font to use on my Myspace profile, I was disappointed to find out that if the viewer of your MySpace profile does not have the particular font you want to use installed on their computer, then their browser will resort to the default Arial font.

In an effort to get around this problem, I discovered a free utility created by Microsoft that allows you to embed any font into a web page.  This program will allow any user to see your font through your page without having to install any fonts on their machine. Sound difficult? It’s not, it’s real easy.  Here is a step by step:

Step 1: Download And Install Microsoft Weft

Microsoft Weft can be found at: http://www.microsoft.com/typography/web/embedding/weft3/weft01.htm
The installation is very straightforward and easy.

Step 2: Create A Test File

The next step is to create an .htm file to test our font out on.  Open notepad on your computer or some other basic text editor, and type:

Then save the file on your hard drive as test.htm
If you don’t want to go through all the hassle, just right click on the file below, and select “Save Target As”, and then save the file to your hard drive.
test.htm  After You have created this file, you will be ready to start the embedding process.

Step 3: Create An Embedded Font

The first time you run Microsoft Weft, the program will prompt you to create a repository of font information. Just select “Yes”, this process is normal. After it is finished, Weft will launch a wizard to guide you through the embedding process.

Select “Next” to Continue.  Weft will then prompt you for your Name, E-mail Address, And Digital ID. Don’t worry about this, all you need is just a name, Select “Next” to Continue.
The “Add Web Page” dialogue box will then open up

You will need to click the 3 dots   to browse and select the test.htm file that we created in step 2. Select “Next” To Continue.

Weft will then want to analyze the file. Just Select “Next” To Continue.

A box similar to the one above will open up. This is where we will select the font that we want to use. Just click “Add…”, and a list of fonts will pop up allowing you to select the font that you would like to use. After selecting the font, Click “OK” To Continue.


After you do this, you will notice that the font you selected is now in our list. Select “Next” To Continue.

Here is where it may get a little tricky, so you need to pay close attention. Embedded in the file that we are about to create will not only be the font, but also a list of “Allowed Roots”, Known as “URL Binding”. Basicly what this means is that the “Font Object” (the embedded file) will only work on web pages that you specify here.

Select “Edit”, located just to the right of “Fonts may only be used from pages under these roots”.

The box above will then pop up. Here is where you will need to enter the url of the page that you want the fonts to work on. For example, I would enter:

profile.myspace.com/index.cfm?fuseaction=user.viewprofile&friendid=63686799
Then Select Add.
www.myspace.com/secretsather
Then Select Add.
myspace.com/secretsather
Then Select Add.

After this, the list is updated.

It should look like the one above, only with your addresses. Notice that I entered myspace.com/secretsather twice, Once with the www, and once without. But the most important one is the
profile.myspace.com/index.cfm?fuseaction=user.viewprofile&friendid=63686799
Make sure you use your own ID number though. When you are finished, select “O.K.”, then select “Next”.

Weft will then create the embedded file  in the same folder as the test.htm that we created.
After the file is created weft will then pop up the “Publish Web Pages” dialogue box. Don’t worry about this, just select “Next” to continue.
A Finished Box will open up, and you can click on finished and close the program. When you close weft, you may be prompted to save the changes you have made.  This is not necessary, you don’t have to save it.

Step 4:  Adding The File To The Internet.

The embedded font we created has an extention of .eot  so we will not be able to post this file to photobucket, or most other image hosting websites as well.  You will either need to find a “File Host” on the internet, or if you have your own web site, you can upload the file there (if you don’t know how to do this, then go get a copy of “Hacking Myspace” and look at Chapter 9). As far as file hosting goes, you can type “file hosting” into any search engine and many free file hosting sites will be at your fingertips.  For this example though, I will be using www.mysharefile.com.

On the main page you will see a box that looks just like the one above. Browse to, and select the .eot file (in my case it is beyondw0.eot), enter any description (because it is required), click the “I have read and agree to the TOS” checkbox, and click “Upload” to upload your file.

After the file uploads, scroll to the bottom of the page and click on “Open Download Link” as shown on the image above. You’ll have to wait 20 seconds before you can get the url of your file, but it’s a free service, so that is to be expected.

After the 20 seconds, you’ll need to right click on “click here to download file” (shown above) and then select properties.

A box like the one above will open up, and you must select the text after “Address” and copy it. This text is the url of your embedded font file (eot). You will need this address later when you put the code in your myspace profile.

Step 5: Adding The Code To Your MySpace Profile

You’ll notice in the image below that Weft added some code to our test.htm  file.  Part of this code is what we’ll be inserting into our myspace profile.

Do not enter the above code into your profile as it won’t work.  We need to make some changes before this is possible. Enter this into your myspace profile:

You’ll need to enter the url address of your embedded font file into the parenthesis.
For Example: My code would look like this…

You can put just about anything in place of “myfont” after where it says font-family above, as long as it’s not a normal font name (such as Arial, Georgia, Helvetica, etc,…). I use 2 different fonts on my page, The first font family I named myfont, and the second is named yourfont.
We are almost finished. Now that the code is in your profile you will have to define which text will be displayed in your particular font.

For instance, if you use html to define your fonts, you will need to use the following code:

Where your text will be in the place of  “a b c d e f g”.

If you use css styles to define your fonts you will use something like:

Most people use www.myspacepimper.com to get their layouts. In this case, after you add the code to your profile, you would go to “Edit Profile”,  and do a search (Ctrl+F, or Edit>Find) and search for all instances of “font-family”. Then you would change the font name (whether it be arial, comic sans ms, impact, veranda, or whatever) to myfont.

If you need more help on adjusting fonts or defining fonts for your MySpace profile, check out Chapter 3, Chapter 6, and Chapter 18 of  “Hacking Myspace”.

Finally, after all this, you will have your own unique font on your MySpace page.

John: Thanks George that is a really cool hack. I also just wanted to show readers another cool thing that George has put together, and that’s his animated MySpace picture, which i think is pretty nifty.

Related: