Monday, 2 September 2013

change product image on hover in catalog page Magento

To show different image on hover on magento product category page  you have to change the small code in the list.phtml file located at


app->design->frontend->default->your theme->template->catalog->product->list.pthml


and in this file around line 58 you will see something like this

       <a href="<?php echo $_product->getProductUrl() ?>" title="<?php echo $this->stripTags($this->getImageLabel($_product, 'small_image'), null, true) ?>" class="product-image"><img src="<?php echo $this->helper('catalog/image')->init($_product, 'small_image')->resize(135); ?>" width="135" height="135" alt="<?php echo $this->stripTags($this->getImageLabel($_product, 'small_image'), null, true) ?>" /></a>
      
       just search for this and replace it with
      
        <a href="<?php echo $_product->getProductUrl() ?>" title="<?php echo $this->stripTags($this->getImageLabel($_product, 'small_image'), null, true) ?>" class="product-image"><img src="<?php echo $this->helper('catalog/image')->init($_product, 'small_image')->constrainOnly(FALSE)->keepAspectRatio(TRUE)->keepFrame(FALSE)->resize(135); ?>" width="135" height="135" alt="<?php echo $this->stripTags($this->getImageLabel($_product, 'small_image'), null, true) ?>" onmouseover="this.src='<?php echo $this->helper('catalog/image')->init($_product, 'thumbnail')->constrainOnly(FALSE)->keepAspectRatio(TRUE)->keepFrame(FALSE)->resize(135) ?>';" onmouseout="this.src='<?php echo $this->helper('catalog/image')->init($_product, 'small_image')->constrainOnly(FALSE)->keepAspectRatio(TRUE)->keepFrame(FALSE)->resize(135) ?>';" />
       
       
        that’s all we need to do
        note in list file there are two modes list and grid above will work for list mode to make it work in grid mode change it around line 95 in same file
       
       

multiple website

i have recently configure a multi store for my client and i want to share this with you and in a simple way

 setting up multiple stores in Magento is somehow easy but configuring up multiple website in Magento is a bit difficult task :).

This step-by-step tutorial will guide you to do so.

I suppose that you have installed Magento in folder named ‘magento’. So, your website URL will be http://yourwebsite.com/magento/

- Create Website, Store, and Store View

- Create Website
- Go to System –> Manage Stores
- Create Website
- Name = My Website
- Code = mywebsite
- Sort Order = 10
- Save Website

- Create Store
- Go to System -> Manage Stores
- Create Store
- Website = My Website
- Name = Main Store
- Root Category = Root Catalog

- Create Store View
- Go to System -> Manage Stores
- Create Store View
- Store = My Website -> Main Store
- Name = English
- Code = English
- Status = Enabled
- Sort Order = 10

- Change Link URL
- Go to System -> Configuration -> GENERAL -> Web
- Change ‘Current Configuration Scope’ to ‘My Website’
- Unsecure -> Base URL = http://yourwebsite.com/magento/
- Unsecure -> Base Link URL = http://yourwebsite.com/magento/mywebsite/

- Change Theme (Optional: If you want different design for your new website)

- Suppose your new design template and skin folder is named ‘mywebsite’
- Copy ‘mywebsite’ template folder to magento/app/design/frontend/default/
- Copy ‘mywebsite’ skin folder to magento/skin/frontend/default/

- Go to System -> Configuration -> GENERAL -> Design
- Change ‘Current Configuration Scope’ to ‘My Website’
- Themes -> Default = ‘mywebsite’
- Uncheck ‘Use Default’
- Save Config

- Create a new folder named ‘mywebsite’ inside ‘magento’ folder.

- Copy index.php of magento folder into mywebsite folder.

- Open index.php of mywebsite folder.
- Change $compilerConfig = ‘includes/config.php’; to $compilerConfig = ‘../includes/config.php’;
- Change $mageFilename = ‘app/Mage.php’; to $mageFilename = ‘../app/Mage.php’;
- Change Mage::run(); to Mage::run(‘mywebsite’,'website’);

- Copy .htaccess file from magento folder to mywebsite folder

Finally, you have created a new website for your magento shop. Your base installation can be browsed by http://yourwebsite.com/magento/ and your new website can be browsed by http://yourwebsite.com/magento/mywebsite/