Mike Web Guy Do things on the Web

10Jul/092

What is a favicon ?

You see that little M logo on a black background in the address bar ? That is this site's favicon. A favicon is a small file preferably 16x16 pixels or 32x32 pixels that gets to be displayed in your browsers address bar when you visit a website. If you haven't noticed them yet. You should start looking for them. They are a very simple way to make your website a little more memorable. Some browsers even display the favicon for links that you have bookmarked. In short if it's something that sticks out it will help your visitors remember your site easier.

So lets get started. There are two methods I prefer over all others to create this little image/logo. One is to start with an image that you already have and the other is to create a text based favicon using a free tool. Lets start with the image as that is probably the most harder way. Lazy people skip ahead now. First you need to have a square image that you have either created or have rights to use on your website. Next you will need an image editor to scale the image down to the size we need and to save it as a favicon. The best free image editor that I know of is IrfanView it's great download and install it really quick if you don't have it. If you are using a different image editor good luck. I'm going to asume that you know how to use it. If you are using IrfanView drag the image into it and then go to Image > Resize/Resample... Leave all of the default selections as they are and only change the width and height to 32x32 after that Ok your way out of that menu and then go to: File > Save because this image is super tiny to begin with we don't have to be greedy with quality. Drag the quality slider all the way up to 100. Under the Save as type: dropdown select: ICO - Windows Icon name the file favicon (All lower case.) and Save it.

Great you just created your very own favicon. For the lazy ones out there there is free software online that will allow you to create a text based favicon. It is called AntyFavicon. I have a link to them in the sidebar at the very bottom. Check out some of the other great resources that I have for: Web Design/Dev Tools. Back to the favicon. Go to that website enter in some text pick your colors and click on the save as favicon file button. Doesn't really get any easier then that.

Now that you have your favicon either created from an image or text you will need to put it on your website. The cool part is taht there is no extra coding you need to do and nothing else to modify on the actual website. All it takes is for you to upload that favicon file into the same folder that your index.html file is located in also know as your public_html or www folder. Once you do that it should start showing up in your browsers address bar. If you don't see it right away you might want to try clearing your browsers cache (ctrl+r to force refresh) or using a differnet browser that has no cache :D Easier then you though right ?

7Jul/090

Get a real domain for your MySpace account


Before we go any further this works for any social networking website that allows you to have your own user id url. So lets get started. First thing you will need is a domain name and a hosting account. You can get both of these from one of the great companies I recommend on the Hosting Page.

After you have set up your hosting account with the domain name of your choice you will need to tell your domain to redirect all of the visitors to your MySpace page or Facebook page. My preferred way to do this is called an: .htaccess redirect. Every hosting account has a public folder where you can upload your website some companies call this folder www and others call it public_html I've seen companies that have both. Either one works and they both do the same thing. The www or public_html folder is the root folder of your account. Whatever you put in there will show up on your domain name. However what we want to do is make it so that whenever someone goes to your domain name they get your MySpace or Facebook account. For that we need to set up a redirect.

First you will need to create a text file I like to use Notepad simply because I am on a Windows machine most of the time. However any text editor should do just fine. Open up a text file and copy and paste this code into it:

RewriteEngine on

RewriteCond %{HTTP_HOST} ^domainnnamegoeshere.com$ [OR]
RewriteCond %{HTTP_HOST} ^www.domainnnamegoeshere.com$
RewriteCond %{REQUEST_URI} ^/$
RewriteRule ^(.*)$ http://www.myspace.com/usernamegoeshere/ [R=301,L]

Replace domainnnamegoeshere.com with your domain name and: usernamegoeshere with your MySpace url nothing more nothing less. For example If I were to do it with my domain here is what the code would look like for me:

RewriteEngine on

RewriteCond %{HTTP_HOST} ^mikewebguy.com$ [OR]
RewriteCond %{HTTP_HOST} ^www.mikewebguy.com$
RewriteCond %{REQUEST_URI} ^/$
RewriteRule ^(.*)$ http://www.myspace.com/mikewebguy/ [R=301,L]

You will now need to save this file with the name .htaccess However don't do that just yet. If you are on a Windows system be careful because windows will more then likely not listen to you and add and extension to the file which we do not want there. It might add .txt (Notepad) or .doc (MS Word) In order to prevent this form happening there is a setting you will have to temporarily change. You will have to tell Windows to stop hiding file name extensions so that you can modify them. Don't get scared it's a lot easier then it sounds. You will have to go to: Start > Control Panel > Folder Options > View (Tab) > Then un-check the option: Hide extensions for known file types. Don't close this window just yet. Instead of clicking Ok click Apply as we will change this back after you are done.

After you click Apply go back to the text document and now you should be able to save it as a file called .htaccess without any other extension. If it saves it as .htaccess.txt or .htaccess.doc it's not going to work. All done with the .htaccess file. Go back to the Folder Options window that you left up and check the option: Hide extensions for known file types. Now you may click Ok.

This .htaccess file is very important because it does all the work for you. You will now need to upload it to your hosting account inside of your www or public_html folder. Each hosting company is different but all of them shoudl provide you with FTP access or access to a File Manager in your hosting account control panel from where you should be able to upload/download files. There might already be a default .htaccess file in your www or public_html folder however if you are not using your hosting account for anything else you should be ok with overwriting that file. If you do use your hosting account for hosting other domains then I would recommend to simply add the code to the existing .htaccess file and not overwrite it.

One last thing to keep in mind here is that a domain name usually takes anywhere from 24-48 hours to finish propagating. What this means for you is that during the first two days your domain name might not work as expected as it is still trying to talk back to every server on the intertet and broadcast it's existance :D That's it if you browse to your domain name after it has finished propagating it should simply redirect you to your Myspace page.

28Jun/092

My top 10 WordPress Plugins

This is my list of pugins I consider necessary!

Akismet - Hands down total anti-spam control. Easy to configure just get a WordPress API key by setting up a WordPress.com account.

All in One Adsense and YPN - Simply amazing. Super easy to integrate and the best part is that it lets you alternate between Google AdSense and Yahoo Publisher Network for ad sources. You can select where to have the ads display with great detail.

All in One SEO Pack - You want to be found on search engines right ? Google.com, Yahoo.com to name a few. This plugin will do wonders for you. It allows you to exponentially expand your SEO meta data.

Digg Digg - Great plugin automatically inserts Digg me icons only where you want it to. If you haven't yet you need to sigh up for a digg.com account today and help make the web a better place by digging great websites/articles such as this one :D

Dynamic Headers by Nicasio Design - See the logo at the top of this page ? It's actually a .jpg image that I've implemented into my WordPress header with this nifty plugin. What's the big deal you say. I could have just written some html to insert the image directly in there however this is "Dynamic" meaning it allows me to upload a new image on the fly without further altering the header coding. Anything that makes my live easier in the future is better

Flickr Widget - I like this one because it centers my images correctly. I use it mainly to liven up my page. i like to Give you something pretty to look at.

Google Analyticator - Google Analytics !!!ROCK!!! Are you using crappy statistical software such as Webalizer or AwStats ? Please stop! Aren't you sick of inconsistent data reports ? I was so I started using Google Analytics.

Twitter Widget - Tweet tweet ! If you have the tweeting obsession why not further expand it with a simple slick WordPress Plugin ?

WordPress PayPal Donation - Super easy to set up. Simply provide it with your paypal account email and you can be on your way to begging people for money. I mean asking people for support. Speaking of which have you visited my donations page yet ?