Development suggestion: tag img above product (Low Cost, Promo, New, Stock off)

[lipes]

1 - it's possible to add an image tag over the product image with a special tag mode...
for example ...
if the product is new.... we could got a "new image" tag over that roduct image...
if the product is in "off stock" or "outlet" .... we have another image for this options.
If the product is on "special offer" or "promotion" ... another image with that tag....
and so on .....

Or in another way we could have this options like the availability images for each product .. in the product description lines .. ?! would only duplicate the code in administration zone... to do something like this, right?!


2) In the image above you could see that I've made an circles around the price cents, it is possible to have a solution that changes the price cents, from 10.00€ to 10.₀₀€ or 10.⁰⁰€

Adding just the <sup> </ sup> or the <sub> </ sub> tag, or minimizing the CENTS with the CSS font-size....
Is there any possibility to add this in any particular file?

Examples of sites that have this feature in the prices
http://www.electrodepot.fr/
http://www.cobrason.com/


(old post here)
http://forum.virtuemart.net/index.php?topic=96322.msg316637#msg316637

[flo31]

Hey,

for the second feature, you can do this little hack :

in administrator/components/com_virtuemart/helpers/currencydisplay.php

at line around 309 you have :

Code Select Expand


$product_price[$name] = $this->priceDisplay($product_price[$name],0,false,$this->_priceConfig[$name][1]);

Just paste this code after the line

Code Select Expand


$temp = explode(",", $product_price[$name]);
$tmp = explode(" ", $temp[1]);
$afterComa = "<sup>".$tmp[1].$tmp[0]."</sup>";
$product_price[$name] = $temp[0].$afterComa;


and you will have the price like http://www.electrodepot.fr/

If you want the price like http://www.cobrason.com/

Paste this instead

Code Select Expand

$temp = explode(",", $product_price[$name]);
$tmp = explode(" ", $temp[1]);
$afterComa = '<span style="font-size:10px">'.$tmp[0]."</span><sup>".$tmp[1]."</sup>";
$product_price[$name] = $temp[0].",".$afterComa;

I hope this helps

[PRO]

I use this in the category page to display "Free Shipping on this Item" When the weight is set to 0
<?php if ($product->product_weight == 0) { ?>
                  <div class="redtext font10">Free Shipping on This Item </div>
               <?php    }?>

Here are some for the product page, but you can modify them by changing $this->   to $product->
http://forum.virtuemart.net/index.php?topic=92756.msg305223#msg305223



<?php  if ($product->product_special == 1){
$image_class='special';}?>



//wrap the image in a div and assign a class to it, and then add the overlay with css
<div class="<?php echo $image_class ?>">
<?php /** @todo make image popup */
                     echo $product->images[0]->displayMediaThumb('class="browseProductImage" border="0" title="'.$product->product_name.'" ',true,'class="modal"');
                  ?></div>


css
.special{background:URL to image;z-index:1000;THEN ADJUST THE POSITION}
.special browseProductImage{z-index:999}

[lipes]

flo31: Many Thanks!
BanquetTables.pro , thanks.. i will try to see what i could do with your code.

Another question related is.... It's possible to create a specific image, and something that detects the "cheapest" or "Low Cost" product price in each categorie ??

for example (in your site) for "Outdoor Furniture" (or in any another categorie) .. with this option activated will detect the lowest price and will add an "low cost" image over that product specific product...
If we add any new product that have lowest price .. this "compare" the price in that product categorie and automatic changes the "low cost img" to this new product ...

[PRO]

BanquetTables.pro , thanks.. i will try to see what i could do with your code.

Another question related is.... It's possible to create a specific image that detects the "cheapest" or "Low Cost" product price in each categorie ??

for example (in your site) for "Outdoor Furniture" (or in any another categorie) .. with this option activated will detect the lowest price and will add an "low cost" image over that product specific product...
If we add anya new product that have lowest price .. this "compare" the price in that product categorie and automatic changes the "low cost img" to this new product ...

an image cannot detect anything. A php function would have to be written to do it, and then manipulate the html output.

Possible yes, but I wont do it.

[lipes]

ehehe of course that an image doesnt detect anything .. i'm not well explained, sorry
it's a php function.. so its an ideia/suggestion to VM like in the title of this topic

[Cleanshooter]

1 - it's possible to add an image tag over the product image with a special tag mode...
for example ...
if the product is new.... we could got a "new image" tag over that roduct image...
if the product is in "off stock" or "outlet" .... we have another image for this options.
If the product is on "special offer" or "promotion" ... another image with that tag....
and so on .....
(old post here)
http://forum.virtuemart.net/index.php?topic=96322.msg316637#msg316637

