[SOLVED] Creating "Clearance" option and section/category.

[mytheory.]

Greetings,

As the title states I need help adding a "Clearance" option when adding a product in the BO. To elaborate, I want to add another option/checkbox/radio to "display 'clearance' icon (or another other icon for that matter) on product page and text on product listing." I want to duplicate the "on sale" icon option for reductions, but if I choose the "clearance" option it would display a different icon and text. I can manage modifying the texts and the icon image since I've looked at the code, but I just don't feel comfortable messing around with any database related coding to duplicate this sort of option.

Also, I want to create a section for the "clearance" items... however, whenever I put a reduction on an item it gets indexed with the specials (specials block and prices-drop.php page). Is there anyway to link this option (assuming it works) so where if I select the clearance option it doesn't display with the other sale/special items? That way I can just move all the clearance items to their own category without them showing up under the specials page.

Tremendous Thanks.

[mytheory.]

So I might have some good news...

So I found sometime today to setup a test site and mess around with the database and PS files. I haven't tried it on my forreals shop since I would like to get some input from some professional programmers before fully implementing it. But on my test shop just with the basic pre-loaded products PS comes with everything seems to work without a hitch.

So first I added another field/column into the ps_product table of the database. For this purpose the name of my database is "test."

1) START>RUN>CMD
2) mysql -u username -p
3) Enter Password.
4) SHOW databases;
5) USE test;
6) SHOW tables;
**please note that steps 4 and 6 probably aren't necessary, these were steps to verify that the database and tables exist.
7) ALTER TABLE ps_product ADD clearance INT NOT NULL DEFAULT 0 AFTER on_sale;

-----Prestashop Files-----

Then I went into admin/tabs/AdminProducts.php and added to line 76

$object->clearance = (!isset($_POST['clearance']) ? false : true);

and on line 1692 add

<input type="checkbox" name="clearance" id="clearance" style="padding-top: 5px;" '.($this->getFieldValue($obj, 'clearance') ? 'checked="checked"' : '').'value="1" /> '.$this->l('Display "clearance" icon on product page and text on product listing').'

Then in themes/prestashop/product.tpl after line 204 I added: (this is where you would change the icon and text... for this example I left the On Sale icon/image, but it can be changed after img src=)

{elseif $product->clearance}

{l s='Clearance!'}

Then in themes/prestashop/product-list.tpl after line 14 add:

{elseif $product.clearance}
{l s='Clearance!'}

And finally in classes/Product.php

and after line 84 add:

public $clearance = false;

and after line 173 add:

'clearance' => 'isBool',

and after line 233 add:

$fields['clearance'] = intval($this->clearance);

Everything seems to be working fine, but I am not a programmer and would really appreciate it if some more experience programmers could take a look at my attempt.

One thing I think could be improved is the "on_sale" or "clearance" options in the BO... maybe implementing a radio button where only one option can be chosen might be better. However, from some brief testing when both options are checked the "On Sale" icon and texts are displayed (no errors) due to the if/elseif statement, I believe. Leaving this as is shouldn't cause any problems, right?

Also, to exclude these "clearance" marked products from the specials block and page I modified classes/Product.php

For the Specials Block to line 1053 I added:

AND p.`clearance` = 0

and for the Specials Page (yoursite.com/prices-drop.php) to line 1124 I added:

AND p.`clearance` = 0

This change seems to be working fine, but just to make sure... is there any additional lines that need to be edited to ensure "clearance" items are excluded from the specials block and page?

Thanks!

[Damainman]

Have you tried using this on your live website yet? Also thanks for taking the time to post such a detailed description on what you did!!! Awesome!

[mytheory.]

Thanks!

I have implemented it on my live shop (with thousands of products), but honestly I haven't really used the feature as we are still building our site. We currently are concentrating mostly on the "featured" products rather than "clearance" or "sales" items. We do plan to use this feature quite intensively after we have a base of products setup, and then we'll go back and figure out what items are outdated and should be sold off as a "clearance" items.

