Are there any fellow font addicts in the house? :) Have you ever wanted to use fonts to add a cute, personalized look to your blog? Have you seen blogs with cute fonts for their titles, dates, or sidebar headers and thought, “I want that!”? Have you’ve already tried to do it, only to discover if someone else doesn’t have the font installed, they won’t see it?
If you answered yes to any of those questions, then I have good news for you my friend! This is a tutorial on how to use your own, custom fonts on your Blogger/Blogspot blogs. You can change your post title font, sidebar titles font, and even the date font. And even if the other person doesn’t have the font installed, they’ll still be able to see whatever font you chose.
Updated: August 23, 2012
{ click image to see this working on Blogger }
Here’s how you do it.
1. Choose a font. It can be any font you want. Feel free to browse the selection of free fonts offered here on Kevin & Amanda!
2. Convert the font to SWF. Make sure the font you chose is saved on your computer and is unzipped, then visit the site below to convert your TTF file into a SWF file.
http://www.sifrgenerator.com/wizard.html
Follow the onscreen instructions to upload your font. When going through the steps, you don’t have to change any of the options. Just use what they have. When you get to Step 2, confirm that sIFR 3 r436 is checked. If anything else is checked, it won’t work. Download and save your newly converted font (it will be a SWF file).
3. Download and save the following three files. To save, right click on the filenames below and choose Save Target As or Save Link As.
sifr.css
sifr.js
blogger-sifr.js
Note: If you are using a new Blogger Designer template, and your sidebar titles are not changing, use this file instead of the one above:
4. Create an account at Dropbox.com. You’ll need an account here, even though you already have a Blogger/Blogspot blog. This is where you’ll host your custom font file, and the other files needed to correctly display it on your blog. Unfortunately, there’s no way to host these on Blogger, so you’ll need this a separate hosting account.
- Go to Dropbox.com/register and Create An Account. If it asks you to download a file, just click Cancel.
- Go to Dropbox.com/home to upload your files. Again, it will ask you to Install Dropbox, but just click the X in the top right corner of the popup, you do not have to install Dropbox on your computer in order to upload files.
- Click on the Public folder, and then click on the small Upload icon.
5. Upload the SWF font file and the sifr.css and sifr.js files you just downloaded. We will upload the blogger-sifr.js file next. Once uploaded, click on the SWF font file, and click on Copy Public Link and Copy to Clipboard.
6. Customize the blogger-sifr.js file. Open the blogger-sifr.js file in Notepad (Windows) or TextEdit (Mac) and you’ll see something like this:
var kevinandamanda = {
src: 'http://username.hostwebs.com/fontname.swf'
};
sIFR.activate(kevinandamanda);
Delete http://username.hostwebs.com/fontname.swf and replace with the link to the SWF font file you copied to your clipboard in step #5.
*Careful* This is a common typo area. Don’t delete the quotes around the font URL or the code won’t work. It should look exactly like it looks in the code above, except with your link.
Now under that you’ll see three sections: Post Title, Date and Sidebar Titles. In those sections, you will see something like this:
css: ['.sIFR-root { color: #000000; font-size: 28px; font-weight: normal; }'
,'a { text-decoration: none; }'
,'a:link { color: #000000; }'
,'a:hover { color: #000000; }
See those three places where it says color: #000000; ? Change that six digit code, 000000, to whatever color you want. (You will need to know the 6 digit color code.)
The first one changes the color if it's NOT a clickable link.
The second one changes the color if it is a link.
The third one changes the color if it's a link and people hover their mouse over it.
Usually the first two are the same color and the third one is a different color. I personally make all three of mine the same color.
Here's a color slider to help you pick your color and get the code. Or I use a cool Firefox plugin, Colorzilla. It lets you click on any color on any webpage (like a background that's already on your blog) and it'll copy the color code to your clipboard. Then all you have to do is paste the code where it goes. I use this addon all the time! :)
You can also play around with the font size if you want it bigger or smaller. Just change 28 to a bigger or smaller number. (Try 32 if you want bigger, 20 if you want smaller.)
You can change the font color and size for all three sections. *Note* There are ultimately 9 places where you can change the font color: 3 in the Post Title section, 3 in the Sidebar section and 3 in the Date section. Be sure you change them all! :)
When you get done playing, save the file and upload to Dropbox.
This is the final step! Don't skip it! :)
7. Now it's time to implement the code into your Blogger/Blogspot blog. Go to your Dashboard. Click on Layout, then Edit HTML.
Look in that code and find the line that says </head> (Look closely, it's not <head>, it's </head>)
(Quick Tip: Click CTRL-F to search for </head> to easily find it in all that code)
Just above </head>, copy and paste the following code:
<link href='http://dl.dropbox.com/u/100014927/sifr.css' media='all' rel='stylesheet' type='text/css'/>
<script src='http://dl.dropbox.com/u/100014927/sifr.js' type='text/javascript'/>
<script src='http://dl.dropbox.com/u/100014927/blogger-sifr.js' type='text/javascript'/>
On all three lines, delete my Dropbox links and replace them with your own.
***This is another common typo area. Double check your work here!
Save that.
That's it!!! Now go to your blog and see your new, customized look!!! :)
Frequently Asked Questions / Troubleshooting
* Here are the most common problems... and their solutions! :) *
I think I did everything right, but it didn't work.
1. Check to make sure you did the "final step" correctly and that there are no typos.
2. Check your blogger-sifr.js file for typos- this is the most common reason why it doesn't work. Compare your blogger-sifr.js file with mine and see if you can spot your typo.
3. Check to make sure you uploaded all your files to your HostWebs.com account. You should have at least 4 files: blogger-sifr.js, sifr.css, sifr.js, and your SWF font file. If even one is missing, the whole thing won't work.
4. Make sure you have the most current version of Flash and Javascript installed and up-to-date on your Browser.
5. You may need to refresh or restart your browser (or even reboot the computer) for changes to take effect. Any changes you make through Blogger or HostWebs.com will be immediate, but because of browser caching, your browser may still show the “old” blog instead of the “new” blog with the font changes.
6. This code is intended to work on the default Blogger Minima template. If the code for your blog has been modified from it's original template, this code may not work for you. You may need to switch back to a default template for this code to work.
7. If you are using the HostWebs.com links, but it's not working, try changing the links to Webs.com. Everything else will stay the same, just change "HostWebs" to "Webs". There are 4 places where you'll need to change the code. (One in your blogger-sifr.js file, and 3 in your Blogger HTML code.) Not sure what the deal with HostWebs/Webs is, but sometimes if you create an account at Hostwebs, your links will be at Webs. I can't figure it out!
8. If you are getting a weird line of text at the top of your blog that says Read More and has a a link back to this site, go back to the HTML section of your Blogger Dashboard, find the text (just under where you pasted the code) and delete it.
My titles totally disappeared! (Blank Titles)
Blank titles are usually the result of a typo in the blogger-sifr.js file. Double check your work and compare your blogger-sifr.js file with mine and see if you can spot your typo.
There could also be a problem with your SWF font file. Type the address of your SWF font file in your browser. It should look like this:
http://kevinandamanda.webs.com/peahannahvanilla.swf
(click on the address to see what it should look like on your screen)
If it is a blank screen, there's an error with the SWF file and that's why your titles are blank too. You will need to delete that SWF file and try again. You may need to try it from a different computer / browser / ISP.
It worked, but I have two sidebars and it only changed the fonts for one.
Add this code to the bottom of your blogger-sifr.js file:
// Code for Second Sidebar
sIFR.replace(kevinandamanda, {
selector: '#sidebar h2',
fitExactly: true,
tuneHeight: -5,
css: ['.sIFR-root { color: #000000; font-size: 28px; font-weight: normal; }'
,'a { text-decoration: none; }'
,'a:link { color: #000000; }'
,'a:hover { color: #000000; }'
],
wmode: 'transparent',
ratios: [6, 1.93, 10, 1.92, 13, 1.86, 17, 1.82, 21, 1.8, 29, 1.79, 32, 1.78, 33, 1.77, 36, 1.78, 43, 1.77, 44, 1.76, 47, 1.77, 70, 1.76, 71, 1.75, 74, 1.76, 75, 1.75, 76, 1.76, 1.75]
});
//End of Sidebar code.
Look in the third line and change the word “sidebar” to whatever you named your second sidebar when you added it. Only the word sidebar, don’t mess with the # or the h2. For instance, it may look like this:
selector: '#left-sidebar h2',
My fonts are being cut off!
This is a problem with the way the font was made, not with the code. If it’s one of my fonts, simply download the newest version of the font from my site. You will need to unzip, reconvert, and reupload the new font file. Be sure to delete all instances of the font from your computer and your hostwebs.com account first. If it’s not one of my fonts, you will have to contact the font author for an updated version of their font.
You can also look in your blogger-sifr.js file, and find the line that says fitExactly (it’ll be in there three times, once in the Post Title section, once in the Sidebar section and once in the Date section) and if it says true, change it to false. *Thanks to Liene for this info!
The custom font is showing up, but the old font is still there too! (Double Titles)
There’s a problem with your sifr.css file.
1. Check to make sure you uploaded the sifr.css file to your HostWebs.com account.
2. Check to make sure you didn’t make a typo when you copied and pasted the code above the </head> in the Edit HTML section of your Blogger Dashboard.
It worked, but my titles used to be centered and now they’re not.
Whenever I get this comment, I always check, but they always look centered to me. I think it’s because I use Firefox and not Internet Explorer.
You can try adding this code, but I’ve gotten mixed results- some say it works, some say it doesn’t.
Find this in your blogger-sifr.js file:
css: ['.sIFR-root { color: #000000; font-size: 28px; font-weight: normal; }'
Add this:
css: ['.sIFR-root { color: #000000; font-size: 28px; font-weight: normal; text-align: center; }'
It’s working, but the old font is showing up first, then the custom font loads.
The font is competing with all the other photos, blinkies, widgets, music playlists, etc, on your blog for loading time. Limiting the number of posts that show on your blog to 10 or less will help speed things up. Other than that- the font is just like an image and will always have to “load”- that’s just the nature of the internet. (It even does it on my blog.) The original font is there first just in case the custom font never loads, you will still have a post title. How fast the custom font loads will depend on your internet connection speed and the HostWebs.com connection speed.
It worked! Now how can I change the font for my blog header / description / footer / pages / other blog element?
I don’t recommend using this method to change the font for any other element on your blog besides your post titles and dates. I normally prefer using images. I only like this method for post titles and dates because they are changing with every post- and it would be a pain to make a new image for every post! :) For elements that aren’t changing constantly, like your header, I recommend creating an image and uploading that.
My custom titles suddenly stopped working.
Make sure you have the most current version of Flash and Javascript installed and up-to-date on your Browser.
You may also be interested in…
Want to add a second font or change the font for your entire post?
Check out my second tutorial in this series.
More from Amanda:
Share:
Filed Under: Blog Design • Tutorials
2,372 Comments
Okay, so I followed your directions and was not able to change the font of my post tile, but instead it changed the sidebar titles. Any recomendations? Do I need to add an extra code to change my post title?
Thanks
so i followed your directions…obviously not since its not working. I checked and dont see anything wrong in the html text. When my blog is loading i see the old post title font and color but when its done loading there is nothing…?? So i went to change it back to original and that was a no go. How do i fix it?
ok so now i went to just start over and try a new font. It wont let me download it on sirf generator. It says it doesn’t know what program was used. oh my i need help!
THANNNNNNNNNK YOUUUUUUUUUU! I’m so greatful!
HI Amanda! OMG thank you soooo much for all the amazing stuff you do for all of us! I am 99% there with changing the fonts in my blog – what I cannot find is the spot where Im supposed to paste the code into my html above , do you know approx where it is, like at the very top of the code, or in another section? I do see a , do you think that’s it? Thanks again Amanda, I love your fonts and cannot WAIT to have them on my blog :)
Hi! Love your blog!!! I am using Susie’s Hand as well for my font and the loops of the y’s and so forth are cut off. I went and downloaded your font on the blog but it didn’t seem to help. Any suggestions? Thanks so much!
Okay, I am still at a lost. I am still unable to change my post title and date (I can only get my sidebar to change) to a cute font. I have posted my blogger-sifr.js file and if anyone has any recommendations I would be ever so thankful.
Would any successful readers feel inclined to post their blogger-sifr file so that I may compare?
Thank you!!! I’ve learned so much today :)
I’ve done everything above that I should. Or thought I have. And am not real sure where to place any of the codes in my HTML box in blogger. I’m getting confused. I’ve made the webs, I’ve made the changes you recommended, Now where do I put it all???
Wow, I’m probably making this harder then it has to be, call it a long day, who knows, but will you help me?
Thank you! A million times, thank you!!! I so appreciate you sharing how to make changes (like fonts) to blogs- I was so bored with the plain-jane fonts that blogger offered.
Woo hoo! Thanks so much!!
Hi. I’ve tried to change the font and it worked but my old font title is still there also. So now I have two titles. Any tips on how to remove the old title with the boring font?
I tried and tried to get the font to work but it doesn’t. I even had my friend Dawn help who was successful at downloading your cute fonts help me her blog is http://www.ourlittlechinagirl.blogspot.com. We’ve doubled checked everything and redownloaded files. Can you give me any advice?
Kind Regards,
Candy Sheehan
Amanda,
YOU ROCK! This tutorial is the ONLY one out there that actually works and is easy to understand/follow. Just finished it for my blog and figured out how to adjust the header and footer wrappers since I have it set up as such in blogger.
I give you KUDOS for all your hardwork and generosity with your site – it is one of my absolute favorites since I have found it. Thanks so much for this – it really helps for those of us that like to pretty things up a bit – you bring more beauty to the world for sure!
catherine
so….is there a way to change the font of the *text* on a blog too? by using some variation of these directions???
thanks for the tutorial! i am always longing to bring more personality to my blog!
It Worked!! weeeee :D I just changed a few…i could not register on webs.com, i don’t know why. When i hit on submit it would just keep on turning but won’t move on to the next thing so i just used hotlinkfiles.com and also changed a few on blogger-sifr.js coz the first time i did it, no change on my sidebar just the date header and post header, so then i tweaked and tried again and learned that i also have to change this part
selector: ‘#sidebar h2′,
with the one that is called on my template
selector: ‘#sidebar-wrapper h2′,
And now it worked! Thank you sooo much. oh i’ve also used your font named “impervious”
God Bless and have a good day :D
Hi Amanda,
Thank you for making your fab fonts available for us to use. I chose Auburn, and it gave my blog a much-needed spark. I added your button on my sidebar.
Thank you!!!
Tricia
Thanks so much, Amanda and Kevin!
I have been working on designing and this is the test site: http://pamreno.blogspot.com/
I wonder if there is some special code with a three column layout? I think it is working in the main body and the right hand side, but not the left. Hmmm.
By the way, you take wonderful photos! I enjoyed seeing the ictures from your trip. God Bless! Holly
thank you so much for posting this tutorial, amanda. it was very easy to follow.
unfortunately, i followed every step and everything seemed to go smoothly {i got no errors or anything like that}. i read and re-read every step carefully and went slow so i did not miss anything.
but when i went to view my blogger blog after editing my html in the layout and saving, there was no change—the old title font remained and the new one {parisian} was not there.
do you have any suggestions for me?
ARGH! I swear I followed the instructions to a T, didn’t get any error when changing the code on blogger, but I don’t see any changes? Help…
Hi Amanda,
Thank you for making great fonts. They are wonderful, and it is so nice of you to share them. I was going to ask why the font is not showing up in my sidebar titles, but I think I just fixed it (crossing my fingers).
Thank you!
Hi Amanda, I’ve been trying to change my post title font for awhile now, and FINALLY stumbled across this tutorial. I was so excited to give it a whirl, and followed each step.. to no avail. Like prior posts, there is no change.
I tried re-starting my computer, closing my windows, and trying in both Mozilla and IE, but still no success.
I tried inserting the code right above the line or further up in the HTML code as well.. no result.
When you take a look at my page, I cheated with the Post Titles.. they are simply just jpeg images. I’d love to just have the post titles fonts changed though so I don’t have to go through the aggravation of making a jpeg for each new post title. Thank you for your time! Sorry for the novel…
Thank you so much for all this great info.! I was able to easily change the font on my blog with your helpful instructions. My only problem is that when I go to change the font on my blog title it is adjusting my title to the left and I would like it to be centered. Any suggestions on how to fix this? Thanks so much!
I got the fonts to work on the title and the date but it is posting double title and date. One in the new font and one in the old. What did I o wrong? Help
Help!! I can’t seem to get one of your cute fonts on my blog. I have followed the directions 3 times and the first 2 times all the lettering that was supposed to change just disappeared and then the last time the lettering just stayed the same.
thank you so much for this! finding your site has made my day!!
your directions were so easy to follow, but my only problem is that i am getting the cutting off of the font that i would like to use. it’s not one of your fonts (which would make my life easier!) but i did find the creator of the font i’m trying to use and i emailed her about it. she said since she’s fairly new at designing fonts shes not sure what to do to fix this.
is there something i can tell her so that she can fix the font?
thank you again for this tutorial!! i cannot wait to get my blog looking cute with your help!!!
@marissa moss
If she uses Font Creator Pro, like I do, she can go to Format > Settings > Metrics and click on Calculate. All done!
i love your website…
Thank you So much Amanda! It worked and I love it!
~Emily Joy
Thank you for your tutorial! It’s awesome!! Thanks again!
Hi Amanda!
I love your fonts and I am so happy I found your site. I am having a little problem with getting the font to show on my blog. I went through all of your directions on how to make this go on my blog about 4 times and I just cannot get the font to change. Any suggestions or help would be greatly appreciated! Thanks so much :)
Amanda –
THANK YOU for this tutorial!! Everything worked beautifully!! Thank you thank you thank you!
Erin S.
hello there Amanda! wow :D I never thought someone could do this kind-of stuff on the net. and you’ve been an angel for fontlovers since i-dont-know-when-but–it-has-been-quite-a-while, and I just knew it today!! ohmygoddd.. I’m SO behind haha. this thing is so cool.
anyway, I’ve tried it on my blog! wallah! it works yay~ :D I still have to master the steps though hehe but that’s not a big problemo. your website is always here right? ;] anyhoo, is there any way that I can make your fonts as my blogposts’ writings? because now it only works on the titles :)
Thank You So Much Amanda!! I love the peas :D keep it up.
p/s could you please reply to my email, please? because I might not have the time to come here often so, it will be very easy for me to check through my email. I really appreciate it :)
wonderful fonts you have and they are so darling. It took me a while to get it to work but I finally did and it’s well worth it. I love the fonts and they add an extra special personal touch to my blog. Thank you for all your hard work and for the wonderful fonts!!! I also used them on my craft blog to.
abbyscardz.blogspot.com
Thanks,
Abby
hello again Amanda :D hmm I have a question. hope you wont mind me asking how to change the fontsize of my sidebar titles? because I already changed 28 to 23 (in the blogger-sifr.js) but only the post-titles were changed.
Thanks yeah :) and oh. thanks for the tutorial on changing my posts’ body font! :D
Thanks a LOT :D
As a suggestion from Shabby Blogs I hopped over here today. I’m a lover of all fonts and gosh you have some great ones. I totally follwed your tutorial and got it working correctly the first time! My only issue is that I wish I could make the sidebar fonts smaller as they are kinda large. I might have missed that part, but they’ll do for now until I can figure it out!
Visit my blog to see! I used Pea Steele!
Thanks for such great things! I’ll be back
http://www.longwindedcrazy.blogspot.com/
awesome tutorial!! and CUTE fonts! THanks for helping out, I finally figured out how to view my fonts from other peoples computers!
Hello, oh amazing, Amanda! How do you find enough hours in the day?!? I love all your sites/links!
Any chance anyone has played around with this in typepad? I know it is all related… just trying to get it in the right spots. I’ll keep playing around though! I can use it as picture though (.png) and am just learning to do a blog… but already have posated your “love kevin & amanda” button. Thanks!
michael :-)
I’m really bummed that I couldn’t just get this to work! I tried fixing all the things, but I fit in the “I think I did it correctly but nothing happened” category. gulp.
I appreciate the help!
Thanks so much! Your instructions were so easy to follow!!!
I just did this and let me tell you THANK YOU THANK YOU THANK YOU! It turned out so cute and I LOVE the way by blog looks now… so much more un-plain! Great job and thanks again!
Thank you thank you thank you! Your instructions were super easy to follow – in nice easy plain folk language! lol
I snagged a great header and background and shabby blogs and then with your help I managed to make my fonts groovy too! I am in your debt!!
Lovin the new look – come check it out! http://litabells.blogspot.com/
Thanks again!!
Help! I want to use Pea So Lovely as my post/sidebar header font but I can’t find in my template! I tried the Ctrl+F but it didn’t come up with anything. Can you help me please? This is an AWESOME site btw!
OMG you are AMAZING!! I WISH you made more tutorials for blogger you make it sooo easy!!! If making a 3 column template and other edits to my blogger was explained this easy it would make it a breeze!! You are simply amazing!
Ok so i went to my blog and it did work although not exactly how i wanted it to. One when i go to my blog it shows the old plain text for a second before my font loads up. Can this be fixed? Also i changed the font colors and somehow pink showed up as one of my colors? I just wanted the blue and the brown that is in my banner i used the firefox add on that you suggested for the color codes. Also i tried to follow the instructions above for a 3 column template and am having a really hard time understanding it :( Please help!
kevin and Amanda,
heyoo! I love your site.
I want to ask where get the signature after
every post? I’ve tried that on mine but it won’t
work! E-mail me. Thanks!
hey kevin and amanda! it’s me again.
I just wanted to know what site hosted you?
to me it looks like blogger, is it?
anyways, I could I ever change the font
and color of my blog’s header/tilte?
thanks
♥Liam
thanks so much!! got it working!! : )
http://www.marissaandmichael.com
thanks a bunch! I did it.. your posts are really helpful :D
I love your website! I came across it from Shabby Blogs, and it is such a huge help! I love the way the different fonts make my blog look.
I do have a question, though. I have a 3 column blog, and when I changed the fonts, it only did the middle and right column. Is there any way to make it do all three? I’m really scared of html, so I don’t trust myself enough to go in and try to figure it out myself.
If you get a chance, email me (mrs_mehaffey@yahoo.com) and let me know. I really appreciate everything!
Hi Amanda! I love your fonts! I tried doing a font for my blog but it’s not doing anything!! PLEASE HELP! I followed all of your directions but it’s just not doing anything, my font has not changed.
I did it! Thank you SO much – you rock!
Just want to say thanks alot
A long list of stuff but thats no fault of your own.
The instructions were clear and it was easy to follow and modding the sifr file is fun!
Thanks again
Leon
I made a blog yesterday ..of course it’s still under construction.. but i wanna have a a cute font for my blog. i used blogger.com. can i download the fonts to my blog or is it only for websites?
Hey there Amanda! Thanks so much for all your help! I used this tutorial to do some work today on my blog and I LOVE the results! I used your font, digsmyhart AND this tutorial… does that get me extra points?! ;) I love your blog and all the fonts too!
Thanks again,
Amy
Hi Amanda,
I love your website! you are awesome! You are so talented! Thank you so much for all your tutorials for changing your font on your blog! I just finished this on my blog! I love it! So awesome! Thank you so much again! here is my blog if you want to check it out!
http://www.txholtfamily.blogspot.com
I have done this on another one of my blogs and it worked perfectly. So I decided to do it again (on a new webs account of course) … and it is not working. I have triple checked my work…. Idk what’s going on.
nevermind i figured it out! :)
Hey Amanda.. I just wanna ask you about this. My old fonts are still there while the new one’s loading.. Is that okay? or did I miss something?
and some other problem is I’m using the 3 columns template. So, when I add a picture or something underneath my post, the font of the tittle will appear as the old one..
I’d be so happy if you could help me.. thank you so much, I love your blog!!
http://livingforhim2.blogspot.com/
When I opened the swf file, the box that popped up did not have a url. it was just the font and a sentence that kept getting bigger and bigger.
help?
Hi!
I love your site & really appreciate all you’ve done to make blogs cuter:) You are super talented!
Well, i need your help! I downloaded 2 fonts & followed your instructions to get the post titles in my blog to change. i want to use pea annalee. but it’s not working. when i do it, my titles disappear. i double & triple checked & i don’t know what i’m doing wrong!
i thought maybe i wasn’t getting the correct URL from when i click on blogger-sifr.js b/c when i click on it where i’m supposed to copy the URL, the window disappears immediately- there’s not time to copy it. i even did a screen shot so i could see it, but you still can’t see the entire thing. Even so, i compared it to yours & it should be right, as i have http://www.melissavenable.webs.com/blogger-sifr.js
Maybe this is wrong? I did it last night till i was seeing crosseyed, then went to bed & tried again this morning. not working! I hope you can help me.
i’d really like my post titles & sidebar titles to be Pea Annalee. I wish i could get my Blog Title to also change (where it says “Little Miss Married”) but i don’t know if i can do that.
Thanks for any help you can give me! :)
Melissa
Thank you Amanda for all your hard work. I tried using your tutorial, and was not able to get it to work. I am sending you and SOS. HELP! Let me know what I can do to fix it. Thanks again for all your hard work.
Fabulous tutorial! It was easy to follow and – though I consider myself a novice at HTML and all that jazz – I did it right the very first time. :) Thank you soooo much Amanda!
Sorry- i’m clueless- thanks for emailing me back, but i’m afraid i still am clueless. I thought this is what we post in our blog:
Just above , copy and paste the following code:
So where does the link to the swf file go? This is exactly what i posted in the edit html part of my blog… with my username put in of course. Where am i putting the link to the swf file? Sorry, i’m so confused! :(
ARGH. Ok, in my last comment i’d highlighted what you’d said for us to copy & paste in the “edit html” part above , it just didn’t show up…
Hello. :) So I have a couple questions…
1st- I’m using your adorable fonts for my blog but I just changed my blog to a 3 column and it’s only changing 2. I saw in my webs.com account under “blogger-sifr.js” that in order to get the cute fonts on my 3rd column I had to “copy and paste the following lines at the bottom of this file. Change the word “sidebar” to the name of your third column. Only the word sidebar, don’t mess with the # or the h2.”
So I copied the whole thing but it’s not working and I think it has to do with the part where I’m suppose to change the word “sidebar” to the name of my third column. But I have no idea what the name of my third column is. I’ve tried so many different names but it’s still not working. Do you know what my name is? :) hehe
2nd- I’m trying to download some more cute fonts but they’re downloading has zip not ttf so I can’t change it to a swf. Does that have something to do with my computer? I got about 3 fonts before it started happening.
Thank you so much for you time! I love your fonts and everything you have done!
~ Tayler
Hi Amanda-
Thank you so much for posting this.
Question: typically, when you hover over a link, like for example the title of a post, in the bottom left hand of the screen, it displays where the link will take you. When I change the font to a fun title, it no longer does this. Any ideas?
Ok I tried to figure it out. I got it to work, then they disappered all together. I started over from the begining thinking I did something wrong, and it’s still not working. I am sorry to be a pest… please help. I did add a link/button on my blog. Thanks for any assistance you may be able to provide. I AM VERY OVERWHELMED WITH THIS!!
Ok… now I’ve got it!!! I have 2 sick kids this weekend and 2 more driving me crazy. Thanks for all your help, you are a lifesaver. Now I need to figure out the post font problem. Thanks again.
here the link…
http://thet-squad.blogspot.com/
Hi
So far so good… but… it doesn’t load immediately. First the original font appears, then it switches over after about 3 seconds. Is this normal?
And I didn’t want to use the script for the post header, so I removed the code as you suggested, but then neither the date or sidebar text showed either – everything was blank.
It is now sort of working – with the code set like this:
Post Title: selector: ‘h3.’,
However, if I take out the whole section: h3.post-title as you suggested, I have no code at all!
So am I still doing something wrong?
Yay!! It worked for me! :)
But, I have it on a personal blog – but I’m going to change the fonts for my public blog too :)
I just happened upon your blog this afternoon and have spent the whole evening downloading fonts, reading tutorials, and making my blog about my son extra spiffy:) Thank you SO much for your generosity in offering all of these free downloads and information! I have always loved customized blogs, but didn’t want or have the extra money to have someone fix mine up. Now, I can go and make mine pretty all on my own! THANKS! :)
Lauren
http://littlemoments-noah.blogspot.com
Thanks so much! My sides seem a tad HUGE still, but I LOVE the font!! http://acesmommy.blogspot.com
Thank you very much for the use of your fonts!!!! Your instructions worked once I got the hand of things! Both of my pages are up and running.
http://eb-creativity.blogspot.com/
http://dbwluna.blogspot.com/
HELP!
Yes, back again. Sorry, i just can’t get this! I hope i’m not driving you crazy! ;) I want Pea Annalee. The only thing not working, is i can’t open/save the SWF file from my computer. Any suggestions? I’ll give you the password to my blog if you wanted to just do it for me! LOL. Seriously, i have no idea what i’m doing wrong!!
Thanks so much for the tut and the fonts!! I love it!
How FUN!!!! Just did it and it worked like a charm;) Thanks SO much!!!
Kudos to you Amanda! This is awesome work and I was so excited to get to use a cute, cool font for my blog. It totally personallizes it. Thanks!
I got it!! Actually, my friend had to save the swf file in my webs account on her computer. for some reason my computer would NOT do it. :( but anyway- now it’s done & so cute & i love it! Thanks so much for your help! You’re the best! :)
http://melissavenable.blogspot.com/
Thanks so much for your help!! It’s fixed! I had to get a friend to go into my webs account & change the ttf file to swf…for some reason my computer wouldn’t do it! But now it’s done & so cute! Check it out! :)
Thanks so much for all your help!!! :)
http://www.melissavenable.blogspot.com
Thanks so much for the fonts! I love handwriting! I can’t wait to experiment more later! Your tutorials were spot on! thanks again!
Hi! I came across your blog when I googled on how to change my font besides the boring options blogger has.. and I must say I love your blog!
I followed the steps I guess I’m not good with computers I chose my font peafaith and went to http://www.sifrgenerator.com/wizard.html but it said “This file does not have a program associated with it for performing this action. Create one in the Set association control panel.”
Not sure what I’m doing wrong! Maybe you could help me. Thanks!
Hey I got the new font to show up on my blog (so cute) but I’m having problems with the old one showing up for a little bit before the new one does? I checked to make sure I copied the code above right, not sure what I’m doing wrong??
I have posted these awesome fonts on all of my blogs but I still can’t figure out how to make it work for headers! Help!please!
Thanks for the info! I’m designing a blog for our dental office and we have a signature font that I’m trying to use for our Blog title… I went through all of the steps and my font shows up in the headers on the left but its PINK! I’ve tried changing the color codes but they just stay pink! The words also get a different color box around them. Any ideas? Thanks! Connie
This is an amazing tutorial! Thank you so much for posting this Amanda! Prior to finding your site, I had been searching google for a few hours trying to find a straightforward and effective site for changing title font. Your page has EVERYTHING! I love it, its perfect! Thanks again! :)
Ok i am going to have another go at this and really try to get it to work with my 3 column blog. As now it is not even showing up on my blog at all :( START OVER!! lol Cross your fingers. If anyone is willing to help with the 3 column blogger please email me sherry71481@gmail.com Thank you!!
Hi Amanda! Love, love, love your site! Thanks for all you do!
One question, I have a few different blogs and want to change the fonts on each of them (for the post titles only). How do I do that? Do I need to download and rename my files?
Hi!
I did everything you stated to change my font to the Pea Heather Font. I even deleted on my uploaded files from my webs.com account because it didn’t work the first time and re-uploaded all 5 of them again starting fresh and tried it again! Still, after pasting into my blogger html it doesn’t change my blog titles?
Like I said, I re-did it thinking I maybe had a typo along the way, but after re-doing it there was no change again. Maybe I am making the same mistake twice? But basically after doing all you said there is no change?
Let me know if you have any advice!
Oh Amanda, I love your website and have learned so much through this process.So, thank you so much for all of your hardwork!! I am so apprecitive. Im VERY green with all of this css code stuff. I went step by step trough the process and still had no success. Nothing happened at all. The first problem that I had was here with this step:
Once all the files are uploaded, find the swf file and click on it to open it. Copy the URL in the address bar at the top of that screen that pops up. You’ll need it in just a sec.
When I uploaded my swf files. they loaded as “charlie.ttf or alittlepot.ttf” . When I opened one of these files a url address is not on the top of what opens. So I just wrote the address as you did. with my username, and the name of the font replaced. I don’t know if this is where my problem lies or if it is somewhere else. If you could look at it I would be so thankful. I would love to put a button of yours on my site. Im not quite sure how to do that either ;) Thank you again for your time. Looking forward to hearing from you.
Blessings! Brook
So I followed the directions, and the new post font is not showing up on any computer that doesn’t have it installed. Also, how would I change the font for my sidebar descriptions of the members of my family? I really want just our names in the new font. Any help would be awesome!!
Hello Amanda,
I have tried this about 5 times now! HA HA! I cant get it to work. I am using google internet browser but downloaded firefox…still doesnt work. I have done everything right. I even slowed down and read out loud to make sure I did just as it says…HELP, SOS, Please! Ha ha! Thanks so much!!
Thank you so much for this… it was very interesting and fulfilling right up until I wanted to bang my head on my desk and then the font appeared on the screen and I was totally excited. Now I am trying to figure out the Blog title/ description… index part of it doesnt tell me anything but asking me if I am the site owner, yada yada… ?help?
My site is private so I sent you an invite.
You are so nice to help all these people individually. Really—I’m shocked!
Anyway, I’m trying to add the pea joraanstad font to my blog title. I’ve followed the instructions twice and double checked my copying and pasting in html. I don’t know what gives. If you could help I’d be so happy. I’m new at this and ran across your site today–which I love!
I copy and pasted what I put in my blogger HTML below–what do you think I’ve done wrong?
Hi there!
I’m having problems with the http://www.sifrgenerator.com/wizard.html. I followed every step but when i press download, they say: ‘error 3′.
I’ve tried using different fonts & a lot of times but it still show this error. please help! (:
okay… well I figured out the index was in my pc file… anyhoo I for the life of me can NOT get the title to change into anything other than gray… the 00000 for black not working. Not that I expect you to be able to work a miracle, I just thought that maybe if I typed it out I would feel better and be able to walk away.
thanks again. BTW, I linked you a few times about your awesome-ness!!!
help! i just visited my super lame blog
a while ago and the fonts of my blog posts’
titles were back to the same normal and boring
one again. I just wanted to give my blog some more life.
hope you can help! thanks.
Ok, I have no idea what I am doing wrong. I am on webs.com and am trying to edit my blogger-sifr.js file. I click on edit. Replace with my font info but when I go to save it will not let me. I keep getting a “page not found” as soon as I click on the file tab, most of the time I never even get to click on the save link. I am thinking this may be a webs.com problem, but wanted to check if a) anyone else was having this problem? and b) is it something I am doing?
yesterday the new titles were showing up on my computer only, now they aren’t showing up on any computer. they are still the normal blog font not the cute new one. i went back through and re-did all the steps to see if i had messed something up, but it still isn’t working. please help!!
theredburns.blogspot.com
Thank you so much Amanda! I am so happy to have a pretty blog! I didn’t blog for around 7 months so I wanted to spruce it up so I would remember to use it again! I love your free fonts, they gave my page that little something extra!
You are AMAZING!
Thank you for your willingness to share and help others!
God bless you!