Перейти к содержанию
Официальный форум поддержки Simpla

Накладываем Изображения "хит Продаж", "скидка", "новинка"


Перейти к решению Решено Maksclub,

Рекомендуемые сообщения

Здравствуйте! Нужна помощь в доработке модуля: Накладываем изображения "Хит продаж", "Скидка", "Новинка" который для OkayCMS

 

В файл \design\default_lite_1\html\tiny_products.tpl (учтите название вашего шаблона) дописываем в низу код:

 

<div class="metki">
   {if $product->featured}
      <div style="background: #f17a3c;">ХИТ</div>
   {/if}
   {if $product->variant->compare_price}
      <div style="background: #f24941;">АКЦИЯ</div>
   {/if}
   {if $product->created|date_format:'%Y-%m-%d' > "-30 days"|date_format:'%Y-%m-%d'}
      <div style="background: #57bac7;">НОВЫЙ</div>
   {/if}
</div>

В шаблоне подключаем стиль:

 

<style>
.metki {
    position: absolute;
    top: 8%;
    left: 16px;
    z-index: 1;
}
.metki div + div {
    margin-top: 2px;
}
.metki div {
    text-align: center;
    color: #fff;
    font-size: 15px;
    font-weight: 400;
    padding: 0 10px 0 5px;
    width: 75px;
    clip-path: polygon(0% 0%, 88% 0%, 100% 50%, 88% 100%, 0% 100%);
    -webkit-clip-path: polygon(0% 0%, 88% 0%, 100% 50%, 88% 100%, 0% 100%);
}
</style>

Вывод метки со скидкой в процентах:
Заменяем строку <div style="background: #f24941;">АКЦИЯ</div>

 

{if $product->variant->compare_price > $product->variant->price}
      <div style="background: #f24941;">-{100-($product->variant->price/$product->variant->compare_price*100)|string_format:"%d"}%</div>
{/if}

Хотелось бы адаптировать его под Simpla CMS, кто может помочь ?

Изменено пользователем Axotn1k
Ссылка на сообщение
Поделиться на другие сайты

У меня нету tiny_products.tpl  тольк  products.tpl

 

Вставив туда код в самый низ этот:

 

<div class="metki">
   {if $product->featured}
      <div style="background: #f17a3c;">ХИТ</div>
   {/if}
   {if $product->variant->compare_price}
      <div style="background: #f24941;">АКЦИЯ</div>
   {/if}
   {if $product->created|date_format:'%Y-%m-%d' > "-30 days"|date_format:'%Y-%m-%d'}
      <div style="background: #57bac7;">НОВЫЙ</div>
   {/if}
</div>

а так же прописав стили, ничего не происходит. 

Так же не понятно, куда пихать это 

 

 

Вывод метки со скидкой в процентах:
Заменяем строку <div style="background: #f24941;">АКЦИЯ</div>

 

{if $product->variant->compare_price > $product->variant->price}
<div style="background: #f24941;">-{100-($product->variant->price/$product->variant->compare_price*100)|string_format:"%d"}%</div>
{/if}
Изменено пользователем Axotn1k
Ссылка на сообщение
Поделиться на другие сайты

Этот код нужно вставлять в код вывода КАЖДОГО товара, а не где-то сбоку :)

Если вы вообще не разбираетесь - обращайтесь к фрилансерам.

Ссылка на сообщение
Поделиться на другие сайты

Этот код нужно вставлять в код вывода КАЖДОГО товара, а не где-то сбоку :)

Если вы вообще не разбираетесь - обращайтесь к фрилансерам.

Ну я поставил много модулей сам, объясните пожалуйста что значит в вывод каждого товара ? Может я туплю

Ссылка на сообщение
Поделиться на другие сайты

{foreach}{/foreach} - в курсе, что это такое?

Да, массив который заставляет делать что-то в этом цикле

Ссылка на сообщение
Поделиться на другие сайты

