Прошу Ответить По Вкладкам
#1
Отправлено 12 Март 2015 - 17:19
3) Также включила отзывы, но они не отображаются вкладкой. 4) И как можно сделать вкладку состав, чтобы для каждого товара отображался разный состав?
Аккаунт 325506
#2
Отправлено 12 Март 2015 - 17:42
Пингвин (12 Март 2015 - 17:19) писал:
3) Также включила отзывы, но они не отображаются вкладкой. 4) И как можно сделать вкладку состав, чтобы для каждого товара отображался разный состав?
Аккаунт 325506
1. Найдите в style2.css
.tabs label { background: #6d747c; background: -moz-linear-gradient(top, #5ba4a4 0%, #4e8c8a 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#5ba4a4), color-stop(100%,#4e8c8a)); background: -webkit-linear-gradient(top, #5ba4a4 0%,#4e8c8a 100%); background: -o-linear-gradient(top, #5ba4a4 0%,#4e8c8a 100%); background: -ms-linear-gradient(top, #5ba4a4 0%,#4e8c8a 100%); background: linear-gradient(top, #5ba4a4 0%,#4e8c8a 100%); font-size: 15px; line-height: 40px; height: 40px; position: relative; padding: 0 20px; float: left; display: block; width: 140px; color: #385c5b; font-weight: bold; text-align: center; text-shadow: 1px 1px 1px rgba(255,255,255,0.3); border-radius: 3px 3px 0 0; box-shadow: 2px 0 2px rgba(0,0,0,0.1), -2px 0 2px rgba(0,0,0,0.1); }замените на
.tabs label { background: #7A9F0B; background: -moz-linear-gradient(top, #5ba4a4 0%, #4e8c8a 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#5C7F00), color-stop(100%,#4F6F00)); background: -webkit-linear-gradient(top, #5C7F00 0%,#4F6F00 100%); background: -o-linear-gradient(top, #5ba4a4 0%,#4e8c8a 100%); background: -ms-linear-gradient(top, #5ba4a4 0%,#4e8c8a 100%); background: linear-gradient(top, #5ba4a4 0%,#4e8c8a 100%); font-size: 15px; line-height: 40px; height: 40px; position: relative; padding: 0 20px; float: left; display: block; width: 140px; color: #DEEA87; font-weight: bold; text-align: center; text-shadow: 1px 1px 1px rgba(255,255,255,0.3); border-radius: 3px 3px 0 0; box-shadow: 2px 0 2px rgba(0,0,0,0.1), -2px 0 2px rgba(0,0,0,0.1); }2. найдите в style2.css
.tabs { position: relative; margin: 40px auto; width: 750px; }замените на
.tabs { position: relative; margin: 40px auto; width: 669px; overflow-y: scroll; }3. на данный момент у вас выключены отзывы о товарах, найдите в раздел Настройки-Основное и включите.
4. Вы можете добавить информацию в краткое описание и вывести на сайте
#3
Отправлено 12 Март 2015 - 18:22
Ирина345 (12 Март 2015 - 17:42) писал:
1. Найдите в style2.css
.tabs label { background: #6d747c; background: -moz-linear-gradient(top, #5ba4a4 0%, #4e8c8a 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#5ba4a4), color-stop(100%,#4e8c8a)); background: -webkit-linear-gradient(top, #5ba4a4 0%,#4e8c8a 100%); background: -o-linear-gradient(top, #5ba4a4 0%,#4e8c8a 100%); background: -ms-linear-gradient(top, #5ba4a4 0%,#4e8c8a 100%); background: linear-gradient(top, #5ba4a4 0%,#4e8c8a 100%); font-size: 15px; line-height: 40px; height: 40px; position: relative; padding: 0 20px; float: left; display: block; width: 140px; color: #385c5b; font-weight: bold; text-align: center; text-shadow: 1px 1px 1px rgba(255,255,255,0.3); border-radius: 3px 3px 0 0; box-shadow: 2px 0 2px rgba(0,0,0,0.1), -2px 0 2px rgba(0,0,0,0.1); }замените на
.tabs label { background: #7A9F0B; background: -moz-linear-gradient(top, #5ba4a4 0%, #4e8c8a 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#5C7F00), color-stop(100%,#4F6F00)); background: -webkit-linear-gradient(top, #5C7F00 0%,#4F6F00 100%); background: -o-linear-gradient(top, #5ba4a4 0%,#4e8c8a 100%); background: -ms-linear-gradient(top, #5ba4a4 0%,#4e8c8a 100%); background: linear-gradient(top, #5ba4a4 0%,#4e8c8a 100%); font-size: 15px; line-height: 40px; height: 40px; position: relative; padding: 0 20px; float: left; display: block; width: 140px; color: #DEEA87; font-weight: bold; text-align: center; text-shadow: 1px 1px 1px rgba(255,255,255,0.3); border-radius: 3px 3px 0 0; box-shadow: 2px 0 2px rgba(0,0,0,0.1), -2px 0 2px rgba(0,0,0,0.1); }2. найдите в style2.css
.tabs { position: relative; margin: 40px auto; width: 750px; }замените на
.tabs { position: relative; margin: 40px auto; width: 669px; overflow-y: scroll; }3. на данный момент у вас выключены отзывы о товарах, найдите в раздел Настройки-Основное и включите.
4. Вы можете добавить информацию в краткое описание и вывести на сайте
Спасибо большое!
Но:
1) Цвет шрифта поменялся, но стал почти незаметным. А название и сама вкладка так и подсвечиваются голубым.
2) Появилась рамка для текста, но скролл не работает, в итоге часть длинного текста не просмотреть.
3) У меня включены отзывы, но они по-прежнему не показываются.
#4
Отправлено 13 Март 2015 - 01:53
.tabs input:checked + label { background: #fff; z-index: 6; -webkit-animation: page 0.2s linear; -moz-animation: page 0.2s linear; -ms-animation: page 0.2s linear; -o-animation: page 0.2s linear; animation: page 0.2s linear; }
данный код отвечает за выбранную вкладку, можно в ней изменить цвет шрифта, например:
.tabs input:checked + label { background: #fff; z-index: 6; color:#000; -webkit-animation: page 0.2s linear; -moz-animation: page 0.2s linear; -ms-animation: page 0.2s linear; -o-animation: page 0.2s linear; animation: page 0.2s linear; }
Цвет внутри таба меняйте в следующем блоке:
.content div h2, .content div h3 { color: #398080; }
2. В style.css найдите:
.content divзамените на:
.content > div
скролл рабочий появится в случае, если информации больше чем высота блока
3. В шаблоне Товар найдите:
{% IFNOT TARIFF_FEATURE_GOODS_OPINION %} <input id="tab-4" type="radio" name="radio-set" class="tab-selector-4" /> <label for="tab-4" class="tab-label-4">Отзывы</label> {%ENDIF%}замените на:
<input id="tab-4" type="radio" name="radio-set" class="tab-selector-4" /> <label for="tab-4" class="tab-label-4">Отзывы</label>
#5
Отправлено 14 Март 2015 - 16:12
Vaccina (13 Март 2015 - 01:53) писал:
.tabs input:checked + label { background: #fff; z-index: 6; -webkit-animation: page 0.2s linear; -moz-animation: page 0.2s linear; -ms-animation: page 0.2s linear; -o-animation: page 0.2s linear; animation: page 0.2s linear; }
данный код отвечает за выбранную вкладку, можно в ней изменить цвет шрифта, например:
.tabs input:checked + label { background: #fff; z-index: 6; color:#000; -webkit-animation: page 0.2s linear; -moz-animation: page 0.2s linear; -ms-animation: page 0.2s linear; -o-animation: page 0.2s linear; animation: page 0.2s linear; }
Цвет внутри таба меняйте в следующем блоке:
.content div h2, .content div h3 { color: #398080; }
2. В style.css найдите:
.content divзамените на:
.content > div
скролл рабочий появится в случае, если информации больше чем высота блока
3. В шаблоне Товар найдите:
{% IFNOT TARIFF_FEATURE_GOODS_OPINION %} <input id="tab-4" type="radio" name="radio-set" class="tab-selector-4" /> <label for="tab-4" class="tab-label-4">Отзывы</label> {%ENDIF%}замените на:
<input id="tab-4" type="radio" name="radio-set" class="tab-selector-4" /> <label for="tab-4" class="tab-label-4">Отзывы</label>
Спасибо! Все получилось, кроме одного: поменять цвет недействующей вкладки (в прикрепленном файле пример). Сейчасвкладки голубые, нужны зеленые. Перепробовала все.
#6
Отправлено 14 Март 2015 - 16:18
Пингвин (14 Март 2015 - 16:12) писал:
Вопрос еще актуален?
На данный момент цвет вкладок изменен.
#8
Отправлено 14 Март 2015 - 16:28
Пингвин (14 Март 2015 - 16:20) писал:
.tabs label { background: 7A9F0B; background: -moz-linear-gradient(top, #5ba4a4 0%, #4e8c8a 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#5C7F00), color-stop(100%,#4F6F00)); background: -webkit-linear-gradient(top, #5C7F00 0%,#4F6F00 100%); background: -o-linear-gradient(top, #5ba4a4 0%,#4e8c8a 100%); background: -ms-linear-gradient(top, #5ba4a4 0%,#4e8c8a 100%); background: linear-gradient(top, #5ba4a4 0%,#4e8c8a 100%); font-size: 15px; line-height: 40px; height: 40px; position: relative; padding: 0 20px; float: left; display: block; width: 140px; color: black; font-weight: bold; text-align: center; text-shadow: 1px 1px 1px rgba(255,255,255,0.3); border-radius: 3px 3px 0 0; box-shadow: 2px 0 2px rgba(0,0,0,0.1), -2px 0 2px rgba(0,0,0,0.1); }background: linear-gradient (во всех 6 строчках должен быть одинаковый цвет)
#9
Отправлено 14 Март 2015 - 16:47
Danil (14 Март 2015 - 16:28) писал:
.tabs label { background: 7A9F0B; background: -moz-linear-gradient(top, #5ba4a4 0%, #4e8c8a 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#5C7F00), color-stop(100%,#4F6F00));\ Спасибо!! Теперь все как надо) background: -webkit-linear-gradient(top, #5C7F00 0%,#4F6F00 100%); background: -o-linear-gradient(top, #5ba4a4 0%,#4e8c8a 100%); background: -ms-linear-gradient(top, #5ba4a4 0%,#4e8c8a 100%); background: linear-gradient(top, #5ba4a4 0%,#4e8c8a 100%); font-size: 15px; line-height: 40px; height: 40px; position: relative; padding: 0 20px; float: left; display: block; width: 140px; color: black; font-weight: bold; text-align: center; text-shadow: 1px 1px 1px rgba(255,255,255,0.3); border-radius: 3px 3px 0 0; box-shadow: 2px 0 2px rgba(0,0,0,0.1), -2px 0 2px rgba(0,0,0,0.1); }background: linear-gradient (во всех 6 строчках должен быть одинаковый цвет)
Спасибо! Теперь все как надо)
#11
Отправлено 17 Март 2015 - 19:54
Пингвин (17 Март 2015 - 19:22) писал:
Здравствуйте, зайдите в админ. панель -> Сайт -> Редактор шаблонов -> СТИЛИ -> main.css добавьте последней строкой код:
.op .tabs .content {overflow-x: hidden;}
Количество пользователей, читающих эту тему: 0
0 пользователей, 0 гостей, 0 анонимных