ask - cara pasang script zoom u/gambar di halaman category

Hallo semua,

Saya senang dengan opencart.
Dan masih belajar.
Ada yg bisa bantu bagaimana cara pasang script zoom u/gambar di halaman category.
Biasanya saya lihat script zoom, tapi yg ada di halaman produk.
Saya harap ada yg bisa bantu untuk mengajarkan cara memamsang zoom script untuk gamabar di halaman kategori.

Sebelumnya saya ucapkan terimaksih untuk opencart'ers..yg baik hati.

Txh
^__*

Control U aja gan tema yang ada.

Control U?

di themeforest ada tema dengan zoom efek yang bagus. Nah, silahkan dibeli om klo g mo control u.
Ato bandingkan saja file product.tpl dg categori.tpl di folder catalog/view/theme/tema_kamu/template/product/
entar kan tahu code mana yang digunakan bikin zoom.

trimakasih jawabannya

Master2 yang lain bisa bantu enggak?
Masih blom bisa nih

agak susah bro, ato memang saya yang ga bisa.. pada product.tpl dan category.tpl menggunakan class yang berbeda..

silahkan dilihat pada product.tpl category.tpl untuk menghasilkan gambar zoom itu menggunakan cloud-zoom, pengaturannya bisa dilihat di /catalog/view/theme/TEMA_KAMU/stylesheet/cloud-zoom.css
silahkan agan coba oprek2, kalo udah berhasil kasih tau ane ye..

tulip_craft wrote:agak susah bro, ato memang saya yang ga bisa..

Code: Select all