Для дефолтного шаблона я бы вставил так

{foreach $products as $product}
	<!-- Товар-->
	<li class="product">
		
		<!-- Фото товара -->
		{if $product->image}
		<div class="image">
       
                {* НАПРИМЕР ВОТ СЮДА  *}


			<a href="products/{$product->url}"><img src="{$product->image->filename|resize:200:200}" alt="{$product->name|escape}"/></a>
		</div>
		{/if}
		<!-- Фото товара (The End) -->

		<div class="product_info">
		<!-- Название товара -->
		<h3 class="{if $product->featured}featured{/if}"><a data-product="{$product->id}" href="products/{$product->url}">{$product->name|escape}</a></h3>
		<!-- Название товара (The End) -->

		<!-- Описание товара -->
		<div class="annotation">{$product->annotation}</div>
		<!-- Описание товара (The End) -->
		
		{if $product->variants|count > 0}
		<!-- Выбор варианта товара -->
		<form class="variants" action="/cart">
			<table>
			{foreach $product->variants as $v}
			<tr class="variant">
				<td>
					<input id="variants_{$v->id}" name="variant" value="{$v->id}" type="radio" class="variant_radiobutton" {if $v@first}checked{/if} {if $product->variants|count<2}style="display:none;"{/if}/>
				</td>
				<td>
					{if $v->name}<label class="variant_name" for="variants_{$v->id}">{$v->name}</label>{/if}
				</td>
				<td>
					{if $v->compare_price > 0}<span class="compare_price">{$v->compare_price|convert}</span>{/if}
					<span class="price">{$v->price|convert} <span class="currency">{$currency->sign|escape}</span></span>
				</td>
			</tr>
			{/foreach}
			</table>
			<input type="submit" class="button" value="в корзину" data-result-text="добавлено"/>
		</form>
		<!-- Выбор варианта товара (The End) -->
		{else}
			Нет в наличии
		{/if}

		</div>
		
	</li>
	<!-- Товар (The End)-->
	{/foreach}
Ссылка на сообщение
Поделиться на другие сайты

Так и сделал, ефекта ноль

<style>
.metki {
    position: absolute;
    top: 8%;
    left: 16px;
    z-index: 1;
}
.metki div + div {
    margin-top: 2px;
}
.metki div {
    text-align: center;
    color: #fff;
    font-size: 15px;
    font-weight: 400;
    padding: 0 10px 0 5px;
    width: 75px;
    clip-path: polygon(0% 0%, 88% 0%, 100% 50%, 88% 100%, 0% 100%);
    -webkit-clip-path: polygon(0% 0%, 88% 0%, 100% 50%, 88% 100%, 0% 100%);
}
</style>

{* Список товаров *}

{* Канонический адрес страницы *}
{if $category && $brand}
{$canonical="/catalog/{$category->url}/{$brand->url}" scope=parent}
{elseif $category}
{$canonical="/catalog/{$category->url}" scope=parent}
{elseif $brand}
{$canonical="/brands/{$brand->url}" scope=parent}
{elseif $keyword}
{$canonical="/products?keyword={$keyword|escape}" scope=parent}
{else}
{$canonical="/products" scope=parent}
{/if}

<!-- Хлебные крошки /-->
<div id="path">
	<a href="/">Главная</a>
	{if $category}
	{foreach $category->path as $cat}
	→ <a href="catalog/{$cat->url}">{$cat->name|escape}</a>
	{/foreach}  
	{if $brand}
	→ <a href="catalog/{$cat->url}/{$brand->url}">{$brand->name|escape}</a>
	{/if}
	{elseif $brand}
	→ <a href="brands/{$brand->url}">{$brand->name|escape}</a>
	{elseif $keyword}
	→ Поиск
	{/if}
</div>
<!-- Хлебные крошки #End /-->

