Prestashop 1.4

Just upgraded and one important difference from earlier versions is that no(?) changes will take effect unless you first go to Preferences/Performance and change Force Compile to Yes and Cache to No.
After the code change and a verification of it being OK, don't forget to restore the settings or you will have a very slow site.

Prestashop as Bookstore Part 4 - Details in product lists

I have done several modifications to make PrestaShop usable as a bookstore and I will try to sum it up in a few blog posts.

(I don't really have time for this, but a new post is overdue ++)

To put tags in the product list:
In classes/product.php, find eg

$row['features'] = Product::getFrontFeaturesStatic((int)$id_lang, $row['id_product']);

and add the line

$row['tags'] = Tag::getProductTags($row['id_product']);

In eg themes/yourtheme/product-list.tpl, find the line

title="{$product.description_short|truncate:360:'...'|strip_tags:'UTF-8'|escape:'htmlall':'UTF-8'}">{$product.description_short|truncate:360:'...'|strip_tags:'UTF-8'}</a></p>

and add

{if $product.location}
{if $product.tags}
{if $lang_iso == sv} {assign var='lng' value=4}{else} {assign var='lng' value=1} {/if}
{assign var='tag1' value=$product.tags[$lng]}
<p>
{assign var='delimiter' value=''}
{l s='Authors'}:
{foreach from=$tag1 item=tag}{$delimiter} {$tag|escape:'htmlall':'UTF-8'}{assign var='delimiter' value=','}{/foreach}
</p>

To put features at the same place
In eg themes/yourtheme/product-list.tpl, at the same place as for the tags, add

{if $product.features}
<p>
{assign var='go' value='0'}
{foreach from=$product.features item=feature}
{foreach from=$feature item=rank}
{if $go}Rank: {$rank}<br />{/if}
{if $rank == '40.Suggested rank'}{assign var='go' value='1'}
{else} {assign var='go' value='0'}
{/if}
{/foreach}
{/foreach}
</p>
{/if}

Short explanation of the code:
I use tags for authors and location to pin a item as a book, other parts of the logic may or may not be of use for you, the delimeter jazz is so that one tag appears as "foo" and tho tags as "foo, bar", ie comma separated.
The features array looks like this
Length, 10 cm, height, 2 cm, weight, 2 kg...
So I search for "Suggested rank" and print the following value. I only use one feature, but there is nothing stopping you from using more.

Edit: Forgot to add a picture of how it looks

Vacation

Off to China for a little less than a month, so plolly no blogging fol a while

Popups

In the picture in my last post there is one thing that may need extra explanation:
The texts "About the rank suggestion" and "About the book sizes" underneath the Data Sheet Tab.
They are links to pop-up windows, like this


















This is accomplished in a pretty crude way IMHO, in [themes folder]/css/global.css I added
/* pop up */
#layer1 {
position: relative;
visibility: hidden;
width: 250px;
height: 110px;
left: 0px;
top: 0px;
background-color: #fff;
border: 1px solid #000;
padding: 10px;
}
#layer2 {
position: relative;
visibility: hidden;
width: 250px;
height: 110px;
left: 0px;
top: 0px;
background-color: #fff;
border: 1px solid #000;
padding: 10px;
}
#close {
float: right;
}
/* /pop up */
then in [themes folder]/product.tpl beneath the code to display the features
<table border="0">
<tr>
<p>
<th style="text-align: left">
<a href="javascript:setVisible('layer1',true)">{l s='About the rank suggestion'}</a>
</th></p>
<th style="text-align: left">
<a href="javascript:setVisible('layer2',true)">{l s='About the book sizes'}</a>
</th>
</tr>
<tr>
<td>
<div id="layer1">
<span id="close"><a href="javascript:setVisible('layer1')" style="text-decoration: none"><strong>{l s='Hide'}</strong></a></span>
<p><br />{l s='Rank suggestions are taken from various websites and are sometimes also based on my personal ideas.'}<br />
{l s='If you have different opinions about what rank the reader should be when reading the book, please contact me!'}
<br /></p>
</div>
</td>
<td>
<div id="layer2">
<span id="close"><a href="javascript:setVisible('layer2')" style="text-decoration: none"><strong>{l s='Hide'}</strong></a></span>
<p><br />{l s='The book sizes are approximate.'}<br />
{l s='L = close to A4, about 26-28 cm high'}</br>
{l s='M = close to A5, about 19-22 cm high'}</br>
{l s='S = In-between A5 and A6, about 17-18 cm high'}</br>
{l s='XS = close to A6, about 14 cm high'}
<br /></p>
</div>
</td>
</tr>
</table>
and in [themes folder]/header.tpl
<script type="text/javascript" src="{$content_dir}/../../pop-up/popupDiv.js"></script>
And finaly in the folder directed to in header.tpl I created the file popupDic.js with the following content
/* -----------------------------------------------
Floating layer - v.1
(c) 2006 www.haan.net
contact: jeroen@haan.net
You may use this script but please leave the credits on top intact.
Please inform us of any improvements made.
When usefull we will add your credits.
------------------------------------------------ */
x = 20;
y = 70;
function setVisible(obj)
{
obj = document.getElementById(obj);
obj.style.visibility = (obj.style.visibility == 'visible') ? 'hidden' : 'visible';
}
function placeIt(obj)
{
obj = document.getElementById(obj);
if (document.documentElement)
{
theLeft = document.documentElement.scrollLeft;
theTop = document.documentElement.scrollTop;
}
else if (document.body)
{
theLeft = document.body.scrollLeft;
theTop = document.body.scrollTop;
}
theLeft += x;
theTop += y;
obj.style.left = theLeft + 'px' ;
obj.style.top = theTop + 'px' ;
setTimeout("placeIt('layer1')",500);
}
window.onscroll = setTimeout("placeIt('layer1')",500);

