eStore – Need help with layout/structure

[HafnerDesigns]

Hi,

I was wondering if it is possible to make a different layout than just one product per line? I have a website where the owner requires a grid style layout. She wants the image above the description of the product. At this point, it looks like she wants the price above the image.

I’d appreciate any direction you can offer.

Thank you,

Heidi Hafner

[Ivy]

You can design your pages to look however you want and just use the shortcode to place the button where you need it.

You can find all the shortcodes here:

http://www.tipsandtricks-hq.com/ecommerce/wp-estore-shortcodes-and-functions-reference-460

We do have a few grid styles pre-made (Fancy Displays. You can see these here (Displays 3,5 and 6):

http://www.tipsandtricks-hq.com/ecommerce/stylish-product-display-options-for-wp-estore-829

This maybe a good post to read too:

https://support.tipsandtricks-hq.com/forums/topic/can-i-put-multiple-images-and-videos-in-the-fancy-display

[kimtown]

Ivy, another question for the fancy 3 layout…I would like to remove the name, price and add to cart button under the image and simply have the image link to the product page. What’s the best way to do this? ( I could be over-thinking it. )

Here is the code I am using:

[wp_eStore_category_products_fancy id=1 style=3]

Thanks,

Kim

[admin]

Hi Kim, you could link your thumbnail image to the product page by configuring the “Thumbnail Target URL” field of the eStore product in question.

However, removing lots of elements from a fancy display template will require some custom coding tweak. This post has more explanation on this:

https://support.tipsandtricks-hq.com/forums/topic/can-i-put-multiple-images-and-videos-in-the-fancy-display

[kimtown]

Thanks for the response, however I may not be explaining this well.

For example: On the page called “templates” there should be a grid of thumbnails from that category (that link to their respective product pages). Right now I CAN do that with Fancy style 3, but I don’t want the variations and price to show under the thumbnail image.

Thanks again for your help!

Kim

[kimtown]

I found the information in the footer of the Fancy 3 style, but when I give that area a display:none in the extra shortcodes css code, it gets rid of it on the individual product page also (which I don’t want).

So what I’m asking is how/where can I remove the code JUST for the variations and price on the category page? I would link you to the site but it’s in maintenance mode.

Thanks!!

[Peter]

Kim,

There’s a simple trick you can do which will solve your problem.

Using the wordpress editor, open the page where you are inserting the shortcode for the fancy 3 displays and click on the “text” tab.

Then wrap the shortcode in your own special div which will have its own id as follows:

<div id="kims_special_div">

[wp_eStore_category_products_fancy id=1 style=3]

</div>

Then in the wp_eStore_custom_style.css file add the css code to hide the various parts you want to get rid of. Below is an example which will hide the price tag:

#kims_special_div .eStore-fancy3-price-tag {

display: none;

}

Using the above method you will only target the products displayed within your own div.

[Author]

Posts