MarketPress Grid plugin

About

Below is version 0.3 of a grid display shortcode plugin for MarketPress, the excellent e-commerce plugin by WPMUDEV.

WPMUDEV forum member Nick made the 0.2 version of this plugin a couple of months back, so apologies to Nick if I’m treading on your toes here, but I thought I’d sort out a couple of bugs in the plugin: I think some of them have come due to changes in the code for MarketPress since you made the plugin, rather than errors on your part!

Download

Download MarketPress Grid plugin

Changelog

Fixed:

  • Can display by price order in ascending/descending fashion using shortcode.

Coming soon:

  • Adding pagination controls to [mp_product_grid] – currently broken in [mp_list_products] too.

INSTRUCTIONS

  1. Install the plugin by uploading the zip file, or by extracting it and putting it in the /wp-content/plugins/ folder.
  2. Activate the plugin (you need MarketPress activated as well, obviously).
  3. Use it in exactly the same way as the [mp_list_products] with optional attributes below:
  • “paginate” – Whether to paginate the product list. This is useful to only show a subset.
  • “page” – The page number to display in the product list if “paginate” is set to true.
  • “per_page” – How many products to display in the product list if “paginate” is set to true.
  • “order_by” – What field to order products by. Can be: title, date, ID, author, price, sales, rand (random).
  • “order” – Direction to order products by. Can be: DESC, ASC
  • “category” – Limits list to a specific product category. Use the category Slug
  • “tag” – Limits list to a specific product tag. Use the tag Slug
  • Example: [mp_product_grid paginate="true" page="1" per_page="10" order_by="price" order="DESC" category="downloads"]

Questions?

Feel free to ask questions, either in the comments below, or on the WPMU-DEV forum

