Правильное фото в УНИВЕРСАЛЬНОМ КАТАЛОГЕ

Хочется сделать фото как в популярных интернет магазинах

#1 2 ноября 2016 в 21:50
Всем привет!

Есть такое желание, сил, мочи и знаний на реализацию которого нет!
И так, в универсальный каталог, под фото добавил дополнительные фото, по клику все открывается как "было задумано" в окне, но хочется чтобы по клику на дополнительные фото, фото становилось в основное и только по клику на основное, оно открывалось в окне.

#2 3 ноября 2016 в 10:03
Так что надо то? Откуда же кто знает, как у вас там что реализовано? Если вы просто вывели снизу маленькие фото и привязали их к colorbox, или что там у вас, то значит надо писать js код, который будет отлавливать например, id вашей картинки, отсылать на сервер, а от туда передавать в шаблон, и выводить где надо.Но лучше наверное воспользоваться каким то готовым решением, типа слайдера.
#3 4 ноября 2016 в 23:34
Lora, да там будет всего 4 фото (максимум) думал можно обойтись без тяжелого кода слайдера! А js я не знаю.
#4 5 ноября 2016 в 09:59
Скиньте мне код (файл com_catalog_item.tpl, помоему), посмотрю.
#5 5 ноября 2016 в 20:23


Скиньте мне код (файл com_catalog_item.tpl, помоему), посмотрю.

Lora


  1.  
  2. {$item.plugins_output_before}
  3. {if $cat.view_type=='shop' || $item.can_edit}
  4. <div class="float_bar" id="shop_toollink_div">
  5. <!--{if $cat.view_type=='shop'}
  6. <div id="shop_cart_link" style="display: inline-block">{$shopCartLink}</div>
  7. {/if}-->
  8. {if $item.can_edit}
  9. <a href="/catalog/edit{$item.id}.html" class="btn btn-default">{$LANG.EDIT}</a>
  10. {/if}
  11. </div>
  12. {/if}
  13. <!--<h1 class="con_heading">{$item.title}</h1>-->
  14. <div class="row margin-bottom-row">
  15. <br><br>
  16. <div class="col-md-8 media-gird">
  17. {if strlen($item.imageurl)>4}
  18. <a class="lightbox-enabled" title="{$item.title|escape:'html'}" rel="lightbox" href="/images/catalog/{$item.imageurl}" target="_blank"><img class="media-object" alt="{$item.title|escape:'html'}" src="/images/catalog/medium/{$item.imageurl}" /></a>
  19. {else}
  20. <img class="media-object" src="/images/catalog/medium/nopic.jpg" />
  21. {/if}
  22. {if ($item.images)}
  23. <div class="otherimages">
  24. {foreach key=num item=image from=$item.images}
  25. <a class="lightbox-enabled" title="{$item.title|escape:'html'}" rel="lightbox" href="/images/catalog/{$image}" target="_blank">
  26. <img src="/images/catalog/small/{$image}" alt="{$item.title|escape:'html'}" style="width: 100px;">
  27. </a>
  28. {/foreach}
  29. </div>
  30. {else}
  31. {/if}
  32. </div>
  33. <div class="col-md-4">
  34. <ul class="list-group">
  35. <h3>{$item.title}</h3>
  36. <div style="font-size: 18px;">{$item.price} {$LANG.CURRENCY}</div><hr>
  37. <!-- <li class="list-group-item"><strong>{$LANG.ADDED_BY}: </strong> {$getProfileLink}</li> -->
  38. {foreach key=field item=value from=$fields}
  39. {if $value}
  40. {if strstr($field, '/~l~/')}
  41. <div>{$value}</div>
  42. {else}
  43. <div><strong>{$field}</strong><br>{$value}</div><hr>
  44. {/if}
  45. {/if}
  46. {/foreach}
  47. {if ($cat.showtags) && ($tagline)}
  48. <li class="list-group-item"><strong>{$LANG.TAGS}: </strong> {$tagline}</li>
  49. {/if}
  50. </ul>
  51. {if $cat.view_type=='shop'}
  52. <div style="text-align: center;">
  53. <a href="javascript:" title="{$LANG.ADD_TO_CART}" id="shop_ac_item_link">Добавить в корзину</a><br><br>
  54. <a href="javascript:" title="Удалить из корзины" id="shop_delc_item_link" class="my_a_and_hove">Удалить из корзины</a>
  55. </div>
  56. {/if}
  57. {if $item.on_moderate}
  58. <div id="shop_moder_form" style="margin:10px 0;">
  59. <p class="text-danger">{$LANG.WAIT_MODERATION}:</p>
  60. <table cellpadding="0" cellspacing="0" border="0"><tr>
  61. <td>
  62. <form action="/catalog/moderation/accept{$item.id}.html" method="POST">
  63. <input type="submit" name="accept" value="{$LANG.MODERATION_ACCEPT}"/>
  64. </form>
  65. </td>
  66. <td>
  67. <form action="/catalog/edit{$item.id}.html" method="POST">
  68. <input type="submit" name="accept" value="{$LANG.EDIT}"/>
  69. </form>
  70. </td>
  71. <td>
  72. <form action="/catalog/moderation/reject{$item.id}.html" method="POST">
  73. <input type="submit" name="accept" value="{$LANG.MODERATION_REJECT}"/>
  74. </form>
  75. </td>
  76. </tr></table>
  77. </div>
  78. {/if}
  79. </div>
  80. </div><hr>
  81. {if $cat.is_ratings}
  82. {$ratingForm}
  83. {/if}
  84. {$item.recomend}
  85. {$item.plugins_output_after}
  86.  
  87.  
  88.  
  89. {if $cat.view_type=='shop'}
  90. {literal}
  91. <script type="text/javascript">
  92.  
  93. $('#shop_ac_item_link').click(
  94. function() {
  95. $.post('/components/catalog/js/get_shopcart.php', {'type':'add', 'id':{/literal}{$item.id}{literal}},
  96. function(data){
  97. $('#shop_cart_link').html(data);
  98. });
  99.  
  100. $.post('/modules/mod_cart/ajax_module.php', {},
  101. function(data){
  102. $('#shop_cart_module').html(data);
  103. });
  104.  
  105. });
  106.  
  107. $('#shop_delc_item_link').click(
  108. function() {
  109. $.post('/components/catalog/js/get_shopcart.php', {'type':'del', 'id':{/literal}{$item.id}{literal}},
  110. function(data){
  111. $('#shop_cart_link').html(data);
  112. });
  113.  
  114. $.post('/modules/mod_cart/ajax_module.php', {},
  115. function(data){
  116. $('#shop_cart_module').html(data);
  117. });
  118.  
  119. });
  120.  
  121. </script>
  122. {/literal}
  123. {/if}
  124.  


Вот весь код файла.
Сам сайт mozg23.ru
Вы не можете отвечать в этой теме.
Войдите или зарегистрируйтесь, чтобы писать на форуме.
Используя этот сайт, вы соглашаетесь с тем, что мы используем файлы cookie.