Плагин "Картинки как на Али" тема "Купить просто"(Buysimply)

1. В бекенде «Сайт» → «Структура» → «Магазин. Настройки» → добавить код с идентификаторами нужных характеристик товара.

Например:
featureButton=size,tttt,color,top_material, sole_material, tsvet, khar1,khar2,khar3,khar4

Сохраните изменения.

2. В приложении «Магазин» создать файл под названием alaali.css в разделе «Витрина» во вкладке «Шаблоны» с кодом:

.feature-btn.alaali{ 
  padding: 1px; 
} 
.options-item img.alaali{ 
  border-radius: 3px; 
  vertical-align: middle; 
  height:29px; 
  width: 29px; 
} 
.options-item.color span.alaali{ 
  margin-bottom: 20px; 
  height: auto; 
  width: auto; 
} 
.alaali_img2{ 
  border: 1px solid rgba(0,0,0,0.2); 
  margin: 0.2em 0.25em 0 0; 
  vertical-align: top; 
  height: 15px; 
  width: 15px; 
}

3. Отредактируйте файл head.html:

Найдите код (3 последние строки в файле)

<!-- plugin hook: 'frontend_head' -->
{* @event frontend_head.%plugin_id% *}
{foreach $frontend_head as $_}{$_}{/foreach}

Добавьте перед ними код

<link rel="stylesheet" href="{$wa_active_theme_url}alaali.css?v{$wa_theme_version}">

Сохраните изменения.

4. Отредактируйте файл product.cart.html:

В файле product.cart.html найдите блок кода

<!-- SELECTABLE FEATURES selling mode -->
{$default_sku_features = $product.sku_features}
{$product_available = $product.status}
<div class="selectable-articul">
    {foreach $product.skus as $sku}
    {if $sku.sku || !empty($theme_settings.noSku)}
        <div style="margin-bottom: 10px;{if $sku.id != $product.sku_id} display:none;{/if}" class="sku-{$sku.id}-articul">
        [`Article`]: <span class="hint">{if $sku.sku}{$sku.sku}{else}{$theme_settings.noSku}{/if}</span>
        </div>
    {/if}
    {/foreach}
</div>
<div class="options">
{$featureButton = $wa->globals("featureButton")}
{foreach $features_selectable as $f}
    <div class="options-item{if $f.type == 'color'} color{/if}">
        {$f.name}:
        {if strpos($featureButton, $f.code) !== false}
            {foreach $f.values as $v_id => $v}
                <span data-value-id="{$v_id}" class="feature-btn{if $v_id == ifset($default_sku_features[$f.id])} selected{/if}"{if $f.type == 'color'} style="{$v->style}; margin-bottom: 20px; margin-top: -5px;"{/if}>
                    {if $f.type == 'color'}<span class="color_name">{strip_tags($v)}</span>{else}{$v}{/if}
                </span>
            {/foreach}
        {/if}
        <select data-feature-id="{$f.id}" class="sku-feature{if strpos($featureButton, $f.code) !== false} invisible{/if}" name="features[{$f.id}]">
            {foreach $f.values as $v_id => $v}
                <option value="{$v_id}" {if $v_id == ifset($default_sku_features[$f.id])}selected{/if}>{$v}</option>
            {/foreach}
        </select>
    </div>
{/foreach}
</div>

Замените его на код

<!-- SELECTABLE FEATURES selling mode -->
{$default_sku_features = $product.sku_features}
{$product_available = $product.status}
{$feature_images = shopAlaaliHelper::getFeaturesImg($product.id)}
<div class="selectable-articul">
    {foreach $product.skus as $sku}
        {if $sku.sku || !empty($theme_settings.noSku)}
            <div style="margin-bottom: 10px;{if $sku.id != $product.sku_id} display:none;{/if}" class="sku-{$sku.id}-articul">
            [`Article`]: <span class="hint">{if $sku.sku}{$sku.sku}{else}{$theme_settings.noSku}{/if}</span>
            </div>
        {/if}
{/foreach}
</div>
<div class="options">
{$featureButton = $wa->globals("featureButton")}
{foreach $features_selectable as $f}
    <div class="options-item{if $f.type == 'color'} color{/if}">
    {$f.name}:
    {if strpos($featureButton, $f.code) !== false}
        {foreach $f.values as $v_id => $v}
            {if in_array($v_id,$feature_images[$f.id]['id'])}
                {$v_img = "<img src='"|cat:$feature_images[$f.id]['img'][$v_id]|cat:"' title='"|cat:$feature_images[$f.id]['value'][$v_id]|cat:"' class='alaali'>"}
            {/if}
            {if in_array($v_id,$feature_images[$f.id]['id'])}
                <span data-value-id="{$v_id}" class="alaali feature-btn{if $v_id == ifset($default_sku_features[$f.id])} selected{/if}">{$v_img}
                {if $f.type == 'color'}
                    {*Название цвета под картинкой*}
                    <span class="color_name">{strip_tags($v)}</span>
                    {*/название цвета под картинкой*}
                {/if}
                </span>
            {else}
                <span data-value-id="{$v_id}" class="feature-btn{if $v_id == ifset($default_sku_features[$f.id])} selected{/if}"{if $f.type == 'color'} style="{$v->style};"{/if}>
                    {if $f.type == 'color'}
                        <span class="color_name">{strip_tags($v)}</span>
                    {else}
                        {$v}
                    {/if}
                </span>
            {/if}
        {/foreach}
    {/if}
    <select data-feature-id="{$f.id}" class="sku-feature{if strpos($featureButton, $f.code) !== false} invisible{/if}" name="features[{$f.id}]">
        {foreach $f.values as $v_id => $v}
            <option value="{$v_id}" {if $v_id == ifset($default_sku_features[$f.id])}selected{/if}>{$v}</option>
        {/foreach}
    </select>
    </div>
{/foreach}
</div>

