Mesaj #3076440 - Kiroglumarket - Opencart 2.1.x Ürün Lightbox Resim Görüntüleyici Kurulumu

Herkese merhaba arkadaşlar sizlere bugün farklı bir resim görüntüleyici modifikasyon dersimizle birlikte karşınızdayız. Opencart 2.x versiyonlarıyla beraber gelen magnify poupup yerine biraz daha gelişmiş ve responsive yapıya uygun gayet şık bir görüntüleyici olan prettybox lightbox resim görüntüleyicimizi kurulumu ve kullanımını öğreneceğiz. Bu görüntüleyici ile daha şık bir görünüme sahip olduğunu belirtmişit, ayrıca kengi galerisinde oluşturduğu ürün ekresimleri ilede poupupdan çıkmadan istediğimiz resime tıklayabilme imkanı sağlamaktadır. Otomatik oynatma özelliği ilede resim geçişlerini kendisi belirli zaman aralığında geçiiş yaparak diğer resime efektli olarak geçmektedir.

KAYNAK İNDİR || E-TİCARETDERSLERİ

Opencart 2.1.x Ürün Lightbox Resim Görüntüleyici Kurulumu

Sitemizden indirmişolduğunuz arşiv dosyasındaki catalog klasörünü sitemizin ana dizinine atalım. Dosya yükleme işlemi bittikten sonra sırasıyla aşağıdaki değişimleri yaparak prettyphoto lightbox resim görüntüleyicimiz başarılı bir şekilde sitemizde faal olarak çalışmaya başlayacaktır.

Dosyamızı Açalım : catalog/view/theme/senin-teman/template/common/

product.tpl

Bulalım :

Üst Satıra Ekleyelim :

 <script></script>

      



<script>

  $(document).ready(function(){

    $("a[rel^='prettyPhoto']").prettyPhoto({animation_speed: 'fast', /* fast/slow/normal */

			slideshow: 5000, /* false OR interval time in ms */

			autoplay_slideshow: false, /* true/false */

			opacity: 0.80, /* Value between 0 and 1 */

			show_title: true, /* true/false */

			allow_resize: true, /* Resize the photos bigger than viewport. true/false */

			default_width: 500,

			default_height: 344,

			counter_separator_label: "/", /* The separator for the gallery counter 1 "of" 2 */

			theme: 'dark_rounded', /* light_rounded / dark_rounded / light_square / dark_square / facebook */

			horizontal_padding: 20, /* The padding on each side of the picture */

			hideflash: false, /* Hides all the flash object on a page, set to TRUE if flash appears over prettyPhoto */

			wmode: 'opaque', /* Set the flash wmode attribute */

			autoplay: true, /* Automatically start videos: True/False */

			modal: false, /* If set to true, only the close button will close the window */

			deeplinking: false, /* Allow prettyPhoto to update the url to enable deeplinking. */

			overlay_gallery: true, /* If set to true, a gallery will overlay the fullscreen image on mouse over */

			keyboard_shortcuts: true, /* Set to false if you open forms inside prettyPhoto */

			changepicturecallback: function(){}, /* Called everytime an item is shown/changed */

			callback: function(){}, /* Called when prettyPhoto is closed */

			ie6_fallback: true

      });

});

</script>





Bulalım 

[QUOTE]

Değiştirelim :

[/QUOTE]

Üye Girişi Yap