Opencart 2.x Modullerde Roll Over Modifikasyon Dersimiz

By_Surmeneli

OpenCart-TR
Katılım
19 Tem 2010
Mesajlar
273
Tepkime puanı
0
Puanları
0
Yaş
37
Konum
Trabzon
Web sitesi
www.kodcenneti.com
Herkese merhaba bugün sizlere js kullanmadan modullerdeki ürün resimlerine rollover modifikasyonunu anlatacağım. Bu modifikasyonun amacı ürün resmi üzerine mouse ile gelindiğinde o resme ait veritabanındaki kayıtlı i>ikinci resim gösterilmesini sağlamaktır. Misal müşteri bir giyim sitesine geldi kazak resmin üzerine mouse ile geldiğin o resme ait kazağın farklı açıdan çekilmiş resmini göstere bilirsiniz. Dersimize başlıyoruz.

Dosyazmızı açalım
: catalog/controller/module
featured.php

bulalım :


if (($this->config->get('config_customer_price') && $this->customer->isLogged()) || !$this->config->get('config_customer_price')) {

Bir üstsatırına ekleyelim :

$images = $this->model_catalog_product->getProductImages($product_info['product_id']);

if(isset($images[0]['image']) && !empty($images[0]['image'])){
$images =$images[0]['image'];
}

Aynı Dosyada Bulalım :

'thumb' => $image,

Bi alt satırına Ekleyelim :
'thumb_swap' => $this->model_tool_image->resize($images, $this->config->get('config_image_product_width'), $this->config->get('config_image_product_height')),

Dosyamızı açalım : catalog/view/theme/seninteman/template/module/

featured.tpl

Bulalım :


<div class="image"><a href="<?php echo $product['href']; ?>"><img src="<?php echo $product['thumb']; ?>" alt="<?php echo $product['name']; ?>" title="<?php echo $product['name']; ?>" class="img-responsive" /></a></div>

Değiştirelim :

<?php if ($product['thumb_swap']) { ?>
<div class="image"><a href="<?php echo $product['href']; ?>"><img onmouseout="this.src='<?php echo $product['thumb']; ?>'" onmousemove="this.src='<?php echo $product['thumb_swap']; ?>'" src="<?php echo $product['thumb']; ?>" alt="<?php echo $product['name']; ?>" title="<?php echo $product['name']; ?>" class="img-responsive" /></a></div>
<?php } else {?>
<div class="image"><a href="<?php echo $product['href']; ?>"><img src="<?php echo $product['thumb']; ?>" alt="<?php echo $product['name']; ?>" title="<?php echo $product['name']; ?>" class="img-responsive" /></a></div>
<?php } ?>


İşlemimiz Bu kadardır.

[video=dailymotion] https://www.dailymotion.com/video/x4pmlax[/video]​

Kaynak : e-ticaretdersleri
 
Üst