5. Отредактируйте файл product.html:

Найдите код

{if empty($theme_settings.locateFeatures)}
    {if $product.features}
        <!-- product features -->
        <div class="tab-name-print"><h2>[`Features`]</h2></div>
        <div id="tab2" class="tab-content">
            <table class="features" id="product-features">
                {foreach $product.features as $f_code => $f_value}
                    <tr{if $features[$f_code].type == 'divider'} class="divider"{/if}>
                        <td class="name">{$features[$f_code].name|escape}</td>
                        <td class="value" itemprop="{$f_code|escape}">
                            {if is_array($f_value)}
                                {if $features[$f_code].type == 'color'}
                                    {implode('<br /> ', $f_value)}
                                {else}
                                    {implode(', ', $f_value)}
                                {/if}
                            {else}
                                {$f_value}
                            {/if}
                        </td>
                    </tr>
                {/foreach}
            </table>
        </div>
    {/if}
{/if}

Замените его на код

{if empty($theme_settings.locateFeatures)}
    {if $product.features}
        <!-- product features -->
        {$feature_images = shopAlaaliHelper::getFeaturesImg_code($product.id,false)}
        <div class="tab-name-print"><h2>[`Features`]</h2></div>
        <div id="tab2" class="tab-content">
            <table class="features" id="product-features">
                {foreach $product.features as $f_code => $f_value}
                    <tr{if $features[$f_code].type == 'divider'} class="divider"{/if}>
                        <td class="name">{$features[$f_code].name|escape}</td>
                        <td class="value" itemprop="{$f_code|escape}">
                            {if is_array($f_value)}
                                {if $features[$f_code].type == 'color'}
                                    {foreach $f_value as $v_id => $value}
                                        {if in_array($v_id,$feature_images[$f_code]['id'])}
                                            {$v_img = "<img src='"|cat:$feature_images[$f_code]['img'][$v_id]|cat:"' title='"|cat:$feature_images[$f_code]['value'][$v_id]|cat:"' class='alaali_img2' >"}
                                            {$v_img}{$feature_images[$f_code]['value'][$v_id]}<br />
                                        {else}
                                            {$value}<br />
                                        {/if}
                                    {/foreach}
                                {else}
                                    {foreach $f_value as $v_id => $value}
                                        {if in_array($v_id,$feature_images[$f_code]['id'])}
                                            {$v_img = "<img src='"|cat:$feature_images[$f_code]['img'][$v_id]|cat:"' title='"|cat:$feature_images[$f_code]['value'][$v_id]|cat:"' class='alaali_img2' >"}
                                            {$v_img}<span>{$feature_images[$f_code]['value'][$v_id]}</span><br />
                                        {else}
                                            {$value|escape}<br />
                                        {/if}
                                    {/foreach}
                                {/if}
                            {else}
                                {assign var=v_id value=$f_value}
                                {if in_array($v_id,$feature_images[$f_code]['id']) || in_array($v_id,$feature_images[$f_code]['value'])}
                                    {$v_img = "<img src='"|cat:$feature_images[$f_code]['img'][$v_id]|cat:"' title='"|cat:$feature_images[$f_code]['value'][$v_id]|cat:"' class='alaali_img2' >"}
                                    {$v_img}<br />
                                {else}
                                    {$f_value|escape}<br />
                                {/if}
                            {/if}
                        </td>
                    </tr>
                {/foreach}
            </table>
        </div>
    {/if}
{/if}

Опубликовано: 15 февраля 2017

Николай Иванов СТЭК

alaali, buysimply, купить просто

Эта статья была полезна? Да Нет

ИТ-компания СТЭК

Плагин "Картинки как на Али" тема "Купить просто"(Buysimply)

0 комментариев

Добавить комментарий