The only way I have accomplished this is by going into the thumbnail image directory (stories/virtuemart/product/resized) and modifying the thumbnails directly.  I've added little "New" tags to all my new products by downloading the auto-generated thumbnails then using a Photoshop action to apply it to each image.

I do like the idea of adding a tag/class/id to a div or something in the top corner of all thumbs that you could assign special markers though. Maybe in the future we'll be able to add it with out directly changing the image.

[PRO]

Create an individual image class for EACH product

<div class="category_image img<?php echo $product->virtuemart_product_id ?>"
<?php /** @todo make image popup */
                     echo $product->images[0]->displayMediaThumb('class="browseProductImage" border="0" title="'.$product->product_name.'" ',true,'class="modal"');
                  ?></div>

This will create a class like this   imgPRODUCT_ID
So if a product id is 21. The class would be    img21

Then, you can do all the assigning you want, and NOT by featured etc.

You can do

img21, img35, img66{background:featured.png }

[simbus82]

1 - it's possible to add an image tag over the product image with a special tag mode...
for example ...
if the product is new.... we could got a "new image" tag over that roduct image...
if the product is in "off stock" or "outlet" .... we have another image for this options.
If the product is on "special offer" or "promotion" ... another image with that tag....
and so on .....
(old post here)
http://forum.virtuemart.net/index.php?topic=96322.msg316637#msg316637

The only way I have accomplished this is by going into the thumbnail image directory (stories/virtuemart/product/resized) and modifying the thumbnails directly.  I've added little "New" tags to all my new products by downloading the auto-generated thumbnails then using a Photoshop action to apply it to each image.

I do like the idea of adding a tag/class/id to a div or something in the top corner of all thumbs that you could assign special markers though. Maybe in the future we'll be able to add it with out directly changing the image.

Lot's of ecommerce has this function: for the first time i think we can simply add some checkbox in admin product edit page like "new" "promo" and "reccomemended" that are 3 for example.

Then in the file that steup the view of image we can add some "divs" for tag images, with an "if" that check if the product has some checkboxes enabled. If is enable the checkbox for new, the div is visibile and we see "new" in the thumbs in category view and in product detail.

I know to add graphically some checkboxes in admin and the divs in product detail o thumb but i don't know how to "store" the state of checkbox and then how to read them from the views in backend.

[lipes]

Simbus82 to do that its here explained (i think): http://forum.virtuemart.net/index.php?topic=94044.msg308760#msg308760
(i dont know if exist another way.. it will be good if we add in future that Option/funtion in the Product Back End .. )

UPDATE: simbus82: Did you find the solution ?
I think that with custom fields you can do that to. Try to see it here: http://forum.virtuemart.net/index.php?topic=99225.msg327903#msg327903

Can you give me an example ( internet website ) of what you want to do ?

I'll want to do in future something like this: http://www.cobrason.com/sony-kdl-26ex320-b.html

in the products they have this kind of images:
etc.. etc...

[PRO]

Simbus82 to do that its here explained (i think): http://forum.virtuemart.net/index.php?topic=94044.msg308760#msg308760
(i dont know if exist another way.. it will be good if we add in future that Option/funtion in the Product Back End .. )

UPDATE: simbus82: Did you find the solution ?
I think that with custom fields you can do that to. Try to see it here: http://forum.virtuemart.net/index.php?topic=99225.msg327903#msg327903

Can you give me an example ( internet website ) of what you want to do ?

I'll want to do in future something like this: http://www.cobrason.com/sony-kdl-26ex320-b.html

in the products they have this kind of images:
etc.. etc...

for HD etc.
http://forum.virtuemart.net/index.php?topic=99225.msg327877#msg327877

[Geppux]

I use this in the category page to display "Free Shipping on this Item" When the weight is set to 0
<?php if ($product->product_weight == 0) { ?>
                  <div class="redtext font10">Free Shipping on This Item </div>
               <?php    }?>

Here are some for the product page, but you can modify them by changing $this->   to $product->
http://forum.virtuemart.net/index.php?topic=92756.msg305223#msg305223



<?php  if ($product->product_special == 1){
$image_class='special';}?>



//wrap the image in a div and assign a class to it, and then add the overlay with css
<div class="<?php echo $image_class ?>">
<?php /** @todo make image popup */
                     echo $product->images[0]->displayMediaThumb('class="browseProductImage" border="0" title="'.$product->product_name.'" ',true,'class="modal"');
                  ?></div>


css
.special{background:URL to image;z-index:1000;THEN ADJUST THE POSITION}
.special browseProductImage{z-index:999}

Sorry PRO could you tell me where I have to insert the code? Or now there is any plugin that make this, seen that a loto of time is past from this last post? Thank you.

Giuseppe

[PRO]

http://forum.virtuemart.net/index.php?topic=90935.0
http://forum.virtuemart.net/index.php?topic=97744.0