Magento: Add description tab in product’s detail page

Hello friends,
In magento the default/default theme is not providing tabs in product’s detail page. But the default/modern theme provides. So here we will discuss some steps for adding product’s description tab in product’s detail page of magento default/default theme.

Step1: Copy /app/design/frontend/base/default/layout/catalog.xml file, in /app/design/frontend/default/default/layout/ folder.

Step 2:Add

<block type="catalog/product_view_tabs" name="product.info.tabs" as="info_tabs" template="catalog/product/view/tabs.phtml" >
    <action method="addTab" translate="title" module="catalog"><alias>description</alias><title>Product Description</title><block>catalog/product_view_description</block><template>catalog/product/view/description.phtml</template></action>
</block>

code in /app/design/frontend/default/default/layout/catalog.xml file below the

<action method="setTierPriceTemplate"><template>catalog/product/view/tierprices.phtml</template></action>

Step 3: Copy /app/design/frontend/base/default/template/catalog/product/view.phtml file in /app/design/frontend/default/default/template/catalog/product/ folder.

Step 4: Copy /app/design/frontend/base/default/template/catalog/product/view/description.phtml file in /app/design/frontend/default/default/template/catalog/product/view/ folder.

Step 5: Copy /app/design/frontend/ default/modern/template/catalog/product/view/tabs.phtml file in /app/design/frontend/default/default/template/catalog/product/view/ folder.

Step 6:Add

echo $this->getChildHtml('info_tabs');

code in /app/design/frontend/ default/default/template/catalog/product/view.phtml file below the

<div class="product-collateral">

Hope this will help you.
Thanks.

Setting default Custom options checkbox checked in configurable product

We are using the configurable products feature of Magento to group together some of our products that differ for example only by colour or number of items in a pack. In our case there is just a single “option” for the product and we wanted it to default to the option as checkbox checked, rather than the Magento default of forcing the user to choose an option. As the checkbox for a configurable product is filled in on the client side with javascript
this required some javascript code to checked the option and then reload the price. Here is the javascript we used to do this . This code we have to used or placed in the “view.phtml” file of the our skin.The path of the file is app/design/frontend/ [Package_name]/[Theme_name] /template/catalog/product/view.phtml file.

<script type="text/javascript">
var $j = jQuery.noConflict();
	$j(document).ready(function(){
	// auto selects the first input with checkbox class
	$j('.options-list input.checkbox').attr('checked','checked');
	
	opConfig.reloadPrice();
	});
</script>

By applying above code, default the custom option checkbox is checked and the price is updated according to the custom option price.
Hope this was helpful.

4 Steps to make a simple WordPress Plugin

Hello friends ,
At present to make a plugin is become a very nice activity in WordPress,because all wordpress developers wants different requirements in their different Projecs.So i will explain you only 4 simple steps to make any plugin in WordPress.

Step 1.Folder Hierarchy :-

  • In the first step you will have to make a folder of your plugin name in the   wordpress -> wp-content -> plugins directory.
  • Now in this folder you are going to put your another folder of your coding files,css,js,images and one new plugin file (your_pluginname.php).
  • Now you have to write all further step’s code in your_pluginname.php named file.

Step 2. Plugin Activation and Deactivation Concept:-

  • In the Plugin File you are going to put your plugin name,your website name,your plugin version and your plugin website name as well as the code of functions like plugin activation,plugin deactivation and its shortcode.
  • In Plugin file first of all we have to put plugin configuration code.
     /*
        Plugin Name: Your Plugin  Name
        Plugin URI: Your Plugin Site (if any)
        Description:Your Plugin working or functionality
        Author: Your Name
        Version: Your Plugin Version
        Author URI: Your Website (if  any)
 */
 
  • Now you can see your plugin (without any functionality) in the Dashboard Panel -> Plugins directory.
  • In the second step you will have to put your functionality in your_pluginname.php file.
  • We have register_activation_hook() function to activate all your functionality of your plugin when plugin is activated.

