OtherNovember 1, 2012

Magento Tutorial - Customizing Product Display Area

Magento Tutorial - Customizing Product Display Area
In the previous post we discussed about Featured Product Layout Magento Extension, the concept behind it, its features and benefits. In a nutshell this extension enables you to customize product display area on product page with custom layouts like one column right, two columns left etc. , custom background and featured product image , and moreover you have full control to define CSS for this product view area. These features allow you to create a unique product page which nobody else has. Have such unique site increases customers as well as global popularity because online merchants will try to offer the same style by looking at your site which definitely will also increase business competition. Let us now see how we can utilize Featured Product Layout Magento Extension effectively. Product Display Area Layouts Once you have installed this Featured Product Layout Magento Extension, login to admin panel and navigate to FME Extensions - > Featured Product Layout. Here you will find below mentioned options;
  • Add Layouts
  • Manage Layouts
  • Configuration
You start initially by adding layouts. These layouts are applied only to product display area and not the whole page which normally is configured by Magento Page Layouts.  Click on add layout where you can perform following actions; Extension Features Title: Enter the name for this layout. Since you can create multiple layouts, name would identify each layout. Background Image: You can apply your desired background image for product view area. Click on choose file and select the image which you want as background image. Layout: Featured Product Layout Magento Extension comes equipped with four pre-defined layouts from which you can choose your desired one. These layouts are as follows 1 Column Left,1 Column Right, 2 Column Left and 2 Column Right. Three columns layout is not supported because of the suitability of maximum available space. Status: This section allows you to enable or disable this layout. Store View: In case you have created multiple store views for your site e.g. for multiple languages or currencies then you can select any particular store view in which this layout will be applied. Custom CSS; You can write full CSS as is written in HTML. You can fully customize product display area on product page with the help of this custom CSS feature Choose Products: Once all the settings are configured then you can associate as many products as you would like with this layout. Important point is that if one product is found in multiple layouts then the latest layout will have priority. Setting Featured Product Image Once you have added layout and associated products with it. You can have featured image for the product uploaded from product settings.  Navigate to admin panel -> Catalog ->manage products. Select any product and look for featured image tab on the left column. Click on it and select desired image. If it is enabled then default product image will not be displayed. Disabling it will automatically display DEFAULT one. Settings of Featured Product Layout And that’s it, now you are ready to go online with completely amazing and elegant product page. You can edit any layout from Manage Layout option. The configuration section provided by Featured Product Layout Magento Extension is simple and allows you to enable or disable this extension.