An exciting new way to learn your textbooks
                                 notemonk

jMaki widgets for WordPress

Posted: June 8th, 2009 | Author: admin | Filed under: Programming, jMaki | Tags: , , , , | 8 Comments »

For those who doesn’t know jMaki,

“jMaki is an Ajax framework that provides a lightweight model for creating JavaScript centric Ajax-enabled web applications using Java, Ruby, PHP, and Phobos.”

i call it a widgetting framework, jMaki provides widgets which are the wrappers to the most popular javascript libraries like Dojo, Scriptaculous, Google, Yahoo etc… These wrappers are available for PHP and JSP which makes it very easy to add those javascript libraries to your PHP or JSP applications.

To a trial I started adding jMaki accordion widget to my wordpress blog which has turned to a WordPress plugin (download)

If you want to add other jMaki widgets to your blog, first go through the article:
wordpress-how-to-create-widgets
which will explain you of the basics of creating a WordPress plugin.

By now if you have gone through the above article you should be knowing how to say ‘Hello World’ from your sidebar. Now at the place(method) where you have written

echo "Hello World";

you need to replace that with the jMaki code which will look like this:

addWidget( array(
                          "name" => "jmaki.accordionMenu",
                       "style"=>"{height:40em}",
                          "value" =>"{
                           menu : [
                           {label:  'Blogs',
                                menu: [
                                    { label : ' Greg Murray',
                                      href : 'http://weblogs.java.net/blog/gmurray71/'
                                    },
                                    { label : 'J Naveen',
                                      href : 'http://jaininaveen.blogspot.com/'
                                    },
                                    { label : 'Prashanth Ellina',
                                      href : 'http://blog.prashanthellina.com/'
                                    },
                                    { label : 'Carla Mott',
                                      href : 'http://weblogs.java.net/blog/carlavmott/'
                                    },
                                    { label : 'Arun Gupta',
                                      href : 'http://blogs.sun.com/arungupta/'
                                    },
                                     { label : 'Vikraman',
                                      href : 'http://vikraman.blogspot.com/'
                                    }
                                    ]
                           },
                           {label: 'Sites',
                                menu: [
                                    { label : 'TollyZone',
                                      href : 'http://jmaki.karthikbala.com/tollyzone'
                                     },
                                    { label : 'Zenmocha',
                                      href : 'http://www.zenmocha.com'
                                    },
                                    { label : 'TechSpirit',
                                      href : 'http://www.karthikbala.com'
                                    },
                                    { label : 'Indian Capitals',
                                      href : 'http://indiancapitals.com'
                                    }
                                    ]
                           }
                                    ]
                       }"
            ) );

The above code is for the accordion widget, it differs from widget to widget, you can find them from here and before that u want to download jMaki from here but the above piece of code depends on other file called jmaki.php which you can add to your plugin directory and import that in this file by adding the line

 require_once("jmaki.php") ;

but i got a problem saying permission denied to access files, for which i need to set variables in ‘php.ini’ which is not preferred when writing a plugin, so smartly i added the required function in jmaki.php to mywidget.php. Still jmaki.php inturn calls other javascript functions which comes with jmaki-min.js which inturn make use of other files.The directory structure for a widget jmaki.accordion should be like this:

/- accordion
    |
    +-accordion.php
    |
    +-resources
    |    |
    |    +-jmaki.js
    |    |
    |    +-config.json
    |    |
    |    +-jmaki
    |        |
    |        +-accordion
    |        |    |
    |        |    +-component.css
    |        |    |
    |        |    +-component.js
    |        |    |
    |        |    +-component.htm
    |        |
    |        +-resources
    |             |
    |             +styles
    |                |
    |                +-themes
    |                     |
    |                     +-theme.css

You can find all those required files from the jmaki package you downloaded. jMaki website has got good documentation to start over.

Note:jmaki-accordion widget is in top 50 wordpress plugins


8 Comments on “jMaki widgets for WordPress”

  1. 1 Biju Subhash said at 6:18 pm on July 2nd, 2009:

    Thank you for the plugin :)
    Biju Subhash

  2. 2 Siirt said at 7:36 pm on August 27th, 2009:

    Thx u 4 the plugin ;)

  3. 3 Martijn said at 3:40 pm on January 8th, 2010:

    Nice one!
    Any hints on how to change the behaviour from expand on hover to expand on click?

  4. 4 Martijn said at 3:49 pm on January 8th, 2010:

    Nevermind. I opened component.js and changed ‘onmousehover’ to ‘onmouseclick’ in line 59 and 60.

    Now I wonder how I can stop the menu collapsing when I choose another Category so all links can be displayed at the same time.

  5. 5 siirt haber said at 11:39 pm on February 14th, 2010:

    i like wordpress plugin thank you

  6. 6 alex said at 2:53 pm on March 4th, 2010:

    Hi,

    Please help.

    Menu1 (item1, item2, item3)
    Menu2 (item1, item2, item3).

    I want to select item2 from Menu2 without it collapsing back to Menu1.
    How would i do that?

  7. 7 harsh said at 9:21 pm on March 15th, 2010:

    Hi.. after installing the jmaki plugin, I get the following error on opening some pages of my wordpress installation –

    Warning: Cannot modify header information – headers already sent by (output started at C:\xampp\htdocs\wp\wp-content\plugins\jmaki-accordion\jMaki accordion.php:121) in C:\xampp\htdocs\wp\wp-login.php on line 287

    Any help on this?

  8. 8 ktsixit said at 3:14 pm on March 26th, 2010:

    Thank you for the plugin but I have to say that your documentation is poor. Okay, we can see the files, we can edit them but can we implement this plugin into a post? Is there anyway to create an accordion without hard-coding? It’s a nice plugin but you really need to work on the documentation.


Leave a Reply