1
Подправить В Блоке Характеристики
Автор Sgray, 16 янв. 2016 20:57
Сообщений в теме: 7
#1
Отправлено 16 Январь 2016 - 20:57
Как подправить в блоке характеристики в карточке товара во всех разрешениях. На 1 картинке как сейчас, нужно как на 2 картинке.
#2
Отправлено 17 Январь 2016 - 10:40
Sgray (16 Январь 2016 - 20:57) писал:
Как подправить в блоке характеристики в карточке товара во всех разрешениях. На 1 картинке как сейчас, нужно как на 2 картинке.
В шаблоне Товар найдите код
{% IFNOT goods_features_empty %} <div id="content_2" class="tab-content"> <!-- Блок характеристик товара. Показываем его если указаны характеристики --> {% IFNOT goods_features_empty %} <h3>Характеристики: {GOODS_NAME}</h3> <table class="goodsDataFeatures" width="100%"> <tr> {% FOR goods_features%} <td> <p class="name"><span class="value">{goods_features.NAME}</span></p> </td> <td> <span class="value">{goods_features.VALUE}</span> </td> {goods_features.index | is_divided("2","</tr><tr>","")} {% ENDFOR %} </tr> </table> {% ENDIF %} <!-- END Блок характеристик товара. Показываем его если указаны характеристики --> </div> {% ENDIF %}и замените на
{% IFNOT goods_features_empty %} <div id="content_2" class="tab-content"> <!-- Блок характеристик товара. Показываем его если указаны характеристики --> {% IFNOT goods_features_empty %} <h3>Характеристики: {GOODS_NAME}</h3> <table class="goodsDataFeatures" style="width:auto;"> <tr> {% FOR goods_features%} <td style="padding:0px 5px;"> <p class="name" style="overflow:hidden;"><span class="value" style="float:left;">{goods_features.NAME}</span><span class="value" style="float:right;padding-left:25px;">{goods_features.VALUE}</span></p> </td> {goods_features.index | is_divided("2","</tr><tr>","")} {% ENDFOR %} </tr> </table> {% ENDIF %} <!-- END Блок характеристик товара. Показываем его если указаны характеристики --> </div> {% ENDIF %}В style.css найдите код
.value { background: #fff; border-bottom: 10px solid #fff; }и замените на
.value { background: #fff; }
#3
Отправлено 17 Январь 2016 - 11:20
Danil (17 Январь 2016 - 10:40) писал:
Здравствуйте.
В шаблоне Товар найдите код
В шаблоне Товар найдите код
{% IFNOT goods_features_empty %} <div id="content_2" class="tab-content"> <!-- Блок характеристик товара. Показываем его если указаны характеристики --> {% IFNOT goods_features_empty %} <h3>Характеристики: {GOODS_NAME}</h3> <table class="goodsDataFeatures" width="100%"> <tr> {% FOR goods_features%} <td> <p class="name"><span class="value">{goods_features.NAME}</span></p> </td> <td> <span class="value">{goods_features.VALUE}</span> </td> {goods_features.index | is_divided("2","</tr><tr>","")} {% ENDFOR %} </tr> </table> {% ENDIF %} <!-- END Блок характеристик товара. Показываем его если указаны характеристики --> </div> {% ENDIF %}и замените на
{% IFNOT goods_features_empty %} <div id="content_2" class="tab-content"> <!-- Блок характеристик товара. Показываем его если указаны характеристики --> {% IFNOT goods_features_empty %} <h3>Характеристики: {GOODS_NAME}</h3> <table class="goodsDataFeatures" style="width:auto;"> <tr> {% FOR goods_features%} <td style="padding:0px 5px;"> <p class="name" style="overflow:hidden;"><span class="value" style="float:left;">{goods_features.NAME}</span><span class="value" style="float:right;padding-left:25px;">{goods_features.VALUE}</span></p> </td> {goods_features.index | is_divided("2","</tr><tr>","")} {% ENDFOR %} </tr> </table> {% ENDIF %} <!-- END Блок характеристик товара. Показываем его если указаны характеристики --> </div> {% ENDIF %}В style.css найдите код
.value { background: #fff; border-bottom: 10px solid #fff; }и замените на
.value { background: #fff; }
Получилось как на картинке. Теперь надо сделать промежуток между столбцами. И заметил, что сама характеристика стала тоже подчеркнута под одной линией с значением.
#4
Отправлено 17 Январь 2016 - 12:11
Sgray (17 Январь 2016 - 11:20) писал:
Получилось как на картинке. Теперь надо сделать промежуток между столбцами. И заметил, что сама характеристика стала тоже подчеркнута под одной линией с значением.
.name {border-bottom: 1px dotted #ccc;}и замените на
.name {float:left;border-bottom: 1px dotted #ccc;}В шаблоне html найдите код
{% IFNOT goods_features_empty %} <div id="content_2" class="tab-content"> <!-- Блок характеристик товара. Показываем его если указаны характеристики --> {% IFNOT goods_features_empty %} <h3>Характеристики: {GOODS_NAME}</h3> <table class="goodsDataFeatures" style="width:auto;"> <tr> {% FOR goods_features%} <td style="padding:0px 5px;"> <p class="name" style="overflow:hidden;"><span class="value" style="float:left;">{goods_features.NAME}</span><span class="value" style="float:right;padding-left:25px;">{goods_features.VALUE}</span></p> </td> {goods_features.index | is_divided("2","</tr><tr>","")} {% ENDFOR %} </tr> </table> {% ENDIF %} <!-- END Блок характеристик товара. Показываем его если указаны характеристики --> </div> {% ENDIF %}и замените на
{% IFNOT goods_features_empty %} <div id="content_2" class="tab-content"> <!-- Блок характеристик товара. Показываем его если указаны характеристики --> {% IFNOT goods_features_empty %} <h3>Характеристики: {GOODS_NAME}</h3> <table class="goodsDataFeatures" style="width:auto;"> <tr> {% FOR goods_features%} <td style="padding-right: 15px;"> <p class="name" style="overflow:hidden;border-bottom:0px;"><span class="value" style="float:left;">{goods_features.NAME}</span></p> <p class="name" style="overflow:hidden;"><span class="value" style="float:right;padding-left:25px;">{goods_features.VALUE}</span></p> </td> {goods_features.index | is_divided("2","</tr><tr>","")} {% ENDFOR %} </tr> </table> {% ENDIF %} <!-- END Блок характеристик товара. Показываем его если указаны характеристики --> </div> {% ENDIF %}
#5
Отправлено 17 Январь 2016 - 13:50
Danil (17 Январь 2016 - 12:11) писал:
В style.css найдите код
.name {border-bottom: 1px dotted #ccc;}и замените на
.name {float:left;border-bottom: 1px dotted #ccc;}В шаблоне html найдите код
{% IFNOT goods_features_empty %} <div id="content_2" class="tab-content"> <!-- Блок характеристик товара. Показываем его если указаны характеристики --> {% IFNOT goods_features_empty %} <h3>Характеристики: {GOODS_NAME}</h3> <table class="goodsDataFeatures" style="width:auto;"> <tr> {% FOR goods_features%} <td style="padding:0px 5px;"> <p class="name" style="overflow:hidden;"><span class="value" style="float:left;">{goods_features.NAME}</span><span class="value" style="float:right;padding-left:25px;">{goods_features.VALUE}</span></p> </td> {goods_features.index | is_divided("2","</tr><tr>","")} {% ENDFOR %} </tr> </table> {% ENDIF %} <!-- END Блок характеристик товара. Показываем его если указаны характеристики --> </div> {% ENDIF %}и замените на
{% IFNOT goods_features_empty %} <div id="content_2" class="tab-content"> <!-- Блок характеристик товара. Показываем его если указаны характеристики --> {% IFNOT goods_features_empty %} <h3>Характеристики: {GOODS_NAME}</h3> <table class="goodsDataFeatures" style="width:auto;"> <tr> {% FOR goods_features%} <td style="padding-right: 15px;"> <p class="name" style="overflow:hidden;border-bottom:0px;"><span class="value" style="float:left;">{goods_features.NAME}</span></p> <p class="name" style="overflow:hidden;"><span class="value" style="float:right;padding-left:25px;">{goods_features.VALUE}</span></p> </td> {goods_features.index | is_divided("2","</tr><tr>","")} {% ENDFOR %} </tr> </table> {% ENDIF %} <!-- END Блок характеристик товара. Показываем его если указаны характеристики --> </div> {% ENDIF %}
Посмотрите, че то не то.
#7
Отправлено 17 Январь 2016 - 14:58
Danil (17 Январь 2016 - 14:54) писал:
Изменения Вам произвел, проверьте.
Все как надо было, но так хорошо отображается только при разрешениях более 1000, а при меньших разрешениях все криво. Может в мобильных версиях можно как-то подправить? (например: если не умещается текст, то характеристики сделать в одну колонку)
#8
Отправлено 17 Январь 2016 - 15:38
Sgray (17 Январь 2016 - 14:58) писал:
Все как надо было, но так хорошо отображается только при разрешениях более 1000, а при меньших разрешениях все криво. Может в мобильных версиях можно как-то подправить? (например: если не умещается текст, то характеристики сделать в одну колонку)
Количество пользователей, читающих эту тему: 0
0 пользователей, 0 гостей, 0 анонимных