Magento – How to Add color picker in Magento Admin Configuration Page 

1. In adminhtml/default/default/layout directory, create the layout XML file for your module.
Lets name it as yourmodule.xml.Write following content in yourmodule..xml:
 
<?xml version="1.0"?>
<layout version="0.1.1">
 <default>
        <reference name="head">
            <action method="addJs"><file>YOURMODULE/jscolor.js</file></action>
        </reference>
    </default>
</layout>

2. In your module's system.xml, add the color picker field as: 

<background translate="label tooltip comment">
   <label>Background Color</label>
   <frontend_type>text</frontend_type>
   <validate>color</validate>
   <sort_order>2</sort_order>
   <show_in_default>1</show_in_default>
   <show_in_website>1</show_in_website>
   <show_in_store>1</show_in_store>
   <comment>e.g "FFFFFF"</comment>
</background>
 
 3. your root folder js directory create folder [your-module-name] and add jscolor.js

Comments

Post a Comment

Popular Posts

Magmi Single and Multiple Category Importer

Magmi On the fly Category Creator Magmi can create or update categories while it is importing products This document refers to On the fly category creator Version 0.2.3 Categories column To assign your products to categories, include a column called "categories" in your CSV file. If a category branch does not exist, it will be created on the fly during the import process and your products will be assigned to it sku,name,categories "100","My Products/Sample Products/Sample Category" "101","My Products/Other Products" 1 2 3 sku , name , categories " 100 " , " My Products / Sample Products / Sample Category " " 101 " , " My Products / Other Products " Each branch level of the category tree is separated with a forward slash (/). In the example shown above, the two products will be put into their own categories and the following tree ...
Read more