bestsellers css

[pinbrook]

Can someone help me from myself?

I want to add "Mini Bestseller Layout" to my product pages.

I think I should add the code to "Product list with horizontal dividers"

but just where do I add the code and for that matter what css should I use to position it?

I've attached an image to show what I want to acheive.

the best sellers need to hang from the right (the black margin to the right is 50 px wide)

Ignore the rubbish layout to the left and top thats the current preview bug doing its best, live test site is at test.pinbrook.net

[wjcampbe]

Need that image Jo - what you want is not too clear from the description.

[pinbrook]

woops, I browsed it, but forgot to upload.... its in the OP

[wjcampbe]

Jo,

I amended the best seller list layout as shown with the results shown in the second image - is this what you are aiming for?

[pinbrook]

Ah now thats an improvement, the positioning is correct ie to the right and not interfereing with the product layout, but the mini bestseller layout has image, price, and more info links. (it has description aswell but i've commented that out

[pinbrook]

I still haven't fixed this.

My site is almost ready now, but I still need to add bestsellers down the right hand side of the product pages, I want the layout that gives me a small image, product name and link to product

Product page from test site http://test.pinbrook.net/acatalog/salmon-pate.html

additionally it would be quite nice to put the "New products" layout, like the one on the root index page on the other brochure pages, (this would fix my issue of short pages) How do I add this to my brochure fragments?

[RuralWeb]

I see we are working for competitors jo! www.the-old-smokehouse.co.uk

[wjcampbe]

Jo - following on from where I left it, Design tab, design tree - selected and expanded Section page with section name at top, selected and expanded Sidebar Best Sellers List, selected standard best seller item.

Changed code to

<actinic:variable name="ListIndex" />. <a href="<actinic:variable name="SearchCGIURL" />?PRODREF=<actinic:variable name="ProductReference" />&amp;NOLOGIN=1<actinic:block if="%3cactinic%3avariable%20name%3d%22IsHostMode%22%20%2f%3e">&amp;SHOP=<actinic:variable name="ShopID" /></actinic:block>"><Actinic:Variable Name="ProductName"/></a>
<actinic:block if="%3cactinic%3avariable%20name%3d%22PageType%22%20%2f%3e%20%3d%3d%20%22Section%22" >
	<br/><actinic:variable name="ProductImageLayout" />
</actinic:block> 
<actinic:block if="%3cactinic%3avariable%20name%3d%22IsProductReferenceVisible%22%20%2f%3e" >
  (Ref: <actinic:variable name="ProductReference" />)
</actinic:block>
	<actinic:block if="%3cactinic%3avariable%20name%3d%22PageType%22%20%2f%3e%20%3d%3d%20%22Section%22">
	<br/><actinic:variable name="PriceListRetail" />
	</actinic:block>

[edit] Did not know the forum would screw the code up so badly - that's select both image and price variables - one at a time, and Insert Block, select variable PageType, add condition == "Section" AND add a <br/> [/edit]
producing the attached.

[pinbrook]

Sorry Bill I just don't get it!

Here is my design tree

[wjcampbe]

Jo,

If you apply the changes from post #4 first [wrap those in Blocks with the same condition, so that they don't affect the home page left column layout], and then add the changes from post #8, the combined effect should give you what you want for the Best Sellers.

I missed the New Products question - will have a look at that in the next quiet moment.

[pinbrook]

Cracked it - I created a new site, looked at the underlying code from the executive theme, where the bestsellers are in the left hand nav -

layout required is - Sidebar Best Sellers List With Horizontal Dividers

used a Div to position it in the outer layout.

Just need to meddle with the layout but the principal is there

[wjcampbe]

While you were doing that, I did it this way...

Add mini best sellers layout as a right hand column to product pages

1. In the Design Library, Layouts tab, expand the Best Seller List node, right click the Home Page Best Sellers List and choose New Layout. Provide a name for that layout - I used Right Side Best Sellers Mini.

2. Switch to the variables tag and expand Best Sellers List. Double click BestSellerListLocations then place a tick in Basic Definition tab - Place of Setting box - Section checkbox. OK and Close.

3. On the Design tab, select Content Tree view on the lower right and highlight a product or section page. Switch to the Design Tree.

4. Click the top node in the design tree (should be the layout name) and then look at the layout code. Find the INNERLAYOUT and continue till you reach the closing </table> tag.

5. Go back up to the last </td> tag, and add in a <td></td> pair immediately after the existing tag.

6. Ensure the cursor is between the two new tags, and click Insert Layout. Select Sidebar.

7. Apply, then double click the Sidebar layout you just inserted.

8. Insert Layout, select Best Seller List. Apply, then right click the Best Seller List Layout and choose Edit Selector.

9. Bottom left, click on the Initial Value line and select Right Side Bar Mini. Click on Top Level value and make the same selection. OK to close.

10. Back in the design tree - expand Sidebar, expand Right Side Best Seller Layout, click on Mini Best Seller Layout.

11. Return to the code layout window and comment out the ProductDescription variable with <!-- --> to compact the layout.

12. If you have not already done so, go to Marketing, Best Sellers and create your list.

Now you have a mini best seller on the right hand side of every page that uses the same base layout. You need to wrap the whole sidebar in a block if condition to control when it is visible.

Adding a New Products Mini display could be approached in the same way.

[pinbrook]

I shall try that Bill, as my method means I have to remove the bestsellers from brochures pages, checkout, search pages etc etc. since i added themto the outer layer

Ta!

[pinbrook]

I get to this bit point 4

Find the INNERLAYOUT and continue till you reach the closing </table> tag.

my <body> looks like this

<body>
<div id="texasmain-title"><img src="rannoch-smokery-logo.jpg" alt="rannoch smokery"></div>
<div id="texashoriz-nav"><Actinic:Variable Name="NavigationBar" Value="Horizontal Nav Bar Text Links"/></div>
<div id="texasmain-text"><Actinic:Variable Name="INNERLAYOUT"/></div>
<div id="texasleft-menu"> <Actinic:Variable Name="TopLevelSectionList" Value="Top Level Section List With Horizontal Dividers"/><br><br><br>
<actinic:variable name="BrochurePageList" value="Brochure Page List With Horizontal Dividers" /></div>
<div id="texasfooter"><a href="http://www.pinbrook.net"> // actinic template from pinbrook.net // </a></div>
</body>

[pinbrook]

I have now made a 2nd overall layout without the bestseller div and applied it to checkpot, login.PSP bouncepage,receipt page, viewcart page, brochure page - in site options|layout. But where is the setting for searchpage, contact page, terms etc?

Having said that it would be nice to see both methods work, I was learning a few things....