69 thoughts on “MarketPress Grid plugin

    1. This is currently not working in either this plugin or in the standard MarketPress shortcode itself. I will have a look at it when I get some time!

  1. Hi Chris,

    Kudos for taking the time out to work on this! Haven’t tested myself yet but will do when I get chance.

    Folks, if you use this do remember to send some points!

    Chris & Nick: It’d be great for you two to liaise over using something like Git or Subversion to merge your changes and maintain one codebase.

    Much easier for folks to keep updated then too. You might wanna put this on WordPress.org too (presumably it’ll work with the free version of MP too) enabling automatic updates into the future….

    Cheers,
    Phil

    1. Hi Chris,

      Thanks for taking this on. And yes, let’s put it up on WP.org! Please make sure to include both of us as plugin authors.

      Don’t worry about treading on my toes — no ego here. 😉 Just trying to make MP a better product for everyone whilst keeping up with my other clients.

      One question though about the plugin — and this may require Aaron’s input — is whether it is really even necessary.

      See, the only real difference between [mp_product_grid] and [mp_list_products] is that I’ve removed the “product description” field (excerpt) and set the CSS to make the products appear like a grid.

      It seems that this could EASILY be built into the existing code by adding an additional attribute, like this:

      [mp_list_products display=”grid”]

      [mp_list_products display=”list”]

      @Aaron — thoughts on this?

      Nick

    2. @Nick dude, thanks for the points! I only need another 170 given to me, and I’ve got my free membership!

      @Aaron despite having just made a new version of this plugin, I would agree that this would be sleeker, and likely result in less people coming on the forum saying “How do I put all the products in a grid”?

  2. @Chris Incidentally, I’m working on a featured product scroller shortcode for MP now — something like what you see in this theme. Would you be interested in collaborating on that?

    1. Very up for another plugin. Where are you up to so far? The jqueryness looks fun. We could put something on git…? I must say, my understanding of VCS is poor, but I’m keen to learn…

  3. Chris–

    Thanks so much for moving this along. It’s great to have the Grid plugin attributes work properly now!

    And Nick: A featured product scroller is a terrific idea. Hats off to you and Chris if you can get it up and running. Please keep us posted here on the forum.

    1. Ah damn, my stupid web hosts are basically out to ruin my life!
      On my phone now, but I’ll get it back online tomorrow. If you wanna email me, ill chuck you an email with it in as soon as I get to my PC.

      Sorry about this mate!

      In other news: I can thoroughly unrecommend Eukhost.com for their appalling service. Nothing but problems, with apparently computer illiterate support staff!

  4. Not sure if this has happened with other themes but with NELO the content div is a class and not an ID so the CSS won’t work properly.

    Simply changing the “#content” to “.content” works fine… I posted this in case anyone else has this experience with a theme they are using.

    1. Thanks much! I was baffled as to why this worked perfectly in Thesis but was unusable in the Edu-Clean theme. CSS change did the trick!

  5. Chris, this is great. I was wondering why my order wasn’t working right.

    It looks like you’re well over your 1000 point lifetime members, but I sent you 5 points from “prprofile” anyway just to give you props!

    I’m really looking forward to getting the pagination working. Any thoughts on that?

    1. Thanks for the points! I got my free membership, but its still nice to get thanks.

      Very busy at the moment, so pagination is going to be a while yet. Have you tried the new MarketPress yet – that might solve the problem, I haven’t looked!

  6. hi iam programmer
    working on your plugin
    i am trying to make the pagination work
    and i success make it work, where i can send the code
    so you can review it

    thanks
    dadan ramdan

  7. btw for the new version for all data from i remove page
    [mp_product_grid paginate=”true” per_page=”10″ order_by=”price” order=”DESC” category=”downloads”]

    page iam using for only show that page
    example page=”2″

    it mean show page 2 only but still need to figure it out how remove the pagination when doing this

  8. Will there be an updated plugin fixing the pagination soon? If not, can you please post the code dadan wrote to fix it?

    Thanks.

    1. I am awaiting the new version of MarketPress to see if that solves the issue.

      Dadan’s email was:

      still a lot of comment
      bit explanation for home
      i have to add filter and remove it after shortcode execute bit tricky
      probably you can modify more better

      then for page i check the uri
      preg_match(“/page\/(?P\d+)/”, $_SERVER[‘REQUEST_URI’],$matches)

      because i notice why doesn work sometimes in post type because LIMIT
      not setup correctly because $wp_query example page 1 is LIMIT 0,10
      but because the post only one so when second page
      is become 10,10

      so i have to ignore paged from $wp_query
      iam using matches from preg_match to replace that

  9. ”,
    ‘page’ => ”,
    ‘per_page’ => ”,
    ‘order_by’ => ”,
    ‘order’ => ”,
    ‘category’ => ”,
    ‘tag’ => ”
    ), $atts));

    remove_filter(‘post_limits’,’my_post_limits’);
    //phpinfo();
    return market_mp_list_products(false, $paginate, $page, $per_page, $order_by, $order, $category, $tag);
    //market_mp_list_products($atts);
    }

    function market_mp_list_products( $echo = true, $paginate = ”, $page = ”, $per_page = ”, $order_by = ”, $order = ”, $category = ”, $tag = ” ) {
    // function market_mp_list_products($query_string) {
    global $wp_query, $mp;
    $pagehome=”;
    $pag=”;
    if ($wp_query->is_home) {
    if (preg_match(“/page\/(?P\d+)/”, $_SERVER[‘REQUEST_URI’],$matches)) {
    //var_dump($matches);
    if (isset($matches[1]))
    {
    $pagehome=$matches[1];
    }
    }
    }
    $settings = get_option(‘mp_settings’);

    //setup taxonomy if applicable
    if ($category) {
    $taxonomy_query = ‘&product_category=’ . sanitize_title($category);
    } else if ($tag) {
    $taxonomy_query = ‘&product_tag=’ . sanitize_title($tag);
    } else if ($wp_query->query_vars[‘taxonomy’] == ‘product_category’ || $wp_query->query_vars[‘taxonomy’] == ‘product_tag’) {
    $taxonomy_query = ‘&’ . $wp_query->query_vars[‘taxonomy’] . ‘=’ . get_query_var($wp_query->query_vars[‘taxonomy’]);
    }

    //setup pagination
    $pagedx = false;
    if ($paginate) {
    $pagedx = true;
    } else if ($paginate === ”) {
    if ($settings[‘paginate’])
    $pagedx = true;
    else
    $paginate_query = ‘&nopaging=true’;
    } else {
    $paginate_query = ‘&nopaging=true’;
    }

    //get page details
    if ($pagedx) {

    //figure out perpage
    if (intval($per_page)) {
    $paginate_query = ‘&posts_per_page=’.intval($per_page);
    } else {
    $paginate_query = ‘&posts_per_page=’.$settings[‘per_page’];
    }

    //figure out page
    /*
    if ($wp_query->query_vars[‘paged’])
    $paginate_query .= ‘&paged=’.intval($wp_query->query_vars[‘paged’]);

    if (intval($page))
    $paginate_query .= ‘&paged=’.intval($page);
    else if ($wp_query->query_vars[‘paged’])
    $paginate_query .= ‘&paged=’.intval($wp_query->query_vars[‘paged’]);
    */
    //figure out page edit by dadan ramdan
    if ($wp_query->query_vars[‘paged’]) {
    // $paginate_query .= ‘&paged=’.intval($wp_query->query_vars[‘paged’]);
    $pag =’&paged=’.intval($wp_query->query_vars[‘paged’]);
    }
    if (intval($pagehome)) {
    //$paginate_query .= ‘&paged=’.intval($pagehome);
    $pag = ‘&paged=’.intval($pagehome);
    }
    //var_dump($page);
    if (intval($page)) {
    //echo “jjjjjjjjjjjj”;
    //$paginate_query .= ‘&paged=’.intval($page);
    $pag = ‘&paged=’.intval($page);
    } else if ($wp_query->query_vars[‘page’]) {
    //$paginate_query .= ‘&paged’.intval($wp_query->query_vars[‘page’]);
    $pag = ‘&paged’.intval($wp_query->query_vars[‘page’]);
    }
    $paginate_query .=$pag;
    }

    //get order by
    $order_by=’price’;
    if (!$order_by) {
    if ($settings[‘order_by’] == ‘price’)
    $order_by_query = ‘&meta_key=mp_price_sort&orderby=meta_value_num’;
    else if ($settings[‘order_by’] == ‘sales’)
    $order_by_query = ‘&meta_key=mp_sales_count&orderby=meta_value_num’;
    else
    $order_by_query = ‘&orderby=’.$settings[‘order_by’];
    } else {
    if (‘price’ == $order_by)
    $order_by_query = ‘&meta_key=mp_price_sort&orderby=meta_value_num’;
    else
    $order_by_query = ‘&orderby=’.$order_by;
    }

    //get order direction
    if (!$order) {
    $order_query = ‘&order=’.$settings[‘order’];
    } else {
    $order_query = ‘&order=’.$order;
    }

    //The Query
    //echo ‘post_type=product&post_status=publish’ . $taxonomy_query . $paginate_query . $order_by_query . $order_query;
    $custom_query = new WP_Query(‘post_type=product&post_status=publish’ . $taxonomy_query . $paginate_query . $order_by_query . $order_query);

    //allows pagination links to work get_posts_nav_link()
    //if ($wp_query->max_num_pages == 1 || $taxonomy_query)
    $wp_query->max_num_pages = $custom_query->max_num_pages;
    //var_dump($custom_query, $wp_query->max_num_pages);

    $content = ”;
    //echo “xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx” . get_posts_nav_link() . “”;
    if ($last = count($custom_query->posts)) {

    $count = 1;
    $counter = 0;
    foreach ($custom_query->posts as $post) {

    //add last css class for styling grids
    if (($count%4 == 0))
    $class = array(‘mp_product’, ‘last-product’);
    else
    $class = ‘mp_product’;

    $content .= ‘ID).’>’;
    $content .= ‘ID ) . ‘”>’ . $post->post_title . ‘‘;
    $content .= ”;
    $product_content = mp_product_image( false, ‘list’, $post->ID );
    //$product_content .= $mp->product_excerpt($post->post_excerpt, $post->post_content, $post->ID);
    $content .= apply_filters( ‘mp_product_list_content’, $product_content, $post->ID );
    $content .= ”;

    $content .= ”;
    //price
    $meta = mp_product_price(false, $post->ID, false);
    //button
    $meta .= mp_buy_button(false, ‘list’, $post->ID);
    $content .= apply_filters( ‘mp_product_list_meta’, $meta, $post->ID );
    $content .= ”;

    $content .= ”;

    $count++;
    $counter++;
    //add last css class for styling grids
    //if (($counter%4 == 0))
    // $content .= ”;
    }
    } else {
    $content .= ” . apply_filters( ‘mp_product_list_none’, __(‘No Products’, ‘mp’) ) . ”;
    }

    $content .= ”;

    if ($echo)
    echo $content;
    else
    return $content;
    }

    function add_mp_grid_stylesheet() {
    $mpgridStyleUrl = WP_PLUGIN_URL . ‘/marketpress-grid/grid.css’;
    $mpgridStyleFile = WP_PLUGIN_DIR . ‘/marketpress-grid/grid.css’;
    if ( file_exists($mpgridStyleFile) ) {
    wp_register_style(‘mpgridStyleSheets’, $mpgridStyleUrl);
    wp_enqueue_style( ‘mpgridStyleSheets’);
    }
    }
    ?>

  10. Chris, I am pretty new to using shortcodes. I downloaded/installed and activated the plugin. Which page do I use in Marketpress to add the shortcode? On my products page I put in shortcode [mp_product_grid paginate=”true” page=”1″ per_page=”20″ order_by=”price” order=”DESC”] When I preview the page it says “No Products.” Any ideas?

  11. A client sent me a screenshot showing a botched-up layout of the grid – they use MarketPress Lite. It appears the layout tries to put four products in a row, but when I checked on my win7 with Firefox, Chrome and IE9 AND on MacOS X Snow Leopard, Firefox and Chrome, I can’t replicate it. I see only three products in a row, which is correct. I can’t include the screenshot but if you want to see it let me know where to send it..

  12. Hi Chris,

    Firstly, thanks for this plugin – you’ve created a great step forward in Marketpress development. I left you some WPMU points recently – in fact I emptied my pockets for you dude. You’re doing a great job.

    Following on from the last comment in the thread, I’m getting some strange display behaviour too, with Woothemes Canvas in a two column (pretty standard setup).

    It seems that some items are dropping onto a line by their own, so for a request of 12 items in a grid, I would expect to see them in 3 columns by 4 rows.

    Instead I have:

    Row 1: 3 items
    Row 2: 1 item
    Row 3: 2 items
    Row 4: 3 items

    http://www.urbancomposter.co/qualityproducts/store/

    If you can’t see it in this example, I’ll be happy to take a screenshot for you.

    I can’t see why this would be the case. Anything you can help me with to shed some light on this would be great, in particular whether my assumptions about the layout are right.

    I am viewing this on a Mac, with Safari and Firefox giving the same result.

    Cheers,
    James

    1. Hey Chris,

      I had the same problem. if you notice, the rows that have 3 items in them have product names with 3 line in the rows above them. What I did was go into the CSS and give the boxes a difined height (don’t remember exactly what maybe 270px?). Now I get the same number in each row. I used Firefox and Fifebug to locate the exact CSS style to edit.

  13. So I got the short code working, but, how do I change my Products Categories sidebar, so when I click on the category, it loads a page with all of the products in that category in grid mode? Driving me nuts

  14. So, this is probably a newbie question. But how do I dictate the number of columns I want? Right now, I have 9 products that I want on a 3×3 grid, but they are stuck in 4 columns instead.

    Thanks!

  15. Hi Chris,
    I want the plugin on my home and products page. I would really like to find your plugin on the wordpress plugin page what’s the exact name of it so I can upload it on my dashboard instead of uploading it on my computer because the zip file is too big and it won’t allow me to upload it, it separates as I do that and can’t get all the files together to upload it. Thanks a ton

    1. Sorry, not quite sure what you mean. It should work as in the example above –

      [mp_product_grid paginate="true" page="1" per_page="10" order_by="price" order="DESC" category="downloads"]
  16. I activated the plugin, but my products still show up in a list format. You mentioned about adding a short code – I just don’t know where I am suppose to put the short code?? (sorry I’m a newbie too)

    1. Choose the page where you want products to appear, then put in that short code.

      What page you you currently have set up to show your product listings? Go to that one, and replace the MarketPress code with the Grid one.

  17. Hi

    I am working with a project and am using Marketpress lite. I want to use your plugin aswell. But how to show the products list on the home page??

    I tried with market-press and got the success. but the pagination is not working on the home page, rather is working on teh product category pages. I want to try out with your plugin to see if the pagination is working or not.

    My requirement is only the pagination to work. Do help me please.

  18. I’m wondering how to use a template tag instead of the shortcode to initiate the grid view. My goal is to replace the default mp_category.php display with the grid display.

    Would calling the mp_product_grid_sc() function in the page template be the right place to start?

    1. I use the market_mp_list_products function in my templates like so:

      The variables you need to send in the function are:
      market_mp_list_products($echo, $paginate, $page, $per_page, $order_by, $order, $category, $tag);

      The first variable is $echo and should be set to true, otherwise the function doesn’t echo anything back. Pagination doesn’t work either so I set my $per_page to 100 which is more than enough to display all the products that may come up (you can set it to whatever you need).

  19. Hi,

    I’ve installed your plug-in, I love MarketPress and I was hoping someone would do a grid shortcode soon. I’ve activated it and added the new code but it is still showing as a signal product list… someone please tell me what I’m doing wrong???

  20. plugin not working at all, not displaying a grid. This is something that Marketpress should have had built in from the beginning. VERY frustrating! Thanks for your efforts.

  21. Good afternoon, Chris! I tell you, I am so excited to be able to list a grid for products in my site, but in Pagelines framework it only lists items down the page. I can screen shot it for you, I’m working on a local development copy. Code added to shop page: [mp_product_grid paginate=”true” page=”1″ per_page=”10″ order_by=”price” order=”DESC” category=”seeded-paper”]
    image uploaded to http://www.parcledgardens.com/grid_issue.png

    Thanks!

  22. How do I add this grid so that it displays with my product categories too??? Because when I click on product category, the normal layout appears :/

  23. i have downloaded the plugin and just trying to get it to work right on my web site. i’m building a multi-site web site with many store in it. and want to display global products not just products on the main site. and i want it to pick products from all the categories.this is the short code that we are all given.

    [mp_product_grid paginate=”true” page=”1″ per_page=”10″ order_by=”price” order=”DESC” category=”downloads”]

    but want to change it like this will it work?

    [mp_list_global_product_grid paginate=”true” page=”1″ per_page=”10″ order_by=”random” order=”DESC” category=”all”]

    i am very new to playing with code but i don’t fear it lol thanks for any feed back you can give.

    jafar

  24. hi chris
    can you help me how do i add an excerpt on front page featured product?
    i’d like to add additional text let say above the “buy now” “add to cart” button
    can we do that ?
    thanks

  25. Hi Chris,

    I making a WordPress website for my wife and have downloaded
    and installed the marketpress and Marketpress grid plugin and followed the instruction but I cannot get it to work. Do I need to create a custom template. In MarketPress I have 2 options for store style Icon this will give me a list (products not in grid) or custom template. How do I tell how many rows and columns I want in the grid? And how to place the products in the grid. I have added the shortcode [mp_product_grid paginate=”true” page=”1″ per_page=”10″ order_by=”price” order=”DESC”] to a page and this gave me the products on the page but not in a grid. I will very much appreciate some help. Thank you.

  26. I making a WordPress online store.

    I downloaded and installed the marketpress lite and Marketpress and put the right shorcode but I can’t get it work too. How to place the products in the grid. I have added the shortcode [mp_product_grid paginate=”true” page=”1″ per_page=”10″ order_by=”price” order=”DESC”] to my store page, it listed the products on the page but not in a grid.

    Regards,

  27. Hello Chris,

    I have downloaded the plugin, but unable to get it to show in a grid view. I have paste the code on a test page but its still showing in list view.

    Can you please help me to show my products in a grid view? I am new to this, but I can follow instructions to get this going.

Leave a Reply

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