This solution was taken from http://javascript.internet.com/miscellaneous/popup-div.html

A Book on PrestaShop

Today I recieved a new Book about how to configure and use the PrestaShop Package.

It is in .pdf format and I will try to go through it next week when I fly to China; depending on how much of a sleeping pill it is and on several other things like Internet availability in China, a revew of some sort is to be published here soon afterwards.
I may not be able to reach this Blog for a month or so, so even if I finish reading the book immediatly, the review may be a little late. Please be patient.

Prestashop as Bookstore Part 3 - Tabs

I have done several modifications to make PrestaShop usable as a bookstore and I will try to sum it up in a few blog posts.

In PrestaShop, when you view a product (click on the product from e.g. the Product List, Start Page etc) you get a view like this.





















I made some changes to the text block to the right of the picture, but recently I decided to put that extra information in a tab, so now it looks like this




















There is some extra information in the "Data Sheet" tab and a new tab called "Review"

First: To change the content of a tab, edit themes folder/product.tpl and find the line
<!-- description and features -->
Thereafter, you will find two blocks of code, the first produce the tabs and the second the tab's content.
So, basically, just add whatever you want in the correct place. E.g. to add "Facts about the product" to the Data Sheet tab first find the ID for that tab:

<li><a id="more_info_tab_data_sheet" href="#idTab2">{l s='Data sheet'}</a></li>

So the ID is idTab2, find the block for idTab2 which will look something like this:

{if $features}
<ul id="idTab2" class="bullet">
<div id="short_description_block">
{if $features}
{foreach from=$features item=feature}
<li><span>{$feature.name|escape:'htmlall':'UTF-8'}:</span> {$feature.value|escape:'htmlall':'UTF-8'}</li>
{/foreach}
{/if}
</div>
</ul>
{/if}

Change it to

{if $features}
{l s='Facts about the product'}
<ul id="idTab2" class="bullet">
<div id="short_description_block">
{if $features}
{foreach from=$features item=feature}
<li><span>{$feature.name|escape:'htmlall':'UTF-8'}:</span> {$feature.value|escape:'htmlall':'UTF-8'}</li>
{/foreach}
{/if}
</div>
</ul>
{/if}