register_activation_hook(__FILE__.’install’);

  • In this function the second parameter install is the function in which you are going to implement wordpress database table creation query required for your plugin functionality.If your install function is in the same file than you have to write a __FILE__ in first parameter otherwise you have to give a source path of that file.

Function install()
{
Your Database Table Cretion Query
}
  • Now we have another function register_deactivation_hook() which will remove all your functionality. You can also delete any wordpress database table which is not required after deactivate your plugin.

register_deactivation_hook(__FILE__,’uninstall’);

function uninstall()
 {
   Your Database Table Deletion Query
  }

Step 3. ShortCode Creation for your plugin:-

  • Shortcode is the heart concept for any wordpress plugin.It is necessary to make a shortcode for your plugin to put your plugin on any page to display it in GUI.
  •  It is very simple 3-step process to make a shortcode for your plugin.

1)  function shortcode()
{
Your Plugin Functionality Code
}

2)  function register_shortcodes()
 {
     add_shortcode('Your Plugin Shortcode name','shortcode');
 }

3)   add_action('init','register_shortcodes');
  • In the first step shortcode is the function which includes all the coding implementation lines which will run wherever you put the shortcode.
  • In the second step you have to register your shortcode by the register_shortcodes function in which you can keep any name of the shortcode as the first parameter of the add_shortcode function.
  • The third and last step includes the function add_action() which will initializes the action of the register_shortcode function.
  • Now we will see some rules for keeping Shortcode name :-

                                                    1)Names should be all lowercase and use all letters;

                                                    2)Numbers and underscores should work fine too(not dashes)

Step 4.Create an Admin Panel Option  For Your Plugin:-

  • Admin panel is another nice concept for any wordpress plugin.
  • It includes all the customization optins which you will provide for your plugin.
  • It is very simple 3-step process to make a Admin Panel for your plugin.

1)  add_action('admin_menu', 'my_first_admin_menu');

2)  function my_first_admin_menu()
{
add_menu_page('Plugin Admin Options', 'Your Plugin Admin Panel Name', 'manage_options','my first','admin_panel);
}

3)  function admin_panel()
{
Code  For Your Admin Panel Options
}

  •  Now you can see one option is added to your wordpress dashboard admin  panel.
  •  In the first stepthe action is added to the dashboard panel to create a new menu (panel).
  •  In the second option  you have to give any name to your Admin Panel option which will incude in the dashboard panel option of  wordpress.add_menu_page function will create a admin page for your customizing options.
  •  In the third and last step you have to create a function which named as in the last parameter of the function add_menu _page and it will includes the coding impletion lines for customizing the plugin functionalities.

This is the very simple four steps and now  you can create your own plugin .Enjoy..

Problems with magento while upgrading to 1.7

Hello friends,
At present magento is growing more and more. Magento released the latest stable community version 1.7.0.2 on 5th July 2012. And it is good practice to upgrade our magento store to latest version to get the benefits of latest version’s functionalities.
But we have seen some horror stories on the web about people who upgraded their live site without testing for errors and compatibility issues. So be sure that while upgrading magento first of all we must upgrade it in test environment and not touch the live site until the test environment comes out ok.
Here are some common problems with magento while upgrading to 1.7 discussed in detail:

Problem1: We were working with our custom theme and after upgrading magento to 1.7, when we tried to open the My Wishlist page it gave the following error:

Fatal error: Call to a member function setItems() on a non-object in .../app/design/frontend/base/default/template/wishlist/view.phtml on line 43

Solution: Solution of above error is: Just remove / rename the

/app/design/frontend/[Custom_Package_name]/[Custom_Theme_name]/layout/wishlist.xml

file from your custom theme. So now it will use the wishlist.xml file from the /base/default/ theme.

Problem2: When we open the product’s view page of the product which has custom options then while loading the product page it shows the regular price of product. But when product page is completely loaded at that time product’s price becomes zero.
Solution: Just replace the

/app/design/frontend/[Custom_Package_name]/[Custom_Theme_name]/template/catalog/product/view/options.phtml

file with the

/app/design/frontend/base/default/template/catalog/product/view/options.phtml

