Здравствуйте, нужна верхняя полоса с промокодом и кнопкой закрытия полосы как у шаблона лотус спасибо). см вложение.
1
Нужна Полоса Как У Шаблона Лотус
Автор Антон 5554, 03 янв. 2019 23:52
Сообщений в теме: 4
#1
Отправлено 03 Январь 2019 - 23:52
#2
Отправлено 06 Январь 2019 - 14:03
Антон 5554 (03 Январь 2019 - 23:52) писал:
Здравствуйте, нужна верхняя полоса с промокодом и кнопкой закрытия полосы как у шаблона лотус спасибо). см вложение.
Здравствуйте. Зайдите в раздел Сайт---Редактор шаблонов---HTML и найдите код:
<!-- Верхняя часть Шапки --> <div id="header-top" class="wrap"> <div class="container">
Замените его на:
<!-- Верхняя часть Шапки --> <div id="header-top" class="wrap"> <!-- Верхняя часть --> <div class="announcement-bar"> <div class="text">Скидка 5% при первом заказе! Используйте промокод <span>“SALE5”</span>. <a href="{CATALOG_URL}" title="Перейти к покупкам">Перейти к покупкам</a></div> <div class="close"><i class="material-icons">close</i></div> </div> <div class="container">
Зайдите в Редактор шаблонов --- main.css и найдите код:
#wrapper {position: relative;} #wrapper:before {content: '';display: block;position: absolute;top: 0;left: 0;right: 0;bottom: 0;background: #fff;width: 100%;height: 100%;z-index: -1;}
И сразу после добавьте данный код:
.announcement-bar { padding: 10px 50px 10px 15px; text-align: center; color: #fff; background-color: #212121; } .announcement-bar a { color: #009250; } .announcement-bar .text { line-height: 20px; } .announcement-bar .close { display: block; position: absolute; width: 30px; height: 30px; top: 5px; right: 20px; color: #fff; cursor: pointer; text-align: center; } .announcement-bar .close i { display: none; } .material-icons { font-family: 'Material Icons'; font-weight: normal; font-style: normal; font-size: 24px; line-height: 1; letter-spacing: normal; text-transform: none; display: inline-block; white-space: nowrap; word-wrap: normal; direction: ltr; -webkit-font-feature-settings: 'liga'; -webkit-font-smoothing: antialiased; } .announcement-bar .text span { font-weight: bold; }
Найдите данный код:
@media all and (max-width: 641px) { #thumblist-image li { max-width: 337px;} #topsl {display:none;}
И сразу после добавьте данный код:
.announcement-bar {display: none;}
#3
Отправлено 06 Январь 2019 - 21:39
stasia (06 Январь 2019 - 14:03) писал:
Здравствуйте. Зайдите в раздел Сайт---Редактор шаблонов---HTML и найдите код:
Замените его на:
Зайдите в Редактор шаблонов --- main.css и найдите код:
И сразу после добавьте данный код:
Найдите данный код:
И сразу после добавьте данный код:
<!-- Верхняя часть Шапки --> <div id="header-top" class="wrap"> <div class="container">
Замените его на:
<!-- Верхняя часть Шапки --> <div id="header-top" class="wrap"> <!-- Верхняя часть --> <div class="announcement-bar"> <div class="text">Скидка 5% при первом заказе! Используйте промокод <span>“SALE5”</span>. <a href="{CATALOG_URL}" title="Перейти к покупкам">Перейти к покупкам</a></div> <div class="close"><i class="material-icons">close</i></div> </div> <div class="container">
Зайдите в Редактор шаблонов --- main.css и найдите код:
#wrapper {position: relative;} #wrapper:before {content: '';display: block;position: absolute;top: 0;left: 0;right: 0;bottom: 0;background: #fff;width: 100%;height: 100%;z-index: -1;}
И сразу после добавьте данный код:
.announcement-bar { padding: 10px 50px 10px 15px; text-align: center; color: #fff; background-color: #212121; } .announcement-bar a { color: #009250; } .announcement-bar .text { line-height: 20px; } .announcement-bar .close { display: block; position: absolute; width: 30px; height: 30px; top: 5px; right: 20px; color: #fff; cursor: pointer; text-align: center; } .announcement-bar .close i { display: none; } .material-icons { font-family: 'Material Icons'; font-weight: normal; font-style: normal; font-size: 24px; line-height: 1; letter-spacing: normal; text-transform: none; display: inline-block; white-space: nowrap; word-wrap: normal; direction: ltr; -webkit-font-feature-settings: 'liga'; -webkit-font-smoothing: antialiased; } .announcement-bar .text span { font-weight: bold; }
Найдите данный код:
@media all and (max-width: 641px) { #thumblist-image li { max-width: 337px;} #topsl {display:none;}
И сразу после добавьте данный код:
.announcement-bar {display: none;}
Всё классно, кнопки закрытия этой полоски нет. ( точнее поле есть но ни крестика ни действия закрытия нет(.
Посмотрите пожалуйста.
#4
Отправлено 10 Январь 2019 - 01:28
Здравствуйте.
Зайдите в раздел Сайт - Редактор шаблонов - main.js - в самом конце вставьте:
далее зайдите в main.css - найдите и удалите:
Зайдите в раздел Сайт - Редактор шаблонов - main.js - в самом конце вставьте:
// Закрытие верхней части шапки $(document).ready(function (){ $('#header-top .announcement-bar .close').on('click', function (event) { event.preventDefault(); if ($('#header-top .announcement-bar').hasClass('active')) { $('#header-top .announcement-bar').removeClass('active'); $(this).removeClass('active'); $('#header-top .announcement-bar').slideDown(); } else { $('#header-top .announcement-bar').addClass('active'); $(this).addClass('active'); $('#header-top .announcement-bar').slideUp(); } }); });
далее зайдите в main.css - найдите и удалите:
.announcement-bar .close i { display: none; }
#5
Отправлено 10 Январь 2019 - 11:40
Vaccina (10 Январь 2019 - 01:28) писал:
Здравствуйте.
Зайдите в раздел Сайт - Редактор шаблонов - main.js - в самом конце вставьте:
далее зайдите в main.css - найдите и удалите:
Зайдите в раздел Сайт - Редактор шаблонов - main.js - в самом конце вставьте:
// Закрытие верхней части шапки $(document).ready(function (){ $('#header-top .announcement-bar .close').on('click', function (event) { event.preventDefault(); if ($('#header-top .announcement-bar').hasClass('active')) { $('#header-top .announcement-bar').removeClass('active'); $(this).removeClass('active'); $('#header-top .announcement-bar').slideDown(); } else { $('#header-top .announcement-bar').addClass('active'); $(this).addClass('active'); $('#header-top .announcement-bar').slideUp(); } }); });
далее зайдите в main.css - найдите и удалите:
.announcement-bar .close i { display: none; }
S P A S I B O
Количество пользователей, читающих эту тему: 0
0 пользователей, 0 гостей, 0 анонимных