Jump to content

Recommended Posts

This was the case with BootStrap3. It can be changed with Bootstrap4, I have no mobile to check but I just ask you to believe.

Get the latest Responsive osCommerce CE (community edition) here .

(Live   : OsC 2.2, php 5.4 & UTF-8  |  Local : Phoenix for future shop)

Share this post

Link to post
Share on other sites
On 10/30/2019 at 8:46 PM, Kurre said:

I need it to do it automatically for every product..

I made some changes to the file tpl_cm_i_card_products.php:


    while ($card_products = tep_db_fetch_array($card_products_query)) {
      <div class="card mb-2 is-product" data-is-special="<?php echo (int)$card_products['is_special']; ?>" data-product-price="<?php echo $currencies->display_raw($card_products['final_price'], tep_get_tax_rate($card_products['products_tax_class_id'])); ?>" data-product-manufacturer="<?php echo max(0, (int)$card_products['manufacturers_id']); ?>">

    $img1 = 'images/' . $card_products['products_image'];

        // Get one more product image from DB
        $pic_query = tep_db_query("select image from products_images where products_id = '" . (int)$card_products['products_id'] . "'");
    if (tep_db_num_rows($pic_query) > 0) {
        $pic = tep_db_fetch_array($pic_query);
        $img2 = 'images/' . $pic['image'];
        $img_string = '<img src="' . $img1 . '" onmouseover="this.src=\'' . $img2 . '\'" onmouseout="this.src=\'' . $img1 . '\'" width="'. SMALL_IMAGE_WIDTH . '" height="' . SMALL_IMAGE_HEIGHT . '" alternative="' . htmlspecialchars($card_products['products_name']) . '" class="card-img-top">';
    <!-- flip flop the two images -->
        <a href="<?php echo tep_href_link('product_info.php', 'products_id=' . (int)$card_products['products_id']); ?>"><?php echo $img_string; ?></a>

    } else {
    <!-- display single image -->
        <a href="<?php echo tep_href_link('product_info.php', 'products_id=' . (int)$card_products['products_id']); ?>"><?php echo tep_image('images/' . $card_products['products_image'], htmlspecialchars($card_products['products_name']), SMALL_IMAGE_WIDTH, SMALL_IMAGE_HEIGHT, '', true, 'card-img-top'); ?></a>


        <div class="card-body">   

This flip-flops the two images for every product when the user mouseover and mouseout over the images. Tested on Phoenix

Share this post

Link to post
Share on other sites

@kgtee Well done of you ! I wish it was a Phoenix shop this one, I use CE bootstrap version.

It is to much work to move to Phoenix with Swedish languages and stuff right now for me.

But thanks for your effort!

Share this post

Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now