You are here:  » Listed - Featured Products [pto featured="section"]


Listed - Featured Products [pto featured="section"]

Submitted by Mark Hennessy on Thu, 2013-05-30 11:26 in

Hi David,

I am trying populate some tabbed tables on my front page. I placed the PTO shortcode [pto featured="section"] in each tabbed section and am looking for a more "listed" approach. I currently have them listed in rows of three. Is it possible to get just product image, product name, from price, such as below. Quite compact

[tabs]
[tab title="Top Items"]
- Product Image %Product Name% from %price% compare prices
- Product Image %Product Name% from %price% compare prices
- Product Image %Product Name% from %price% compare prices
[/tab]
[/tabs]

Submitted by support on Thu, 2013-05-30 11:47

Hi Mark,

Minimal templates to do this could be as follows:

Featured Products / Before

<div class='pto_featured'>

Featured Products / Each

<div>
%PRODUCT_NAME%
%IF_IMAGE%
<img src='%IMAGE_URL%' />
%ENDIF_IMAGE%
from %PRICE%
<a href='%PRODUCT_URL%'>Compare Prices</a>
</div>

Featured Products / After

</div>

If you then edit resources/pto.css and replace the .featured img style with something like:

.pto_featured img {
  width: 100px;
  vertical-align: middle;
}

...that should align it vertically in the div alongside the product name, price and compare prices link...

Cheers,
David.
--
PriceTapestry.com