При создании каталога товаров на OpenCart 3, возникает в некоторых ситуациях, необходимость скрыть кнопку «Купить». Это логично, если в каталоге, будет представлена только продукция для ознакомления, без возможности ее купить. При этом, в настройках OpenCart, нет возможности скрыть отображение кнопки «Купить».
Данную возможность, можно реализовать посредством:
- покупки премиум шаблона, с данной функцией
- удаления из шаблонов кнопки «Купить» вручную
- написания для этого модификатора
- CSS
В данной заметке, рассмотрим простой и безопасный способ скрытия кнопки «Купить» из шаблона в OpenCart 3, с помощью CSS. Способ будет актуален в первую очередь для новичков, которые только начинаю работать с CMS OpenCart 3. Не нужно ничего удалять или
модифицировать в шаблоне.
Способ рабочий и применялся мной на версии OpenCart 3.0.3.7. Перед любыми манипуляциями, обязательно делайте резервные копии сайта и базы данных! Если понимаете, что не справитесь сами, найдите специалиста, который поможет вам решить вопрос.
Для скрытия кнопки «Купить» в OpenCart 3, будем использовать свойство (CSS):
display
Со значением:
none
Вот такая конструкция:
display: none;Подробнее о свойствах display и используемых значениях, можно прочитать в справке https://developer.mozilla.org...
А куда все это вставлять и как использовать? Все просто, сморим ниже.
Как скрыть кнопку «Купить» в OpenCart 3?
Открываем stylesheet.css по пути, для дефолтного шаблона:
/catalog/view/theme/default/stylesheet/stylesheet.css
Открываем файл stylesheet.css через любой редактор кода и добавляем в самый конец:
#product {
display: none;
}
.product-layout .product-thumb .button-group button:first-child {
display: none;
}
.product-layout .product-thumb .button-group button + button {
width: 50%;
}
.product-layout .product-thumb .caption {
min-height: 120px;
}
Примерно так, это будет у вас выглядеть в коде файла stylesheet.css:
Сохранять внесенные изменения и чтобы проверить результат, нажимаем в браузере на странице Ctrl -> F5:
Видим, что кнопка «Купить», теперь не отображается в карточке товара.
Аналогично, кнопка «Купить» скрыта в категориях товаров:
На главной странице магазина, кнопки «Купить» в OpenCart 3, не отображаются:
Как скрыть кнопку «Купить» на отличном от дефолтного шаблона OpenCart 3?
Способ выше, можно использовать и на сторонних шаблонах / темах. При этом, в сторонних темах, отличных от дефолтной темы OpenCart 3, может потребоваться немного изменить код выше.
При настройке сторонней темы, необходимо файл stylesheet.css редактировать соответственно в папке той темы, которая у вас используется на сайте. Таким образом, вместо папки default, выбираем папку своей темы по пути:
/catalog/view/theme/папка_вашей_темы/stylesheet/stylesheet.css
Если у вас не выходит внести нужные изменения на платном шаблоне,
обратитесь к автору своего шаблона. Он обязательно вам поможет.
Не используйте шаблоны и модули с варезных сайтов. Покупайте шаблоны только на известных площадках. Будет полезным ресурс warez.rip
В некоторых шаблонах, нужно удалить час кода, приведенного выше:
.product-layout .product-thumb .button-group button + button {Таким образом, в файл stylesheet.cssпо пути:
width: 50%;
}
.product-layout .product-thumb .caption {
min-height: 120px;
}
/catalog/view/theme/папка_вашей_темы/stylesheet/stylesheet.css
Необходимо добавить только:
#product {
display: none;
}
.product-layout .product-thumb .button-group button:first-child {
display: none;
}
Однако, не удаляйте его на дефолтной / стандартной теме. Иначе, у вас сместятся кнопки «В закладки» и «В сравнение»:
Как сделать вместо кнопки «Купить», кнопку «Запросить стоимость» в OpenCart 3?
Бывает, в каталоге товаров, необходимо предоставить возможность пользователям оставить заявку на запрос цены. То есть, скрыть цену и кнопку «Купить», при этом, дать возможность пользователям узнать больше о нужном товаре. В таком случае, помогут готовые решения:
Модули скрывают цену и вместо кнопки «Купить», появляется кнопка «Запросить цену», после нажатия на которую, пользователь может указать контактные данные, для связи:
Единственное, поддержка данных модулей для OpenCart 3.0. Не проверял на последней версии. Уточняйте у авторов, если нужно.
Заключение.
Для тех, кто хочет создать простой каталог товаров, для представления информации о товаров или услуг на OpenCart 3, могут с минимальными затратами, используя стандартный шаблон, создать простой и функциональный каталог. Данное решение из заметки, будет актуально и тем, кто хочет создать Интернет-магазин под партнерскую СРА сеть Admitad на OpenCart 3.
По теме: «Как изменить текст кнопки «Купить» на странице товара в OpenCart 3?»
В предыдущей заметке, мы рассмотрели способ скрытия цен из карточек товара, без использования модулей, посредством CSS, как и в данной заметке. В ней, продублированы ссылки на модули «Запросить цену» и есть полезное видео, по настройке стандартной темы в OpenCart 3.
В следующей заметке, рассмотрим способ скрытия корзины товаров из шаблона OpenCart 3.
Полезно знать: «Некорректная работа скрипта Moneylink и Admitad Teleport от Admitad.»
Как создать интернет магазин на OpenCart с минимальными затратами (автотовары):