file.

Problem3: In a customized theme we noticed that Google had stopped indexing our site. We checked and Google analytics number was still set in Admin -> System -> Configuration -> Sales -> Google API -> Google Analytics and enabled. But when we checked the source code of our site, there was no Google analytics code there at all.
Solution: Solution of above problem is: Just remove / rename the

/app/design/frontend/[Custom_Package_name]/[Custom_Theme_name]/layout/googleanalytics.xml

file from your custom theme. So now it will use the googleanalytics.xml file from the /base/default/ theme.

Hope this will help you.
Thanks.

Reusing the Magento’s Calender Control

Magento contains so many controls (widgets, blocks), etc. that you can reuse on the frontend or on the backend. One such control is the calendar control. Calender control mostly used in the backend area of the magento. Now, We can used in the frontend.

Calender Control

To reuse the calendar control in the frontend just we have to follow the below two steps and we used in the frontend area or in any module.
1) Include the javascript files in the app/design/frontend/ [Package_name]/[Theme_name] /layout/mymodule.xml.

<reference name="head">
    	<action method="addItem"><type>js_css</type><name>calendar/calendar-win2k-1.css</name><params/><!--<if/><condition>can_load_calendar_js</condition>--></action>
    	<action method="addItem"><type>js</type><name>calendar/calendar.js</name><!--<params/><if/><condition>can_load_calendar_js</condition>--></action>
    	<action method="addItem"><type>js</type><name>calendar/calendar-setup.js</name><!--<params/><if/><condition>can_load_calendar_js</condition>--></action>
</reference>

2) Include the below code in to your phtml file app/design/frontend/ [Package_name]/[Theme_name] /template/mymodule.phtml.

<span>
    <img style="" title="Select Date" id="date_select_trig" class="v-middle" alt="" src="<?php echo $this->getSkinUrl("images/calendar.gif");?> "/>
    <input type="text" style="width: 120px;" class="input-text" value="" id="selected_date" name="selected_date"/>
    <script type="text/javascript">
    //<![CDATA[
        Calendar.setup({
            inputField: "selected_date",
            ifFormat: "%m/%e/%Y %H:%M:%S",
            showsTime: true,
            button: "date_select_trig",
            align: "Bl",
            singleClick : true
        });
    //]]>
    </script>
</span>

By applying above code, we used in any .phtml file or at any place in the magento frontend.
Hope this was helpful.

Creating and Compiling a war file in eclipse using ANT script

>>Here i am taking the example of Spring MVC web project. The structure of my project is:

   SpringExample
  |   
  + – src
  |      +com.springexample.spring
  |           -HelloWorldController.java
  |
  + – WebContents
        | – Index.jsp
        |
        + – META-INF
            | – manifest.mf
            |            
        + – WEB_INF
            | – lib
                      (All jar files required for the project)
            | –  project-servlet.xml
            | –  web.xml
            |                
        + – jsps
            |- welcome_page.jsp
            |- goodbye_page.jsp

>>Next the structure of war file will be:

 

  SpringExample.war
  |   Index.jsp
  |    
  + – META-INF
  + – WEB_INF
      |   project-servlet.xml
      |   web.xml
      + – classes
      |    (all class files generated during compilation)
      + – lib
          (All jar files required for the project)
 + – jsp
      |    (jsp i have used for mvc)

 

>>Now we are familiar with the structure of our project and the war file , we must follow the following steps to generate the war file:

  1. Firstly create a build.xml file in same project space, which will contain all the required instructions to run an ANT Script.
  2. Next we will create the projectlib folder in our project space , in which all the required jar files used to compile our project will be contained(we will packge these jars into our WAR file as well).
  3. In build.xml file we will define our project and few variables that point to src, webContent, build folder etc.
  4. Next we will define our class path.
    – In this section we will mention different locations for external jars that are required to compile our project.
    – like my projectlib folder which holds all the spring framework related jar files.
    – etc
  5. Now We will define some commands which will be automatically called from command line.
    – example
    ant clean
    ant build
  6.  The  ANT script will perform following steps
    – It will create “build” folder within the same project space, where all of the complied classes will be genrated
    – Now it will compile java files from src folder and keep their genreated class files in build/classes/ folder.
    – Now ANT script will create a war file by including contents of the webContent folder and remaining folders of ur project.
    – ANT script will also include all jar files from projectlib into SpringExample.war/WEB-INF/lib folder.
    – ANT script will also include all class files from build/classes into SpringWebExample.war/WEB-INF/classes folder.
  7. Finally the project is compiled and you can find the SpringExample.war file in the build folder.

