Jump to content
Search In
  • More options...
Find results that contain...
Find results in...

Выбор цвета и оттенка


Recommended Posts

Доброго всем времени суток.

У меня магазин строительных материалов. В продаже есть краски у которых около 150 оттенков. Скажите есть ли какаято возможность выводить опции цвета как то в отдельном модальном окне или хотябы убрать названия опций на странице товара но они должны отображаться в корзине

Или может ктото знает уже готовое решение?

Заранее всем спасибо

Link to comment
Share on other sites


Доброго всем времени суток.

У меня магазин строительных материалов. В продаже есть краски у которых около 150 оттенков. Скажите есть ли какаято возможность выводить опции цвета как то в отдельном модальном окне или хотябы убрать названия опций на странице товара но они должны отображаться в корзине

Или может ктото знает уже готовое решение?

Заранее всем спасибо

Можно сделать опции не радиокнопками, а разноцветным выпадающим списком. Мало места занимает.
Link to comment
Share on other sites

Дело в том что у меня не просто цвет, а картинка с с фактурой и она скорее всего не будет работать в выпадающем списке. Я конечно могу ошибаться но только что попробовал по вашему совету. Не получилось выпадает только список с названиями оттенков и все.

Link to comment
Share on other sites


Дело в том что у меня не просто цвет, а картинка с с фактурой и она скорее всего не будет работать в выпадающем списке. Я конечно могу ошибаться но только что попробовал по вашему совету. Не получилось выпадает только список с названиями оттенков и все.

Дело в том что у меня не просто цвет, а картинка с с фактурой и она скорее всего не будет работать в выпадающем списке. Я конечно могу ошибаться но только что попробовал по вашему совету. Не получилось выпадает только список с названиями оттенков и все.

видно я немного туповат(или не немного) не смог всунуть скрин.

кидаю ссылку (не сочтите за рекламу плз)

Link to comment
Share on other sites


  • 5 years later...

Да кстати тоже назрел этот вопрос, раньше не сталкивался, но сейчас есть товар в котором допустим 25-50 опций изображениями, как вывести их списком (с изображениями естественно)? А то иначе большая портянка получается в карточке товара.

Я так понимаю, что где-то в product.tpl в районе строки <?php if ($option['type'] == 'image') { ?> ляляля

нужно заменить этот класс <div class="radio"> или добавить какой то див ещё, но так и не понял

(пробовал подпихивать туда классы из формы <?php if ($option['type'] == 'select') { ?> - не получилось)

так же пробовал делать изображения опций каруселью с добавлением скрипта - тоже не пошло)))

Камрады подскажите плиз!!!

Link to comment
Share on other sites


Возможно Вас заинтересует модуль

 

Link to comment
Share on other sites

  • 3 weeks later...
В 09.02.2018 в 18:57, Leingard сказал:

Возможно Вас заинтересует модуль

 

Спасибо. Нет, просто нужен выпадающий список цветов с изображениями

Link to comment
Share on other sites


27 minutes ago, vadim said:

Спасибо. Нет, просто нужен выпадающий список цветов с изображениями

Посмотрите ето:

https://codecanyon.net/item/fabric-choice/19929544

 

разработчик  @MaDMaxX111

Link to comment
Share on other sites

Нашел пока что решение сделать опции изображений каруселью. Делал на шаблоне Royal, но подойдет и на стандартном.

Если кому надо выкладываю решение:

в  product.tpl  в блоке отвечающем за вывод опций изображениями (начинается с <?php if ($option['type'] == 'image') { ?>)

Добавляем ниже строки <div id="input-option<?php echo $option['product_option_id']; ?>">

два дива 

<div class="padding-carusel row">
 <div class="image-option owl-carousel">

и замыкаем их после <?php } ?> 

</div>
</div>

внизу файла до строки <?php echo $footer; ?>

вставляем 

<script type="text/javascript"><!--
$('.image-option').owlCarousel({
	items : 6,
	itemsCustom : false,
	itemsDesktop : [1199,5],
	itemsDesktopSmall : [980,4],
    itemsTablet: [768,4],
	itemsMobile : [479,2],
navigation: true,
navigationText: ['<i class="fa fa-chevron-left fa-5x"></i>', '<i class="fa fa-chevron-right fa-5x"></i>'],
pagination: false,
paginationSpeed: 300,
slideSpeed: 200,
stop_img_imgOnHover: true,
autoPlay: true,
});
//--></script>

Значения itemsDesktop : [1199,5], и т.д (количество картинок в ряд) выставляете свои

Должно получиться  так

	<?php if ($option['type'] == 'image') { ?>
			<div class="form-group<?php echo ($option['required'] ? ' required' : ''); ?>">
			<label class="control-label"><?php echo $option['name']; ?></label>
			<div id="input-option<?php echo $option['product_option_id']; ?>">
			<div class="padding-carusel row">
			<div class="image-option owl-carousel">
			<?php foreach ($option['product_option_value'] as $option_value) { ?>			
				<div class="radio" style="display: inline-block; text-align: center;">
				<label>
				<input style="margin-left:0px;"  type="radio" name="option[<?php echo $option['product_option_id']; ?>]" value="<?php echo $option_value['product_option_value_id']; ?>" />
				<a href="<?php echo $option_value['popup']; ?>" title="<?php echo $option_value['name'] . ($option_value['price'] ? ' ' . $option_value['price_prefix'] . $option_value['price'] : ''); ?>" class="imgpopcat">
				<img src="<?php echo $option_value['image']; ?>" alt="<?php echo $option_value['name'] . ($option_value['price'] ? ' ' . $option_value['price_prefix'] . $option_value['price'] : ''); ?>" class="img-thumbnail" /> <br><?php echo $option_value['name']; ?></a>
				<?php if ($option_value['price']) { ?>
					<?php echo $option_value['price_prefix']; ?><?php echo $option_value['price']; ?>
					<?php } ?>
				</label>
				</div>				
				<?php } ?>
				</div>
				</div>
			</div>
			</div>
			<?php } ?>

Вуаля, карусель работает!

Edited by vadim
Link to comment
Share on other sites


Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...

Important Information

On our site, cookies are used and personal data is processed to improve the user interface. To find out what and what personal data we are processing, please go to the link. If you click "I agree," it means that you understand and accept all the conditions specified in this Privacy Notice.