<?php if ($thumb) { ?>

pada product.tpl dan category.tpl menggunakan class yang berbeda..

silahkan dilihat pada product.tpl

Code: Select all

<?php if ($thumb) { ?>
        <div class="image"><a href="<?php echo $popup; ?>" title="<?php echo $heading_title; ?>" class="cloud-zoom" id="zoom1" rel="adjustX: 5, adjustY:0, zoomWidth:530, zoomHeight:400, showTitle: false"> <img src="<?php echo $thumb; ?>" title="<?php echo $heading_title; ?>" alt="<?php echo $heading_title; ?>" id="image" width="400" height="400" /> </a> <span class="pricetag">

category.tpl

Code: Select all

<?php if ($product['thumb']) { ?>
        <a class="wrap_link" href="<?php echo $product['href']; ?>"><span class="image"><img src="<?php echo $product['thumb']; ?>" alt="<?php echo $product['name']; ?>" />

untuk menghasilkan gambar zoom itu menggunakan cloud-zoom, pengaturannya bisa dilihat di /catalog/view/theme/TEMA_KAMU/stylesheet/cloud-zoom.css
silahkan agan coba oprek2, kalo udah berhasil kasih tau ane ye..

Seblemunya trimakasih atas reply nya.
Saya sdh coba2 tp blom berhasil
Saya meman baru belajar.

Ini script di product.tpl saya :

<?php if ($thumb) { ?>
<div class="image"><div class="image_inside"><a href="<?php echo $popup; ?>" title="<?php echo $heading_title; ?>" class = 'cloud-zoom' id='zoom1' rel="tint: '#ffffff',tintOpacity:0.5 ,smoothMove:3,zoomWidth:379, zoomHeight:379, adjustY:-10, adjustX:23"><img src="<?php echo $thumb; ?>" title="<?php echo $heading_title; ?>" alt="<?php echo $heading_title; ?>" id="image" /></a></div><div class="zoom_btn">
<a id="zoomer" class="colorbox" href="<?php echo $popup; ?>">Zoom</a>
</div></div>
<?php } ?>
<?php if ($images) { ?>
<div class="image-additional">
<a href='<?php echo $popup; ?>' class='cloud-zoom-gallery' title='<?php echo $heading_title; ?>' rel="useZoom: 'zoom1', smallImage: '<?php echo $thumb; ?>' "><img class="zoom-tiny-image" src="<?php echo $thumb; ?>" alt = "<?php echo $heading_title; ?>"/></a>
<?php foreach ($images as $image) { ?>
<a href='<?php echo $image['popup']; ?>' class='cloud-zoom-gallery' title='<?php echo $heading_title; ?>' rel="useZoom: 'zoom1', smallImage: '<?php echo $image['thumb']; ?>' "><img class="zoom-tiny-image" src="<?php echo $image['thumb']; ?>" alt = "<?php echo $heading_title; ?>"/></a>
<?php } ?>
</div>
<?php } ?>
</div>


dan ini script di category.tpl saya :

<div class="category-info">
<?php if ($thumb) { ?>
<div class="image"><img src="<?php echo $thumb; ?>" alt="<?php echo $heading_title; ?>" /></div>
<?php } ?>
<?php if ($description) { ?>
<?php echo $description; ?>
<?php } ?>
</div>
<?php } ?>
<?php if ($categories) { ?>
<h2><?php echo $text_refine; ?></h2>
<div class="category-list">
<?php if (count($categories) <= 5) { ?>
<ul>
<?php foreach ($categories as $category) { ?>
<li><a href="<?php echo $category['href']; ?>"><?php echo $category['name']; ?></a></li>
<?php } ?>
</ul>
<?php } else { ?>
<?php for ($i = 0; $i < count($categories);) { ?>
<ul>
<?php $j = $i + ceil(count($categories) / 4); ?>
<?php for (; $i < $j; $i++) { ?>
<?php if (isset($categories[$i])) { ?>
<li><a href="<?php echo $categories[$i]['href']; ?>"><?php echo $categories[$i]['name']; ?></a></li>
<?php } ?>
<?php } ?>
</ul>
<?php } ?>
<?php } ?>
</div>

==================

Kira2 kira script zoom-cloudnya saya sisipkan dimana ya untuk di category.tpl -nya.
Senang sekali jika bisa dibantu.

Trimakasih master tulip_craft

master master

mau pasang zoom dikategori kenapa jadi ngerubahnya di product.tpl

dunks wrote:mau pasang zoom dikategori kenapa jadi ngerubahnya di product.tpl

maksudnya ngambil script yang dari product.tpl bro, kan disana yang bisa ngezoom..

dunks wrote:mau pasang zoom dikategori kenapa jadi ngerubahnya di product.tpl

Di product.tpl kan ada script yg membuat gambar pada halaman product bisa nge-zoom.
Maksud saya begini master "dunks" :
Saya harus meng-copy script yang mana dari product.tpl untuk saya paste kan di category.tpl, agar gambar2 produk yg ada di halaman category bisa nge-zoom kayak di halaman product.
Yg mana jika mouse di arahkan ke gambar, terjadi zoom kayak di halaman produk.

Mohon pencerahannya master "dunks"

tulip_craft wrote:

dunks wrote:mau pasang zoom dikategori kenapa jadi ngerubahnya di product.tpl

maksudnya ngambil script yang dari product.tpl bro, kan disana yang bisa ngezoom..

Iya master "tulip_craft", maksud saya seperti demikian.
Apakah saya bisa dibantu ?

owalaaah salah paham apa gagal paham kitaaa,, sebentar2 tak pikir2 dulu yaaa

Coba liat deh,, maksudnya kaya gini gk ? http://dv.mfahmi.net/desktops

dunks wrote:Coba liat deh,, maksudnya kaya gini gk ? http://dv.mfahmi.net/desktops

Iya master, yang kayak gitu juga Oke punya tuh..
Gmn caranya ya?

acmilan777 wrote:

dunks wrote:Coba liat deh,, maksudnya kaya gini gk ? http://dv.mfahmi.net/desktops

Iya master, yang kayak gitu juga Oke punya tuh..
Gmn caranya ya?

sy ada buat tutornya disini bro acmilan777 http://www.bersosial.com/node/236

Mangstaphh tutorialnya master "dunks"
Hmm,,masalahnya saya mengggunakan custom theme, bukan default theme

Bisa kah tetap di bantu?

Sya mau ngasih solusi, tapi solusi saya gak lebih baik gan. hehehe. jadi ya maksimalkan dari agan2 yang diatas aja ya