You can use html tags to make it e.g. bold and the {l s=xxx} makes it translatable from the BO.

To add a new tab, Reviews, I added the line

{if $product->location}<li><a id="review" href="#idTab100">{l s='Reviews'}</a></li>{/if}

Right before {$HOOK_PRODUCT_TAB} to make it display last (before Comments, whose code comes even further down). Note that it is the order of these lines of code that determines where the tab goes, not the name of the ID tag.

Then, somewhere below {$HOOK_PRODUCT_TAB}, within the div add

{if $product->location}
<div id="idTab100" class="rte">
...
</div>
{/if}

where ... symbolize what you want to be shown in the tab.
I use the location field to mark the item as a book, and so the if statement makes the tab only show for books, you may use something else there, whatever fits your needs.

Prestashop as Bookstore Part 2 - Book Series & Publishers

I have done several modifications to make PrestaShop usable as a bookstore and I will try to sum it up in a few blog posts.

Today I'll talk a little about more information I like to have in my Bookstore, eg the Publishers of the books.

I understand if my needs are not the same as most Bookstores have, but these modifications were very valuable for my needs.
First of all, listing the Publishers, to be able to find all books from a certain Publisher is almost a must for me.
And also, lots of my books are part of a series of books, so listing all books in a series is a really good thing for me.

First off I translated Manufacturers and Distributors to Publisher and Book Series.

I then used the Location field for the ISBN number and by leaving this field empty for other items I can determine if a item is a book or not (for books without ISBN I just put "none" in the field.

I put the info in the same block as the Authors, like this
(continued from last post's chunk of code, in themes/product.tpl)

{if $product->manufacturer_name}
<div id="short_description_content" class="rte align_justify">
{if $product->location}
{l s='Publisher'}:
<a href="{$link->getmanufacturerLink($product->id_manufacturer, $product->link_rewrite)|escape:'htmlall':'UTF-8'}" title="{l s='List books from'} {$product->manufacturer_name|escape:'htmlall':'UTF-8'}">{$product->manufacturer_name|escape:'htmlall':'UTF-8'}</a>
{else}
{l s='Manufacturer'}:
<a href="{$link->getmanufacturerLink($product->id_manufacturer, $product->link_rewrite)|escape:'htmlall':'UTF-8'}" title="{l s='List items made by'} {$product->manufacturer_name|escape:'htmlall':'UTF-8'}">{$product->manufacturer_name|escape:'htmlall':'UTF-8'}</a>
{/if}
</div>
{/if}

As you may see in the code above, I later realized that I could use Manufacturers for their "real" use when not dealing with books.

{if $product->supplier_name}
<div id="short_description_content" class="rte align_justify">
{l s='Supplier'}:
<a href="{$link->getsupplierLink($product->id_supplier, $product->link_rewrite)|escape:'htmlall':'UTF-8'}" title="{l s='List books in the series'} {$product->supplier_name|escape:'htmlall':'UTF-8'}">
{$product->supplier_name|escape:'htmlall':'UTF-8'}</a>
</div>
{/if}
{if $product->location != ''}
<div id="short_description_content" class="rte align_justify">
{l s='ISBN'}: {$product->location}
</div>
{/if}
{if $product->ean13 != ''}
<div id="short_description_content" class="rte align_justify">
{l s='EAN'}: {$product->ean13}
</div>
{/if}
</div>
</p>

And last in the block I put the ISBN and/or EAN, which tends to be the same thing for most books (but not always) so I just figured why not. More information than one needs is better than less information than one wants...

Then I modified the settings in the Manufacturers and Distributors Blocks in the Admin part of Prestashop to not use plain text but a drop-down list.

I also did some more translations so it says "Select Series" etc.



In the future I'd like to split up the Distributors Block in two so that one is for Publishers and one for Manufacturors, but right now they are mixed together.

This is how the product view looks for a book after the modifications.









and this is how it looks for a non-book.