Changing how the product listing looks itself.

Hi there, hope you're all okay.

I have a few questions about actually designing the (framemarket i think) styling. So i have started designing how i want the products page to actually look and its slowly coming together on the CSS side of things. test site So as you can see i'm having trouble with getting things to line up. This is what i want to sort first. So the before sale price i believe is throwing my buy it now buttons out of place.

When i am finished i would like a border around each listing and if you could imaging a second i would like the price to be at the bottom left, with the older price above that. And the buy now button to the right of it. Nice and simple. Could you guru's guide me in the right direction please.

Also for the listing itself, which php file is this. Is it the mp_productslist.php which is in my childtheme?

Many thanks in advance.

  • Vaughan

    Hi @lee,

    First off, in order to edit the child theme templates, you need to actually activate the grid market child theme. You shouldn't edit any files in the frame market theme as they will be lost when you update the theme.

    So first you need to copy the gridmarket folder from the framemarket/themes folder into your wp-content/themes folder

    Then go to Dashboard > appearances > themes

    Activate the gridmarket theme.

    Now you should be able to edit the templates in the theme itself.

    mp_productlist.php is the correct template for the listings yes. The gridmarket uses the framemarket function for listing products, but you can use the function from

    /plugins/marketpress/marketpress-includes/template-functions.php

    In particular, copy the function mp_list_products() out of template-functions.php into your gridmarket functions.php

    then you can edit the layout and code of each of those to get your page layout how you want it.

    Hope this helps

    • lee

      Hi @Vaughan.

      Thanks for your reply although i have a few questions first:

      First off, in order to edit the child theme templates, you need to actually activate the grid market child theme. You shouldn't edit any files in the frame market theme as they will be lost when you update the theme.

      So first you need to copy the gridmarket folder from the framemarket/themes folder into your wp-content/themes folder

      Then go to Dashboard > appearances > themes

      Activate the gridmarket theme.

      I think i have already done this. I am using the twenty fourteen theme with the gridmarket shortcode as a page. I'm guessing the gridmarket is working because i can see this? I'm still learning all this, apologies if i have read it wrong but if i activate the gridmarket theme wont i loose all the work i have done on the theme currently activated?

      In particular, copy the function mp_list_products() out of template-functions.php into your gridmarket functions.php

      Depending on the answer to the first quote, can i copy mp_list_product() into my functions.php file which is currently activated.

      Thanks.

      Edit: After looking i think we're both being confused as i think i have already done all this. Im just looking for the CSS to play with how it all looks.

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.