Как скрыть колонки в «Корзине»

В этом уроке я покажу вам, как быстро и легко удалить любую колонку из таблицы в Корзине WooCommerce. На самом деле это задача встречается довольно часто, я например удалял колонки из корзины в мобильной версии проекта Kalabasa.

Кстати говоря, в моём курсе по WooCommerce есть отдельный видеоурок про корзину.

страница корзина в WooCommerce
Страница корзины в WooCommerce в теме Storefront.

Допустим мы хотим скрыть / удалить колонку «Цена», сразу же можно пойти двумя путями – если вы уже заменили шаблон корзины в своей теме, то конечно не нужно ничего придумывать, открываем заменённый файл cart/cart.php и удаляем спокойно ненужные колонки.

Но производить замену шаблона WooCommerce только ради удаления колонки – очень странно, поэтому, если вы используете оригинальный шаблон корзины, то лучше всего удалить колонку при помощи CSS. Для этого нам нужно определиться с селекторами, чтобы это сделать, надо открыть страницу Корзины и проинспектировать её в браузере.

инспектируем корзину в браузере

Из скриншота видно, что колонка, которую мы хотим удалить имеет класс .product-price, такой же класс и у ячейки в таблице.

.woocommerce .product-price{
	display:none;
}

Как бы это всё. Результат:

Удаляем колонку с ценой из корзины WooCommerce
На этом скриншоте мы удалили колонку «Цена».

Миша

В последние годы я долго не знал, что мне делать с сайтом misha.blog, ведь он практически не приносит никакого профита, но недавно я осознал, что моя миссия – способствовать распространению WordPress. Ведь WordPress – это лучший движок для разработки сайтов – как для тех, кто готов использовать заложенную структуру этой CMS, так и для тех, кто предпочитает headless решения.

Сам же я впервые познакомился с WordPress в 2009 году. Организатор WordCamp. Преподаватель в школах Epic Skills и LoftSchool.

Если вам нужна помощь с вашим сайтом или может даже разработка с нуля на WordPress / WooCommerce — пишите. Я и моя команда сделаем вам всё на лучшем уровне.

Оставить комментарий

Если вы хотите добавить код, не забудьте обернуть его в <pre lang="php"></pre>, если же код – меньше одной строчки, то можно и в <code></code>.