Accordion Image Menu V 3.1 – Less Code More Flexibility

This is a new release of the Accordion Image Menu Worpress plugin. The plugin allows to use the feature images or the images uploaded to the posts and pages galleries as background for the menu items.

On the previews versions the accordion was based on mootools but its causes a lot of interaction with others popular plugins which use jquery. So, I decided to implement a jQuery Plugin that allows the same functionality and avoid including another javascript framework.

Special Features

  • Allows to combine pages and categories and apply order to them
  • Can be integrated with the wordpress > 3.0 menus interface
  • The plugin uses the medium size image attached to post and pages
  • The menu uses the top image from the posts/pages gallery
  • You can use it to list recent posts
  • Multiple transition effects included (Elastic, Bounce, Sine, Pow, Quart, Back, Circ)
  • You can include ‘the title’ of the target pages
  • Allows to include multiple menus on your blog
  • The menu can be based on posts/pages ids
  • Compatible with: Chrome, Safari, Firefox and IE 7, 8, 9

The shortcode

As the plugin is based on WordPress Shortcodes you can include some attributes in order to customize the menu and overwrite the Default Settings saved in the Plugin Option Page.

Here you have the Shortcode attributes list:

    position = 'vertical'  Orientation of the menu (vertical/horizontal)
    type = post' Type of menu list (post, page, menu)
    cat = ' ' List post under this categories if type = post
    number = 5 Number of post
    name ='' Name of wordpress menu (under Appearance)
    effect = 'swing' Animation effect based on:jQuery UI Effects
    closed_d = 100 Items dimension when the menu is not activated
    opened_d = 200 Items dimension when mouseopen
    width = '' Width of the menu if it's vertical
    height = '' Height of the menu if it's horizontal
    duration = 300 Transition timing
    border = 1 Border between items 
    border_color = '#000000'  Border color
    open = '' Item opened by default  (0,1,2,3...randomly)
    id = '' Post or Pages Ids separated by comma


Using the shortcode with these attributes: position, height, open


[a_image_menu position="horizontal" height="200" open=0]

PHP Code
<?php echo do_shortcode('[a_image_menu position="horizontal" height="200" open=0]') ?>

Using the shortcode with these attributes: position, id, open, effect, closed_d, border


[a_image_menu position="vertical" id="479,333,303,135,118,428,328" open="randomly" effect="easeOutBack" closed_d=80 border=3]

PHP Code
<?php echo do_shortcode('[a_image_menu position="vertical" id="479,333,303,135,118,428,328" open="randomly" effect="easeOutBack" closed_d=80 border=3]') ?>

Frequently Asked Questions

1- Which images uses the menu?

– The menu use the last image uploaded to the post/page gallery but you can move to the top the image that you want to use.

2- How to insert the Accordion Image Menu?

– The plugin includes a Widget that can be added to your sidebars.
– The shortcode can be used into the content of your posts or pages using:


or in your theme files using php code:

<?php echo do_shortcode('[a_image_menu]'); ?>

3- How many accordion can be used in a single page?

There is not teorical limits

4- The menu allows extenal links and custom images?

No yet, the menu allows to includes pages and post from your blog. If you use WordPress Menus it has to be based on pages, post and categories.



Your are invited to include your comments and suggestions in the comment box and your support for future improvements by clicking on the donate button.

116 thoughts on “Accordion Image Menu V 3.1 – Less Code More Flexibility”

  1. Hello to all,

    Thanks for this beatiful and useful plugin!!!

    I’ve use successfully the plugin, now I would like to know if is possible,

    how can I use especific links for each slide, instead of those links from posts/pages related with each image?

    A way to change the links related with each slide? Change something in post database or within the script?

    Many thanks in advance

    1. Yes, its possible but you need to implement a peace of code:
      You can create an array with the pages id and the menu “open” id and assign a open parameter based on the page.

      1. Thanks for the quick reply. Where should I put the code? In the php file of the plugin or in the pages? Anyone who has done this allready and has an example code?

  2. Hello

    I’m giving a chance to your great plugin. I have notices published, but however, no images appaear, only text, when I move my mouse pointer over the plugin.

    What’s happening?


  3. Hi, I may have missed something but I cannot figure it out how to make the accordion menu appear beside (not above or under) the text of the post. I’m using a short code feature to have multiple accordions as it’s the only way to assign a unique accordion to a unique post. Thank you.

  4. Love the plug-in, but am having trouble getting the desired image to display in the menu. This doesn’t seem to be answered in previous FAQ posts, since I am using Pages, and not Posts. When editing is done to a page, previous images, or even images from other pages sometimes appear. Thanks for the great plug-in.

  5. Helo. That is really an amazing plugin. Is there a possibility to implement a third stage of interacting?
    1. closed 2. onmouseover:half opened(like the way it is now) and 3. fully opened over a defined width on click?
    I would be very thankful for a short reply.

    Kindest regards

    1. The item on the menu display:
      – The featured image or last image attached to the post gallery. This is if you are using it for post.
      – In the case of using the menu for categories, is’t almost the same; the featured image of the last post on this category.

Leave a Reply

Your email address will not be published. Required fields are marked *