Creating a good Favicon set for your Magento online store is a
good idea. The better you do it the more it will be used.
Please follow these instructions, if you think it is to
difficult, ask us.
- Create a .png file of the favicon you want to use. (This
site can be very helpful http://pixlr.com/editor/). - Make this file 310 x 310 or lager.
- Go to http://faviconit.com/.
- Follow the instructions on that site.
- Than edit the /app/design/frontend/YOUR
DESIGN/template/page/html/head.phtml file. See below. - Create a folder in your Magento root folder. For example
/fav/ - Upload the files you have downloaded from http://faviconit.com/.
- Done
Step 5
Before
<meta http-equiv=”Content-Type” content=”<?php echo
$this->getContentType() ?>” />
<title><?php echo $this->getTitle()
?></title>
<meta name=”description” content=”<?php echo
htmlspecialchars($this->getDescription()) ?>” />
<meta name=”keywords” content=”<?php echo
htmlspecialchars($this->getKeywords()) ?>” />
<meta name=”robots” content=”<?php echo
htmlspecialchars($this->getRobots()) ?>” />
<link rel=”icon” href=”<?php echo
$this->getFaviconFile(); ?>” type=”image/x-icon”
/>
<link rel=”shortcut icon” href=”<?php echo
$this->getFaviconFile(); ?>” type=”image/x-icon”
/>
<!–[if lt IE 7]>
<script type=”text/javascript”>
//<![CDATA[
var BLANK_URL = ‘<?php echo
$this->helper(‘core/js’)->getJsUrl(‘blank.html’)
?>’;
var BLANK_IMG = ‘<?php echo
$this->helper(‘core/js’)->getJsUrl(‘spacer.gif’)
?>’;
//]]>
</script>
<![endif]–>
<?php echo $this->getCssJsHtml() ?>
<?php echo $this->getChildHtml() ?>
<?php echo
$this->helper(‘core/js’)->getTranslatorScript() ?>
<?php echo $this->getIncludes() ?>
After
<meta http-equiv=”Content-Type” content=”<?php echo
$this->getContentType() ?>” />
<title><?php echo $this->getTitle()
?></title>
<meta name=”description” content=”<?php echo
htmlspecialchars($this->getDescription()) ?>” />
<meta name=”keywords” content=”<?php echo
htmlspecialchars($this->getKeywords()) ?>” />
<meta name=”robots” content=”<?php echo
htmlspecialchars($this->getRobots()) ?>” />
<link rel=”shortcut icon” href=”/fav/favicon.ico”>
<link rel=”icon” sizes=”16×16 32×32 64×64″
href=”/fav/favicon.ico”>
<link rel=”icon” type=”image/png” sizes=”196×196″
href=”/fav/favicon-192.png”>
<link rel=”icon” type=”image/png” sizes=”160×160″
href=”/fav/favicon-160.png”>
<link rel=”icon” type=”image/png” sizes=”96×96″
href=”/fav/favicon-96.png”>
<link rel=”icon” type=”image/png” sizes=”64×64″
href=”/fav/favicon-64.png”>
<link rel=”icon” type=”image/png” sizes=”32×32″
href=”/fav/favicon-32.png”>
<link rel=”icon” type=”image/png” sizes=”16×16″
href=”/fav/favicon-16.png”>
<link rel=”apple-touch-icon”
href=”/fav/favicon-57.png”>
<link rel=”apple-touch-icon” sizes=”114×114″
href=”/fav/favicon-114.png”>
<link rel=”apple-touch-icon” sizes=”72×72″
href=”/fav/favicon-72.png”>
<link rel=”apple-touch-icon” sizes=”144×144″
href=”/fav/favicon-144.png”>
<link rel=”apple-touch-icon” sizes=”60×60″
href=”/fav/favicon-60.png”>
<link rel=”apple-touch-icon” sizes=”120×120″
href=”/fav/favicon-120.png”>
<link rel=”apple-touch-icon” sizes=”76×76″
href=”/fav/favicon-76.png”>
<link rel=”apple-touch-icon” sizes=”152×152″
href=”/fav/favicon-152.png”>
<link rel=”apple-touch-icon” sizes=”180×180″
href=”/fav/favicon-180.png”>
<meta name=”msapplication-TileColor”
content=”#FFFFFF”>
<meta name=”msapplication-TileImage”
content=”/fav/favicon-144.png”>
<meta name=”msapplication-config”
content=”/browserconfig.xml”>
<!–[if lt IE 7]>
<script type=”text/javascript”>
//<![CDATA[
var BLANK_URL = ‘<?php echo
$this->helper(‘core/js’)->getJsUrl(‘blank.html’)
?>’;
var BLANK_IMG = ‘<?php echo
$this->helper(‘core/js’)->getJsUrl(‘spacer.gif’)
?>’;
//]]>
</script>
<![endif]–>
<?php echo $this->getCssJsHtml() ?>
<?php echo $this->getChildHtml() ?>
<?php echo
$this->helper(‘core/js’)->getTranslatorScript() ?>
<?php echo $this->getIncludes() ?>