{* Заголовок страницы *}
{if $keyword}
<h1>Поиск {$keyword|escape}</h1>
{elseif $page}
<h1>{$page->name|escape}</h1>
{else}
<h1>{$category->name|escape} {$brand->name|escape}</h1>
{/if}


{* Описание страницы (если задана) *}
{$page->body}

{if $current_page_num==1}
{* Описание категории *}
{$category->description}
{/if}

{* Фильтр по брендам *}
{if $category->brands}
<div id="brands">
	<a href="catalog/{$category->url}" {if !$brand->id}class="selected"{/if}>Все бренды</a>
	{foreach $category->brands as $b}
		{if $b->image}
		<a data-brand="{$b->id}" href="catalog/{$category->url}/{$b->url}"><img src="{$config->brands_images_dir}{$b->image}" alt="{$b->name|escape}"></a>
		{else}
		<a data-brand="{$b->id}" href="catalog/{$category->url}/{$b->url}" {if $b->id == $brand->id}class="selected"{/if}>{$b->name|escape}</a>
		{/if}
	{/foreach}
</div>
{/if}

{if $current_page_num==1}
{* Описание бренда *}
{$brand->description}
{/if}

{* Фильтр по свойствам *}
{if $features}
<table id="features">
	{foreach $features as $key=>$f}
	<tr>
	<td class="feature_name" data-feature="{$f->id}">
		{$f->name}:
	</td>
	<td class="feature_values">
		<a href="{url params=[$f->id=>null, page=>null]}" {if !$smarty.get.$key}class="selected"{/if}>Все</a>
		{foreach $f->options as $o}
		<a href="{url params=[$f->id=>$o->value, page=>null]}" {if $smarty.get.$key == $o->value}class="selected"{/if}>{$o->value|escape}</a>
		{/foreach}
	</td>
	</tr>
	{/foreach}
</table>
{/if}


<!--Каталог товаров-->
{if $products}

{* Сортировка *}
{if $products|count>0}
<div class="sort">
	Сортировать по 
	<a {if $sort=='position'} class="selected"{/if} href="{url sort=position page=null}">умолчанию</a>
	<a {if $sort=='price'}    class="selected"{/if} href="{url sort=price page=null}">цене</a>
	<a {if $sort=='name'}     class="selected"{/if} href="{url sort=name page=null}">названию</a>
</div>
{/if}


{include file='pagination.tpl'}


<!-- Список товаров-->
<ul class="products">

	{foreach $products as $product}
	<!-- Товар-->
	<li class="product">
		
		<!-- Фото товара -->
		{if $product->image}
		<div class="image">

		{if $product->variant->compare_price > $product->variant->price}
<div style="background: #f24941;">-{100-($product->variant->price/$product->variant->compare_price*100)|string_format:"%d"}%</div>
{/if}
	
			<a href="products/{$product->url}"><img src="{$product->image->filename|resize:200:200}" alt="{$product->name|escape}"/></a>
		</div>
		{/if}
		<!-- Фото товара (The End) -->

		<div class="product_info">
		<!-- Название товара -->
		<h3 class="{if $product->featured}featured{/if}"><a data-product="{$product->id}" href="products/{$product->url}">{$product->name|escape}</a></h3>
		<!-- Название товара (The End) -->

		<!-- Описание товара -->
		<div class="annotation">{$product->annotation}</div>
		<!-- Описание товара (The End) -->
		
		{if $product->variants|count > 0}
		<!-- Выбор варианта товара -->
		<form class="variants" action="/cart">
			<table>
			{foreach $product->variants as $v}
			<tr class="variant">
				<td>
					<input id="variants_{$v->id}" name="variant" value="{$v->id}" type="radio" class="variant_radiobutton" {if $v@first}checked{/if} {if $product->variants|count<2}style="display:none;"{/if}/>
				</td>
				<td>
					{if $v->name}<label class="variant_name" for="variants_{$v->id}">{$v->name}</label>{/if}
				</td>
				<td>
					{if $v->compare_price > 0}<span class="compare_price">{$v->compare_price|convert}</span>{/if}
					<span class="price">{$v->price|convert} <span class="currency">{$currency->sign|escape}</span></span>
				</td>
			</tr>
			{/foreach}
			</table>
			<input type="submit" class="button" value="в корзину" data-result-text="добавлено"/>
		</form>
		<!-- Выбор варианта товара (The End) -->
		{else}
			Нет в наличии
		{/if}

		</div>
		
	</li>
	<!-- Товар (The End)-->
	{/foreach}
			
