Спасибо, получилось!
Еще подскажите, пожалуйста, как сделать , чтобы текст огибал фото. Чтобы ниже фотографии текст был на всю ширину страницы, а не в столбик.
0
Убрать С Карточки Товара Всю Информацию
Автор Angela23, 14 февр. 2014 00:30
Сообщений в теме: 27
#21
Отправлено 20 Май 2015 - 20:10
#22
Отправлено 21 Май 2015 - 05:36
В шаблоне Товар найдите:
замените на:
Далее в main.css найдите:
замените на:
в самом описании лучше не использовать таблицу, если необходимо, чтобы она переносилась
<td class="goodsDataMainImageBlock"> <!-- Большое изображение --> <div class="goodsDataMainImage"> {% IF GOODS_IMAGE_EMPTY %} <img src="{ASSETS_IMAGES_PATH}no-photo-medium.png?design=light" alt="{GOODS_NAME}" title="Увеличить {GOODS_NAME}" /> {% ELSE %} <a itemprop="image" href="{GOODS_IMAGE_LARGE}" target="_blank" title="Увеличить {GOODS_NAME}"><img class="goods-image-medium" src="{GOODS_IMAGE_MEDIUM}" alt="{GOODS_NAME}" /></a> {% ENDIF %} <!-- Идентификатор изображения товара, используется для галереи изображений --> <input type="hidden" rel="{GOODS_IMAGE_ID}" /> </div> <!-- Ссылка на увеличение среднего изображения товара до большого. Появляется если у товара указано изображение --> {% IFNOT GOODS_IMAGE_EMPTY %} <div class="goodsDataMainImageZoom"> <a href="{GOODS_IMAGE_LARGE}" target="_blank">Увеличить изображение</a> </div> {% ENDIF %} <!-- Другие изображения товара. Отображаются если есть изображения товара --> {% IFNOT goods_images_empty %} {% FOR goods_images %} <!-- Заголовок и обёртка для изображений, которая позволяет не показывать уменьшенное изображение товара если оно у него лишь одно --> {% IF goods_images.first %} <div {% IF goods_images.length=1 %}style="display:none;"{% ENDIF %}> <h5>Другие фото {GOODS_NAME}</h5> {% ENDIF %} <!-- Уменьшенное изображение товара --> <div class="goodsDataMainImagesIcon floatLeft"> <a href="{goods_images.LARGE}" rel="gallery" target="_blank" title="{goods_images.NAME}"><img class="withBorder goods-image-icon" rel="{goods_images.MEDIUM}" src="{goods_images.ICON}" alt="{goods_images.NAME}" /></a> <!-- Идентификатор изображения товара, используется для галереи изображений --> <input type="hidden" rel="{goods_images.ID}" /> </div> <!-- В самом конце закрываем обёртку для списка маленьких изображений товара --> {% IF goods_images.last %} </div> {% ENDIF %} {% ENDFOR %} {% ENDIF %} </td> <td> <div class="goodsDataMainOrder cornerAll" itemscope itemprop="offerDetails" itemtype="http://data-vocabulary.org/Offer"> <table> <!-- Блок описания товара. Показываем его есть описание товара --> {% IF GOODS_DESCRIPTION_LARGE %} <tr> <td class="goodsDataMainDescription" colspan="2"> <div class="goodsDescriptionBlock"> <div class="htmlDataBlock" itemprop="description"> {GOODS_DESCRIPTION_LARGE} </div> </div> </td> </tr> {% ENDIF %} <!-- END Блок описания товара. Показываем его есть описание товара --> </table> </div> </td>
замените на:
<td class="goodsDataMainImageBlock"> <div> <!-- Большое изображение --> <div class="goodsDataMainImage"> {% IF GOODS_IMAGE_EMPTY %} <img src="{ASSETS_IMAGES_PATH}no-photo-medium.png?design=light" alt="{GOODS_NAME}" title="Увеличить {GOODS_NAME}" /> {% ELSE %} <a itemprop="image" href="{GOODS_IMAGE_LARGE}" target="_blank" title="Увеличить {GOODS_NAME}"><img class="goods-image-medium" src="{GOODS_IMAGE_MEDIUM}" alt="{GOODS_NAME}" /></a> {% ENDIF %} <!-- Идентификатор изображения товара, используется для галереи изображений --> <input type="hidden" rel="{GOODS_IMAGE_ID}" /> </div> <!-- Ссылка на увеличение среднего изображения товара до большого. Появляется если у товара указано изображение --> {% IFNOT GOODS_IMAGE_EMPTY %} <div class="goodsDataMainImageZoom"> <a href="{GOODS_IMAGE_LARGE}" target="_blank">Увеличить изображение</a> </div> {% ENDIF %} <!-- Другие изображения товара. Отображаются если есть изображения товара --> {% IFNOT goods_images_empty %} {% FOR goods_images %} <!-- Заголовок и обёртка для изображений, которая позволяет не показывать уменьшенное изображение товара если оно у него лишь одно --> {% IF goods_images.first %} <div {% IF goods_images.length=1 %}style="display:none;"{% ENDIF %}> <h5>Другие фото {GOODS_NAME}</h5> {% ENDIF %} <!-- Уменьшенное изображение товара --> <div class="goodsDataMainImagesIcon floatLeft"> <a href="{goods_images.LARGE}" rel="gallery" target="_blank" title="{goods_images.NAME}"><img class="withBorder goods-image-icon" rel="{goods_images.MEDIUM}" src="{goods_images.ICON}" alt="{goods_images.NAME}" /></a> <!-- Идентификатор изображения товара, используется для галереи изображений --> <input type="hidden" rel="{goods_images.ID}" /> </div> <!-- В самом конце закрываем обёртку для списка маленьких изображений товара --> {% IF goods_images.last %} <div class="clear"></div> </div> {% ENDIF %} {% ENDFOR %} {% ENDIF %} </div> <div class="goodsDataMainOrder cornerAll" itemscope itemprop="offerDetails" itemtype="http://data-vocabulary.org/Offer"> <!-- Блок описания товара. Показываем его есть описание товара --> {% IF GOODS_DESCRIPTION_LARGE %} <div class="goodsDescriptionBlock"> <div class="htmlDataBlock" itemprop="description"> {GOODS_DESCRIPTION_LARGE} </div> </div> {% ENDIF %} <!-- END Блок описания товара. Показываем его есть описание товара --> </div> <div class="clear"></div> </td>
Далее в main.css найдите:
.goodsDataMainImageBlock { width: 280px; }
замените на:
.goodsDataMainImageBlock { width: 100%; } .goodsDataMainImageBlock > div:first-child { display: block; float: left; } .clear { clear: both; } .goodsDataMainOrder { border: medium none !important; display: inline; } .goodsDescriptionBlock, .goodsDescriptionBlock .htmlDataBlock { display: inline; }
в самом описании лучше не использовать таблицу, если необходимо, чтобы она переносилась
#27
Отправлено 31 Май 2015 - 13:41
Ок, спасибо!
Количество пользователей, читающих эту тему: 0
0 пользователей, 0 гостей, 0 анонимных