>>ANT Script(build.xml):

<?xml version="1.0" encoding="UTF-8"?>
<project name="SpringExample" basedir="." default="usage">
<property name="src.dir" value="src" />
<property name="webcontent.dir" value="WebContent" />
<property name="build.dir" value="${basedir}/build" />
<property name="name" value="SpringExample" />

<path id="project-classpath">

<!--  here give path for jar repository -->

<fileset dir="${basedir}/projectlib">
<include name="*.jar" />
</fileset>
<pathelement path="${build.dir}" />
</path>

<target name="build" depends="compile" description="build project, but first compile it">
<war destfile="build/${name}.war"
webxml="${web.dir}/WEB-INF/web.xml">
<lib dir="${basedir}/projectlib"/>
<classes dir="${build.dir}/classes" />
<fileset dir="${web.dir}">
<include name="**/*.*"/>
</fileset>
</war>
</target>

<target name="compile" description="Compile java files and place them webContents/web-inf/">
<mkdir dir="${build.dir}/classes"/>
<javac destdir="${build.dir}/classes" failonerror="true">
<src path="${src.dir}"/>
<classpath refid="project-classpath"/>
</javac>
</target>

<target name="clean">
<delete dir="${build.dir}" failonerror="true"/>
</target>
</project>

>> Your war file is created.

Hope this helps you… 🙂

Posted in JAVA. 1 Comment »

Improve magento search results

Hello friends,

At present magento’s default search functionality is pretty good and it gives good search results. But we can improve magento search results with some tricks.

The first point is that magento has three search types.

1)    Like,               2) Fulltext and                   3) Combine (Like and Fulltext)

By default, magento uses the “Like” search type. But we have to do a few experiments with all three search types and see which one produces the best results for our store. And according to that we have to set search type for our store. We can set search type from Admin -> System -> Configuration -> Catalog -> Catalog -> Catalog Search -> Search Type.

Second point is that by default, magento gives search results in ascending order. And search results are returned by relevance. It means magento displays least relevant products first and most relevant products at the last. So to display the best search results on the top we have to change the order of search results to descending. We can specify the descending sort order in /app/design/frontend/[Package_name]/[Theme_name]/template/catalogsearch/form.mini.phtml file. Within the


<form id="search_mini_form" ... >

tag, add the following.


<input type="hidden" name="order" value="relevance">
 <input type="hidden" name="dir" value="desc">

We can also set descending sort order for search results in /app/design/frontend/[Package_name]/[Theme_name]/layout/catalogsearch.xml. Where we have to add the following code


<reference name="search_result_list">
     <action method="setDefaultDirection"><string>asc</string></action>
     <action method="setDefaultOrder"><string>relevance</string></action>
 </reference>

between the <catalogsearch_result_index> tags


<catalogsearch_result_index translate="label">
 ...
 </catalogsearch_result_index>

And the third point is to disable quick search in Description and Short Description. By doing this we can reduce the unnecessary search results, and can get qualitative and specific search results. To disable the quick search from description and short description we have to go to Admin -> Catalog -> Attributes -> Manage Attributes. Where open the page to edit the description and short description attributes respectively. Then look through various option items and one of them will be a “Use in Quick Search”. Change it to “No” and re-index the magento indexes. Now you have successfully removed description and short description attributes from being used in quick search.

That’s it.

By performing above steps you can improve the search results of your store and day by day it will improve the visitor’s experience for your store. And normally those small changes can convert into more sales.

Hope this will help you.

Thanks.