However, I have done testing on my test shop and I haven't had any problems. I've looked through the code multiple times (although I'm not an avid programmer) I haven't found any reason for the code to cause any problems. It's been a little while, but if I remember correctly I believe I tested it on IE and chrome as well (I always use Firefox so it forsure works on FF).

Best!

[manciuria]

Hi Guys, I'd like to implement this feature on my Prestashop 1.3.1 but firts, I would like to know if you had any issue with the customization.

Please let me know and many thanks!

[mytheory.]

Hi,

What do you mean by customization? Are you talking about product customization and/or attribute combinations?

I haven't tried this modification on PS 1.3.1 yet... I recently built another site with this new version; however, I haven't had the time to implement this feature on that site. So although I don't see any reason why this shouldn't work, I can't guarantee anything yet. At worst, you can always follow the steps again to remove those lines of code to return it back to its original state... I had to do this multiple times while coming up with this solution.

I've been using this and haven't had any problems... the only known issue is that if you check both the default "on sale" and "clearance" options, the on_sale will override the "clearance" option. This is because they use an if else statement... I suppose if you needed both options you could turn them into if statements and them modify the css to fit both images.

The only other modification I've made was to the CSS, I changed out some of the images and moved them around so they fit well in the product-list and product pages.

HTH!

[DARKF3D3]

Hey mytheory, thank for these modify... i have a question: could you put an explanation of every step? i need to know what do every modify.


Thanks a lot

[mytheory.]

Hi,

The steps above (2nd post from the top) explains everything in detail including the DB queries I ran. Obviously, this for my "Clearance" modification, but if you want to modify it for different needs, could you be a little bit more specific on what areas you need further details?

I may or may not be able to help... but if you can be a little bit more specific I can always look into it for you. Please keep in mind I'm not a experienced programmer so my help may be limited for other variations of this mod.

Also, I used this on v1.2.5 and have not tested it on any other version... we will upgrade to 1.4 soon and I plan on implementing this on the new version in due time. I will update this post with any changes or comments once we have upgraded.

SO, if your using a different version, I recommend you look through the other lines of code to make sure all those lines exists in the files of the new versions. I highly recommend you overlook the entire procedure BEFORE making any changes to the DATABASE!

HTH!

[DARKF3D3]

I need to add to the products table a new BOOLEAN field.

$object->clearance = (!isset($_POST['clearance']) ? false : true);

What is this code for?

[mytheory.]

Hi,

I'm not fully sure... I did a lot of copying of the "on_sale" icon code.

From the looks of it and my very basic php skills, it looks like it's making sure the variable/object for clearance has been set. I think it is verifying that a value for clearance has been set/exists... maybe to catch errors.

Not 100% sure... hopefully somebody with much more php knowledge can throw in their explanation for us both.

[DARKF3D3]

Hey, i have successfully installed your mod on prestashop 1.3.1, but now i need to made a thing little different.

I'm trying to show and image (on-sale for example) on to the product image, do you know i can i do that? (look at the image)

To do that i change the code in product.tpl

From:

{if $have_image}
getImageLink($product->link_rewrite, $cover.id_image, 'large')}" {if $jqZoomEnabled}class="jqzoom" alt="{$link->getImageLink($product->link_rewrite, $cover.id_image, 'thickbox')}"{else} title="{$product->name|escape:'htmlall':'UTF-8'}" alt="{$product->name|escape:'htmlall':'UTF-8'}" {/if} id="bigpic"/>
   {/if}

To:

{if $have_image}
getImageLink($product->link_rewrite, $cover.id_image, 'large')}" {if $jqZoomEnabled}class="jqzoom" alt="{$link->getImageLink($product->link_rewrite, $cover.id_image, 'thickbox')}"{else} title="{$product->name|escape:'htmlall':'UTF-8'}" alt="{$product->name|escape:'htmlall':'UTF-8'}" {/if} id="bigpic"/>
       {if $product->esclusiva}

   {/if}

To notice that i have used "esclusiva" word instead of clearance.

[mytheory.]

Hi,

So it looks like the code works... you just need to adjust the position. The best way is to probably edit your CSS file (global.css). Unfortunately, I'm a total noob when it comes to adding new blocks into CSS. I can modify existing code and what not.

So if you know CSS great! If not, here is what I would do... use either the Firefox or Chrome Browser. For FF download an add-on called FIREBUG. Chrome already has a debugging tool included by default. I use FF more so I will concentrate more on FF and Firebug.

Once you've downloaded firebug (lots of tutorials online)... there is a little icon of a bug that should appear at the bottom right corner of the status bar. Click it. This will split the existing window with a new window at the bottom of the browser. Now you should see a few icons lining the top of this new window. I believe the 2nd one from the left is the one you want to click... it way say "Inspect element..." or something like that. After selecting this icon hover and click the on_sale image. There is another window to the right that will show you the corresponding CSS block of code. Now all you have to do is find that line in your css file and modify it. Sometimes these blocks of code could affect other images or layouts... so be careful to make sure that nothing is disturbed. If so, you may need to study CSS and find out how to add code to CSS and your tpl file.

Using CSS is the probably the best method, but since my CSS knowledge is limited this is what I did for my Clearance icon for the product-list pages.

I created a div class and directly assigned style values to this image... this method will only affect the lines of code within the div tags and cannot be reused for other layouts. So if you need to use the same modification for a lot of code/layouts you best bet is CSS but if you are ok with a quick and dirty fix for a single block of code this has worked great for us.

HTH!