• Вопрос без рабочей ссылки на проблему считается риторическим. Без ссылки и скриншота - провокацией!
  • Темы озаглавленные с маленькой буквы или капсом удаляются без предупреждения!

Другой вид Вариативного товара

c0zzy

Новичок
Возможно ли реализовать свой вид вариативного товара за странице заказа. Стандартный вид выбора вариантов не радует глаз.. Может плагин какой есть или можно css отдектировать..
 

Mishka48

Опытный
Команда форума
Местный
На странице ЗАКАЗА или на странице ТОВАРА ? Если можно скриншот в студию или ссылку на сайт. Хорошо бы еще название темы узнать, а также увидеть пример какой вид вариантов Вам "радует глаз" .
 

c0zzy

Новичок
На странице ЗАКАЗА или на странице ТОВАРА ? Если можно скриншот в студию или ссылку на сайт. Хорошо бы еще название темы узнать, а также увидеть пример какой вид вариантов Вам "радует глаз" .
На странице товара, простите :) Тема Hudson, но такое можно наблюдать на многих других темах, думается, что это woocommerce выглядит, а не тема..
На скриншоте кривенько обозначил что не устраивает. Поменять бы на что-то похожее на выбор количества товара
 

Вложения

D&B

Администратор
Команда форума
Местный
Не понятно, что именно не радует Ваш глаз
а так бы мне хотелось видеть это окошко выбора
Ну так добавьте еще варианты цвета как в вашем примере. Что касается визуализации кнопок и элементов - это зависит от темы, если она конечно заточена под WooCommerce. В стандартных темах и элементы выглядят соответственно, примерно одинаково.
 
Последнее редактирование:

D&B

Администратор
Команда форума
Местный
А каким образом можно заточить внешний вид так, как хотелось бы? И реально ли вообще?
Конечно реально. И ничего точить не надо. Для этого и существуют темы. Найдите себе ту которая бы устроила.
 

D&B

Администратор
Команда форума
Местный
Не надо искать выход там где он уже давно есть и не один. Впрочем, если Вам так уж хочется по сложному пути - берете текстовый редактор, фотошоп и вперед.
 

Mishka48

Опытный
Команда форума
Местный
вот это css кнопки соответствующий внешнему стилю гудзона - примени его к кнопке вариативного товара:
Код:
.woocommerce a.button, .woocommerce-page a.button, .woocommerce button.button, .woocommerce-page button.button, .woocommerce input.button, .woocommerce-page input.button, .woocommerce #respond input#submit, .woocommerce-page #respond input#submit, .woocommerce #content input.button, .woocommerce-page #content input.button {
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    -moz-text-decoration-color: -moz-use-text-color;
    -moz-text-decoration-line: none;
    -moz-text-decoration-style: solid;
    background-attachment: scroll;
    background-clip: border-box;
    background-color: rgba(0, 0, 0, 0);
    background-image: -moz-linear-gradient(center top , #F7F6F7 0px, #E0DADF 100%);
    background-origin: padding-box;
    background-position: 0 0;
    background-repeat: repeat;
    background-size: auto auto;
    border-bottom-color: #C8BFC6;
    border-bottom-left-radius: 2px;
    border-bottom-right-radius: 2px;
    border-bottom-style: solid;
    border-bottom-width: 1px;
    border-image-outset: 0 0 0 0;
    border-image-repeat: stretch stretch;
    border-image-slice: 100% 100% 100% 100%;
    border-image-source: none;
    border-image-width: 1 1 1 1;
    border-left-color-ltr-source: physical;
    border-left-color-rtl-source: physical;
    border-left-color-value: #C8BFC6;
    border-left-style-ltr-source: physical;
    border-left-style-rtl-source: physical;
    border-left-style-value: solid;
    border-left-width-ltr-source: physical;
    border-left-width-rtl-source: physical;
    border-left-width-value: 1px;
    border-right-color-ltr-source: physical;
    border-right-color-rtl-source: physical;
    border-right-color-value: #C8BFC6;
    border-right-style-ltr-source: physical;
    border-right-style-rtl-source: physical;
    border-right-style-value: solid;
    border-right-width-ltr-source: physical;
    border-right-width-rtl-source: physical;
    border-right-width-value: 1px;
    border-top-color: #C8BFC6;
    border-top-left-radius: 2px;
    border-top-right-radius: 2px;
    border-top-style: solid;
    border-top-width: 1px;
    box-shadow: 0 -1px 0 rgba(0, 0, 0, 0.075) inset, 0 1px 0 rgba(255, 255, 255, 0.3) inset, 0 1px 2px rgba(0, 0, 0, 0.1);
    color: #5E5E5E;
    cursor: pointer;
    display: inline-block;
    font-family: inherit;
    font-size: 100%;
    font-weight: bold;
    left: auto;
    line-height: 1em;
    margin-bottom: 0;
    margin-left: 0;
    margin-right: 0;
    margin-top: 0;
    overflow-x: visible;
    overflow-y: visible;
    padding-bottom: 6px;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 6px;
    position: relative;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.8);
    white-space: nowrap;
}
А начинать как-то надо, а то не закончишь никогда
 
Сверху Снизу