</ul>

{include file='pagination.tpl'}	
<!-- Список товаров (The End)-->

{else}
Товары не найдены
{/if}
<!--Каталог товаров (The End)-->
       
 <div class="metki">
{if $product->featured}
<div style="background: #f17a3c;">ХИТ</div>
{/if}
{if $product->variant->compare_price}
<div style="background: #f24941;">АКЦИЯ</div>
{/if}
{if $product->created|date_format:'%Y-%m-%d' > "-30 days"|date_format:'%Y-%m-%d'}
<div style="background: #57bac7;">НОВЫЙ</div>
{/if}
</div>
    

 

 

 

Изменено пользователем Axotn1k
Ссылка на сообщение
Поделиться на другие сайты

Ты реально дебил? Или как?

Ты понимаешь, что такое ЦИКЛ??? Ты видишь, что я написал?

В конце файла - это ДО ЖОПЫ...

   {* НАПРИМЕР ВОТ СЮДА  *}

Код надо вставлять ВНУТРИ ЦИКЛА!

ВНУТРИ, КАРЛ!!!

Как еще тебе обьяснить???

Ссылка на сообщение
Поделиться на другие сайты
  • Решение

 

Так и сделал, ефекта ноль

<style>
.metki 

 

 

теги <style> не вноси в шаблон, либо оберни тегом {literal}? но лучше убери и внеси все что внутри тега в файл /css/style.css

 

а код

 <div class="metki">
{if $product->featured}
<div style="background: #f17a3c;">ХИТ</div>
{/if}
{if $product->variant->compare_price}
<div style="background: #f24941;">АКЦИЯ</div>
{/if}
{if $product->created|date_format:'%Y-%m-%d' > "-30 days"|date_format:'%Y-%m-%d'}
<div style="background: #57bac7;">НОВЫЙ</div>
{/if}
</div>

внеси после строк

{foreach $products as $product}
	<!-- Товар-->
	<li class="product">

 

чтобы получилось так:

{foreach $products as $product}
	<!-- Товар-->
	<li class="product">

 <div class="metki">
{if $product->featured}
<div style="background: #f17a3c;">ХИТ</div>
{/if}
{if $product->variant->compare_price}
<div style="background: #f24941;">АКЦИЯ</div>
{/if}
{if $product->created|date_format:'%Y-%m-%d' > "-30 days"|date_format:'%Y-%m-%d'}
<div style="background: #57bac7;">НОВЫЙ</div>
{/if}
</div>
Ссылка на сообщение
Поделиться на другие сайты

Да, простите тупил! Все верно работает как написал Maksclub, только изображение по его примеру не накладываюься на само изображения, и сверху. Поэтому я писал что код не корректно работает

Ссылка на сообщение
Поделиться на другие сайты

Присоединяйтесь к обсуждению

Вы можете написать сейчас и зарегистрироваться позже. Если у вас есть аккаунт, авторизуйтесь, чтобы опубликовать от имени своего аккаунта.

Гость
Ответить в этой теме...

×   Вставлено с форматированием.   Вставить как обычный текст

  Разрешено использовать не более 75 эмодзи.

×   Ваша ссылка была автоматически встроена.   Отображать как обычную ссылку

×   Ваш предыдущий контент был восстановлен.   Очистить редактор

×   Вы не можете вставлять изображения напрямую. Загружайте или вставляйте изображения по ссылке.

Загрузка...
×
×
  • Создать...