Documentación

INSTALACIÓN DE UN TEMA

Solamente es posible instalar un paquete de tema bajando y editando uno ya existente. En el siguiente ejemplo, se usó como base el tema Minimalista.

Indice

Elementos básicos de una tienda virtual Elementos comunes del encabezado (header) Elementos comunes del pie de página (footer) Elementos comunes de la página principal (home)

ELEMENTOS BÁSICOS DE UNA TIENDA VIRTUAL

La estructura básica de tema de Mercado Shops permite la modificación, vía HTML, de tres partes de la tienda virtual: el encabezado o header (header.html) y el pie de página o footer (footer.html), que estarán presentes en todas las páginas, y la página principal o home (home.html).

ELEMENTOS COMUNES DEL ENCABEZADO (HEADER)

El header es el encabezado de la tienda virtual y estará presente en la página principal, las páginas de categorías, la página de productos, las páginas de resultados de búsqueda y el carrito.

LOGO (uso de la variable $hasLogo)

En el administrador de Mercado Shops, se debe insertar el logo de la tienda.

Administrador > Mi sitio web > Diseño > Encabezado

Ese logo será accedido por la variable $hasLogo en las páginas editables y en las páginas de checkout. La forma de uso de esa variable puede ser:

#if( $hasLogo )
  <figure class="component img-logo">
    <a href="/" title="Inicio">
      <img src="/images/logo.jpg?" alt="loja" title=”loja" />
    </a>
  </figure>
#else
  <div class="component txt-logo">
    <a href="/" title="Inicio" class="logo">loja</a>
  </div>
#end

En caso de que no se haya registrado ningún logo, Mercado Shops mostrará el nombre de la tienda configurado en:

Mi sitio web > Preferencias > Nombre de tu sitio

Aunque un logo sea cargado como una imagen en el paquete de archivos, es importante que se registre un logo. Ese logo también será usado en las páginas de checkout de la plataforma.

CARRITO (uso de la variable $shopHasCart)

Esa variable es el botón que exhibe el carrito. Se puede usar de esta forma:

#if( $shopHasCart )
  <div id="cart" class="component cartButton">
    <span id="mini-cart-container" class="bg-cart">
      <a href="/cart" title="Ver carrinho" rel="nofollow" class="ch-btn chsecondary button">Ver carrinho</a>
    </span>
  </div>
#end
MENU INSTITUCIONAL (uso de la variable $menuItem y $menuItemList

Las variables $menuItem y $menuItemList están relacionadas a los ítems del menú institucional, por ejemplos en las páginas: Quienes Somos, Pago, Contacto, etc.

Para listar las páginas, debe usar las variables de la siguiente forma:

<ul>
#foreach( $menuItem in $menuItemList )
  #if( $menuItem.isFirstItem )
  <li class="first_background">
    <a href="$menuItem.target" title="" class="link" dataname="$menuItem.name" data-isFirstItem="$menuItem.isFirstItem" datatarget="$menuItem.target" data-noFollow="$menuItem.noFollow" datalinkTarget="$menuItem.linkTarget">$menuItem.name</a>
  </li>
  #else
  <li class="background_institucional">
    <a href="$menuItem.target" #if($menuItem.noFollow) rel="nofollow" #end title="" class="link" target="$menuItem.linkTarget" data-name="$menuItem.name" data-isFirstItem="$menuItem.isFirstItem" data-target="$menuItem.target" datanoFollow="$menuItem.noFollow" datalinkTarget="$menuItem.linkTarget">$menuItem.name</a>
  </li>
  #end
#end
</ul>
BUCADOR

Para insertar un campo de búsqueda, debe crear un formulario en HTML, siguiendo el modelo de abajo:

<div id="searchWrap" class="searchWrapper clearfix">
  <div class="component searchBar">
    <form id="searchForm" method="get" action="/jm/com.mercadoshops.web.frontend.page.PageController">
      <input type="hidden" name="view" value="result">
      <input id="search" type="search" name="q" value="" class="inputField">
      <input type="submit" value="Buscar" class="ch-btn chsecondary button">
    </form>
  </div>
</div>
MENÚ DE CATEGORÍAS

Dentro del <DIV> destinado al menú de navegación, la estructura de abajo debe ser mantenida. Es importante notar que la estructura posee tres niveles de categorías y recomendamos que los tres niveles sean mantenidos.

<div class="navegacao_barra">
    <ul>
        #foreach( $categoryLevel1 in $level1CategoryList )
        <!-- 1º nível -->
        <li>
            #if( $selectedCategory == $categoryLevel1.id || $categoryLevel1.isInSelectedPath )
            <a href="$categoryLevel1.url" title="$categoryLevel1.name">$categoryLevel1.name</a>
            #else
            <a class="link link-categ" href="$categoryLevel1.url" title="$categoryLevel1.name"> $categoryLevel1.name </a>
            #end
            #if( $categoryLevel1.hasSubCategories )
            <!-- 2º nível -->
            <ul class="categoriesL2">
                #foreach( $categoryLevel2 in $categoryLevel1.subCategories )
                <li>
                    #if($selectedCategory == $categoryLevel2.id)
                    <a href="$categoryLevel2.url" title="$categoryLevel2.name">$categoryLevel2.name </a>
                    #else
                    <a class="link link-categ" href="$categoryLevel2.url" title="$categoryLevel2.name"> $categoryLevel2.name </a>
                    #end
                    #if( $categoryLevel2.hasSubCategories )
                    <!-- 3º nível -->
                    <ul class="categoriesL3">
                        #foreach( $categoryLevel3 in $categoryLevel2.subCategories )
                        <li>
                            #if($selectedCategory == $categoryLevel3.id)
                            <a href="$categoryLevel3.url" title="$categoryLevel3.name">$categoryLevel3.name </a>
                            #else
                            <a class="link link-categ" href="$categoryLevel3.url" title="$categoryLevel3.name"> $categoryLevel3.name</a>
                            #end
                        </li>
                        #end
                    </ul>
                    #end
                </li>
                #end
            </ul>
            #end
        </li>
        #end
    </ul>
</div>

Para crear un menú dropdown y hacer que sea responsivo, puede seguir la siguiente estructura:

<div class="navegacao_dropdown">
    #if( $hasOnlyOneCategory )
    <!-- se houver apenas 1 categoria, exibirá botão “Todos os produtos -->
    <a href="$uniqueCategory.url" class="no-categ link ch-btn ch-secondary
button">Todos os produtos</a>
    #else
    <!-- senão, exibirá menu dropdown -->
    <div id="categDrop" class="component categoriesList ch-dropdown">
        <p class="button">Categorias</p>
        <ul style="display:none;">
            <!-- lista as categorias de 1º nível -->
            #foreach ( $categoryLevel1 in $level1CategoryList )
            <li>
                <a href="$categoryLevel1.url">$categoryLevel1.name</a>
            </li>
            #end
        </ul>
    </div>
    #end
</div>

Evite modificar las clases del código, algunas son utilizadas por el script de Mercado Shops para el funcionamiento del menú dropdown.

Para la versión responsiva, debe copiar al archivo personalized.css, el código CSS de abajo:

.navegacao_dropdown {
    display: none;
}

.navegacao_barra {
    display: block;
}

/* NAVEGAÇÃO MOBILE – max-width pode ser alterado conforme o grid */
@media screen and(max - width: 950 px) {
    .navegacao_dropdown {
        display: block;
    }
    .navegacao_barra {
        display: none;
    }
}

Las nuevas propiedades se pueden insertar en las reglas.

El footer es el pie de página de la tienda virtual y estará presente en la página principal, las páginas de categorías, la página de productos, las páginas de resultados de búsqueda y el carrito.

Algunos elementos se pueden repetir en el encabezado, el pie de página y la página principal.

PAGO

Mercado Shops acepta básicamente Mercado Pago. Para colocar los sellos de tarjetas y medios de pago aceptados por Mercado Pago, la forma recomendada es:

Acceder al siguiente enlace, escoger el formato del banner, copiar el código y pegarlo en el HTML del pie de página de la tienda.

https://www.mercadopago.com/mla/com.mercadopago.web.landing.LandingController?id=banners#!mediosde-pago (En el caso de Argentina)

Asegúrese que sean los medios de pago aceptados por mercado pago en la tienda de su país

Como por ejemplo, tenemos el código:

#if($!show_mp_methods)
<img src="https://imgmp.mlstatic.com/orgimg/MLB/MP/BANNERS/tipo2_468X60.jpg?v=1" alt="MercadoPago - Medios de pago" title="MercadoPago - Medios de pago" width="468" height="60"/>
#end

El código siguiente, en el tema archivo de descargado, puede ser excluido.

#if(("BR" != "VE") && ($!show_mp_methods))
  <div class="component promoMP payMethod clearfix">
  <p class="pay-safe-column">Compre seguro com:</p>
  <ul class="banks-mlb clearfix">
    <li class="cards-mlb"><span class="visa-mlb">Visa</span></li>
    <li class="cards-mlb"><span class="master-mlb">MasterCard</span></li>
    <li class="cards-mlb"><span class="hipercardmlb">Hipercard</span></li>
    <li class="cards-mlb"><span class="elo-mlb">Elo</span></li>
  </ul>
  </div>
#end

En los "Medios de Pago" (Administrador > Mi sitio web > Preferencias > Medios de pago), es posible configurar algunas opciones de pago. Sin embargo, el código presentado anteriormente está estático en el tema y no es dinámico.

DATOS

Los datos deben ser rellenados en el administrador de la plataforma en:

Mi sitio web > Preferencias > Datos

 

DATOS FISCALES
#if($hasFiscalData)
  #if($fiscalData.companyName) <!—- NOME DA LOJA -->
    $SEU.escapeHtml($fiscalData.companyName)
  #end
  #if($fiscalData.documentNumber) <!—- DOCUMENTO -->
    #if($fiscalData.documentType)
      $SEU.escapeHtml($fiscalData.documentType): <!—- Tipo -->
    #end
    $SEU.escapeHtml($fiscalData.documentNumber) <!—- Número. -->
  #end
#end
DATOS DE CONTACTO

En el administrador, la opción “Mostrar mis datos de contacto al pie de página” debe estar seleccionada y el código debe ser usado.

#if($showContactFooter)
  #if( $showAddres ) <!—- Endereço -->
    $address
  #end
  #if( $showPhone ) <!—- Telefone de Contato -->
    $phone
  #end
#end

Enlace para Mercado Shops

También en el pie de página, se recomienda utilizar el enlace a Mercado Shops

<a href="http://www.mercadoshops.com/" target="_blank">Mercado Shops</a>

ELEMENTOS COMUNES DE LA PÁGINA PRINCIPAL (HOME)

BANNER

En la pestaña “Carrousel de la página principal” (Mi sitio web > Diseño) del administrador de Mercado Shops, es posible agregar hasta 5 banners. Esos banners pueden tener hasta 5 MB y estar en los formatos .jpg, .gif y .png.

Con el siguiente código, es posible mostrar los banners registrados en la página principal del sitio.

<div class="banner">
    #if($showContent)
    <div class="box-content-list ch-g1">
        #if($showContentImage)
        <div class="ch-carousel" data-max-items="1">
            <ul class="content-list">
                #foreach ($contentImage in $contentImageList)
                <li style="height: $contentImageMaxHeight">
                    <article class="component article clearfix">
                        <figure>
                            <span>
                              #if($contentImage.hasLink)
                              <a href="$contentImage.link" rel="nofollow" target="_blank">
                              #end
                              		<img src="$contentImage.src" alt="$contentImage.alt">
                              #if($contentImage.hasLink)
                              </a>
                              #end
                            </span>
                        </figure>
                    </article>
                </li>
                #end
            </ul>
        </div>
        #elseif ($showContentText)
        <div>$contentText</div>
        #end
    </div>
    #end
</div>

En el banner, pueden ser necesarios algunos ajustes CSS para que ocupe todo el ancho de la página; por ejemplo, es necesario alterar las siguientes clases:

.ch-carousel ul {width: 100%}
.content-list li {margin: 0 auto; width: 100%;}

/* NAVEGAÇÃO MOBILE – desabilita a exibição do banner em mobile */
@media screen and (max-width: 950px) {
  .banner {display: none;}
}
VITRINAS DE PRODUCTOS

La página principal de Mercado Shops tiene tres vitrinas:

Esas vitrinas se administran dentro de “Mi sitio web”, “Página principal”.

Para las tres vitrinas es importante añadir la siguiente regla de corrección de decimal en CSS:

.component .decimal {
  display: inline-block;
}

Los códigos listados pueden estar dentro de un div wrapper o algún elemento para que se respete el ancho del grid. Además de esa etiqueta div, se puede insertar un título para las vitrinas, por ejemplo:

<h3 class="title-component">Novidades</h3>

La arquitectura básica de una vitrina es:

Galería de Produtos (ul) > Producto o Item (li)

Ya el elemento de producto posee una arquitectura de exhibición que puede ser modificada entre las vitrinas:

Producto o Item > Imagen del Producto > Título del Producto > Precio > Cuotas

Además de otra información como promociones y flete.

ANUNCIOS DESTACADOS

Esta vitrina se limita a la selección de hasta 10 productos en carrusel. El código para la exhibición de los anuncios destacados es:

<section class="component prominentProd prodCarousel ch-g1">
    <div class="ch-carousel" data-max-items="$outstandingMaxItemsPerPage">
        <ul>
            #foreach ($outstandingItem in $outstandingItemList)
            <!-- Item -->
            <li>
                <article class="clearfix">
                    <!-- Título do Produto -->
                    <h2>
                        <a title="$outstandingItem.title" href="$outstandingItem.url" class="title">$outstandingItem.title</a>
                    </h2>
                    <figure>
                        <!-- Foto do Produto -->
                        <a href="$outstandingItem.url" title="$outstandingItem.title" class="link">
                        #if( $outstandingItem.hasImages )
                        <img src="$outstandingItem.imageUrl" alt="$outstandingItem.title" title="$outstandingItem.title">
                        #else
                        <img alt="Sem Foto" title="Sem Foto" src="$outstandingItem.imageUrl"/>
                        #end
                        </a>
                        <!-- Verifica se está em promoção e qual o tipo de desconto -->
                        #if($outstandingItem.hasPromotion)
                          #if($outstandingItem.promotion.isDiscountTypePrice)
                          <p class="promoRibbonHomeStarred"><span>$outstandingItem.promotion.discountPercent</span>&#37; <strong>OFF</strong></p>
                          #elseif ($outstandingItem.promotion.isDiscountTypeQuantity && "BR" != "BR")
                          <p class="promoRibbonHomeStarred"><strong class="promoQtyBuy">$outstandingItem.promotion.quantityTake<span class="promoQtyBuyX">x</span>$outstandingItem.promotion.quantityBuy</strong></p>
                          #end
                        #end
                    </figure>
                    #set ($galleryItem = $outstandingItem)
                    #set ($galleryPromotion = $outstandingItem.promotion)
                    <dl id="homePrice">
                        <!-- Detalhes do preço -->
                        #if ($galleryItem.hasPriceWithDiscount())
                        <del class="chprice price">
                            #end
                            <dd>
                                #if( $RegionalConfig.useDecimals($country) )
                                <span class="#if (!$galleryItem.hasPriceWithDiscount())ch-price #end price">
                                  $CurrencyHelper.getCurrencySymbol("$shop.locale.country", "$galleryItem.currencyId") $galleryItem.getSplitPrice()[0]<span class="decimal">,</span><sup>$galleryItem.getSplitPrice()[1]</sup>
                                </span>
                                #else
                                <span class="#if (!$galleryItem.hasPriceWithDiscount())ch-price #end price">
                                	CurrencyHelper.getCurrencySymbol("$shop.locale.country", "$galleryItem.currencyId") $galleryItem.getSplitPrice()[0]
                                </span>
                                #end
                            </dd>
                        #if ($galleryItem.hasPriceWithDiscount())
                        </del>
                        #end
                        #if ($galleryItem.hasPriceWithDiscount())
                        	#if ($galleryItem.hasPriceWithDiscount())
                            <ins>
                            #end
                            <dd>
                            #if( $RegionalConfig.useDecimals($country) )
                              <span class="ch-price price">
                                $CurrencyHelper.getCurrencySymbol("$shop.locale.country", "$galleryItem.currencyId") $galleryItem.getSplitPriceWithDiscount()[0]
                                <span class="decimal">,</span>
                                <sup>$galleryItem.getSplitPriceWithDiscount()[1]</sup>
                              </span>
                              #else
                              <span class="ch-price price">$CurrencyHelper.getCurrencySymbol("$shop.locale.country", "$galleryItem.currencyId") $galleryItem.getSplitPriceWithDiscount()[0]
                              </span>
                              #end
                              </dd>
                              #if ($galleryItem.hasPriceWithDiscount())
                                </ins>
                              #end
                            #end
                     </dl>
                    <!-- Parcelamento -->
                    #set ($psjItem = $outstandingItem)
                    #if($shop.hasDeductions() && $psjItem && $psjItem.preferredInstallment.isHasZeroRate() && $psjItem.preferredInstallment.installments > 1)
                    <div class="semjuros-container">
                        #set($price = $PriceUtils.getInstallmentsPriceWithDeduction($shop.locale.country, $psjItem.currencyId, $psjItem.discountPrice, $psjItem.preferredInstallment.installments))
                        <i class="ch-icon-credit-card"></i> $psjItem.preferredInstallment.installments $i18n.tr("cuotas de") #if($RegionalConfig.useDecimals($shop.locale.country))
                        <span class="ch-price price">
							$CurrencyHelper.getCurrencySymbol($shop.locale)
							$price[0]<span class="decimal">,</span><sup>$price[1]</sup>
                        </span>
                        #else
                        <span class="ch-price price">
						$CurrencyHelper.getCurrencySymbol($shop.locale)
						$price[0]
						</span>
                        #end
                        <span id="semjuros-installment-text" class="semjuros ms-promo-text__lower"> $i18n.tr("Sin interés")</span>
                    </div>
                    #end
                    #if($outstandingItem.hasPromotion && $outstandingItem.promotion.isDiscountTypeQuantity && "BR" == "BR")
                    <p class="promoTagMlb">Leve $outstandingItem.promotion.quantityTake pague $outstandingItem.promotion.quantityBuy
                    </p>
                    #end
                    <!-- Frete -->
                    #if($outstandingItem.hasPromotion && $outstandingItem.promotion.isFreeShipping && $outstandingItem.send)
                    <div class="promotionFreeShippingStarred">
                        <span class="arrow-left"></span>
                        <span class="freeShippingText">Frete grátis</span>
                    </div>
                    #end
                    <!-- Subtítulo -->
                    <div class="itemFeatures">
                        $outstandingItem.subtitle
                    </div>
                </article>
            </li>
            #end
        </ul>
    </div>
</section>
VITRINA DE NOVEDADES

En esta vitrina Mercado Shops muestra 2 productos seleccionados en el administrador de la plataforma.

El código para la exhibición de la vitrina es:

<div class="component newsProduct">
    <h3 class="title-component">Novidades</h3>
    <div class="ch-carousel" data-max-items="$newsMaxItemsPerPage">
        <ul class="list-prod">
            #foreach ($newsItem in $newsItemList)
            <li>
                <figure>
                    <a href="$newsItem.url">
                      #if($newsItem.hasImages)
                      <img src="$newsItem.imageUrl" title="$newsItem.title" />
                      #else
                      <img src="$newsItem.imageUrl" alt="Sem Foto" title="Sem Foto">
                      #end
                      #if( $newsItem.showLastAvailable )
                      <span class="lastProd last-BR">Últimos disponíveis</span>
                      #end
                    </a>
                    #if($newsItem.hasPromotion)
                      #if($newsItem.promotion.isDiscountTypePrice)
                      <p class="promoRibbonNews"><span>$newsItem.promotion.discountPercent</span>&#37;
                          <strong>OFF</strong>
                      </p>
                      #elseif ($newsItem.promotion.isDiscountTypeQuantity && "BR" != "BR")
                      <p class="promoRibbonNews"><strong class="promoQtyBuy">$newsItem.promotion.quantityTake<span class="promoQtyBuyX">x</span>$newsItem.promotion.quantityBuy</strong></p>
                      #end
                    #end
                </figure>
                <h2><a href="$newsItem.url" title="$newsItem.title" class="title">$newsItem.title</a></h2>
                #set ($galleryItem = $newsItem) #set ($galleryPromotion = $newsItem.promotion)
                <dl id="homePrice">
                    #if ($galleryItem.hasPriceWithDiscount())
                    <del class="ch-price price">
                    #end
                      <dd>
                        #if( $RegionalConfig.useDecimals($country) )
                        <span class="#if(!$galleryItem.hasPriceWithDiscount())ch-price #end price">
                          $CurrencyHelper.getCurrencySymbol("$shop.locale.country","$galleryItem.currencyId") $galleryItem.getSplitPrice()[0]<span class="decimal">,</span><sup>$galleryItem.getSplitPrice()[1]</sup>
                        </span>
                        #else
                        <span class="#if(!$galleryItem.hasPriceWithDiscount())ch-price #end price">
                          $CurrencyHelper.getCurrencySymbol("$shop.locale.country","$galleryItem.currencyId") $galleryItem.getSplitPrice()[0]
                        </span>
                        #end
                      </dd>
                    #if ($galleryItem.hasPriceWithDiscount())
                    </del>
                    #end
                    #if ($galleryItem.hasPriceWithDiscount())
                        #if ($galleryItem.hasPriceWithDiscount())
                        <ins>
                        #end
                    <dd>
                    #if( $RegionalConfig.useDecimals($country) )
                    <span class="ch-price price">
                      $CurrencyHelper.getCurrencySymbol("$shop.locale.country","$galleryItem.currencyId") $galleryItem.getSplitPriceWithDiscount()[0]<span class="decimal">,</span><sup>$galleryItem.getSplitPriceWithDiscount()[1]</sup>
                    </span>
                    #else
                    <span class="ch-price price">
                      $CurrencyHelper.getCurrencySymbol("$shop.locale.country","$galleryItem.currencyId") $galleryItem.getSplitPriceWithDiscount()[0]
                    </span>
                    #end
                    </dd>
                      #if ($galleryItem.hasPriceWithDiscount())
                      </ins>
                      #end
                    #end
                </dl>
                #set ($psjItem = $newsItem)
                #if($shop.hasDeductions() && $psjItem && $psjItem.preferredInstallment.isHasZeroRate() && $psjItem.preferredInstallment.installments > 1)
                <div class="semjuros-container">
                    #set($price = $PriceUtils.getInstallmentsPriceWithDeduction($shop.locale.country, $psjItem.currencyId, $psjItem.discountPrice, $psjItem.preferredInstallment.installments))
                    <i class="ch-icon-credit-card"></i> $psjItem.preferredInstallment.installments $i18n.tr("cuotas de")
                    #if($RegionalConfig.useDecimals($shop.locale.country))
                    <span class="ch-price price">$CurrencyHelper.getCurrencySymbol($shop.locale)$price[0]<span class="decimal">,</span><sup>$price[1]</sup></span>
                    #else
                    <span class="ch-price price">$CurrencyHelper.getCurrencySymbol($shop.locale)$price[0]</span>
                    #end
                    <span id="semjuros-installment-text" class="semjuros mspromo-text__lower">$i18n.tr("Sin interés")</span>
                </div>
                #end
            </li>
            #end
        </ul>
    </div>
</div>
GALERÍA

La galería es la principal vitrina de Mercado Shops. Muestra hasta 12 productos seleccionados o aleatorios.

El código para la exhibición de esa vitrina es:

<nav class="component itemGallery clearfix">
    <h3 class="title-component">Galeria de Produtos</h3>
    <ul class="item-gallery">
		#foreach ($galleryItem in $galleryItemList)
        <li class="background $promotionCssClass">
            <article class="clearfix $promotionCssClass">
                <h2> <a href="$galleryItem.url" title="$galleryItem.title" class="title">$galleryItem.title</a> </h2>
                <ul class="itemData clearfix">
                    <li>
                        <figure class="background">
                          	<a class="link" title="$galleryItem.title" href="$galleryItem.url">
                              	#if( $galleryItem.hasImages )
                              	<img class="" alt="$galleryItem.title" title="$galleryItem.title" src="$galleryItem.imageUrl">
                                #else
                                <img class="" alt="Sem Foto" title="Sem Foto" src="$galleryItem.imageUrl">
                                #end
                                #if( $galleryItem.showLastAvailable )
                                <span class="lastProd last-BR">Últimos disponíveis </span>
                                #end
                            </a>
                            #if($galleryItem.hasPromotion)
                            	#if($galleryItem.promotion.isDiscountTypePrice)
	                            <p class="promoRibbonHome"><span>$galleryItem.promotion.discountPercent</span>&#37; <strong>OFF</strong> </p>
                                #elseif ($galleryItem.promotion.isDiscountTypeQuantity && "BR" != "BR")
	                            <p class="promoRibbonHome"><strong class="promoQtyBuy">$galleryItem.promotion.quantityTake<span class="promoQtyBuyX">x</span>$galleryItem.promotion.quantityBuy</strong></p>
                                #end
                            #end
                        </figure>
                    </li>
                    #set ($galleryPromotion = $galleryItem.promotion)
                    <dl id="homePrice">
                    	#if ($galleryItem.hasPriceWithDiscount())
                      	<del class="ch-price price">
                        #end
                        <dd>
                    		#if( $RegionalConfig.useDecimals($country) )
                          	<span class="#if (!$galleryItem.hasPriceWithDiscount())ch-price#end price">
                        		$CurrencyHelper.getCurrencySymbol("$shop.locale.country", "$galleryItem.currencyId") $galleryItem.getSplitPrice()[0]<span class="decimal">,</span><sup>$galleryItem.getSplitPrice()[1]</sup>
                            </span>
                            #else
                           	<span class="#if (!$galleryItem.hasPriceWithDiscount())ch-price#end price">
                              	$CurrencyHelper.getCurrencySymbol("$shop.locale.country", "$galleryItem.currencyId") $galleryItem.getSplitPrice()[0]
                            </span>
                           	#end
                    	</dd>
                        #if ($galleryItem.hasPriceWithDiscount())
                        </del>
                        #end
                        #if ($galleryItem.hasPriceWithDiscount())
                        	#if ($galleryItem.hasPriceWithDiscount())
                            <ins>
                            #end
                              <dd>
                              #if( $RegionalConfig.useDecimals($country) )
                              <span class="ch-price price">
                                  $CurrencyHelper.getCurrencySymbol("$shop.locale.country", "$galleryItem.currencyId") $galleryItem.getSplitPriceWithDiscount()[0]<span class="decimal">,</span><sup>$galleryItem.getSplitPriceWithDiscount()[1]</sup>
                              </span>
                              #else
                                  <span class="ch-price price">
                                      $CurrencyHelper.getCurrencySymbol("$shop.locale.country", "$galleryItem.currencyId") $galleryItem.getSplitPriceWithDiscount()[0]
                                  </span>
                              #end
                              </dd>
                            #if ($galleryItem.hasPriceWithDiscount())
                            </ins>
                            #end
                        #end
                    </dl>
                    #set ($psjItem = $galleryItem)
                    #if($shop.hasDeductions() && $psjItem && $psjItem.preferredInstallment.isHasZeroRate() && $psjItem.preferredInstallment.installments > 1)
                    <div class="semjuros-container">
                    	#set($price = $PriceUtils.getInstallmentsPriceWithDeduction($shop.locale.country, $psjItem.currencyId, $psjItem.discountPrice, $psjItem.preferredInstallment.installments)) <i class="ch-icon-credit-card"></i> $psjItem.preferredInstallment.installments $i18n.tr("cuotas de")
                    	#if($RegionalConfig.useDecimals($shop.locale.country))
                    	<span class="ch-price price"> $CurrencyHelper.getCurrencySymbol($shop.locale) $price[0]<span class="decimal">,</span><sup>$price[1]</sup> </span>
                    	#else
                        <span class="ch-price price"> $CurrencyHelper.getCurrencySymbol($shop.locale) $price[0] </span>
	                    #end
                        <span id="semjuros-installment-text" class="semjuros mspromo-text__lower"> $i18n.tr("Sin interés") </span>
                    </div>
                    #end
                    #if($galleryItem.hasPromotion && $galleryItem.promotion.isDiscountTypeQuantity && "BR" == "BR")
                    <p class="promoTagMlb">Leve $galleryItem.promotion.quantityTake pague $galleryItem.promotion.quantityBuy</p>
                    #end
                    #if($galleryItem.hasPromotion && $galleryItem.promotion.isFreeShipping && $galleryItem.send)
                    <div class="promotionFreeShippingSmall">
                      <span class="arrow-left"></span> <span class="freeShippingText"> Frete grátis </span>
                    </div>
                    #end
                </ul>
            </article>
        </li>
    	#end
	</ul>
</nav>
OTROS ELEMENTOS

En los archivos de paquete de tema de Mercado Shops, se pueden insertar directamente en HTML elementos que no serán administrados por la plataforma, como por ejemplo, enlaces de redes sociales, scripts de Facebook y otras redes sociales, otros datos de contactos, banners, etc.

Vale recordar que, si esos elementos estáticos poseen imágenes, esas imágenes deben estar en la carpeta de imágenes (descrita en “Contenido de los paquetes de tema”) u hospedadas en otro servidor.

OTRAS PÁGINAS

Las modificaciones de otras páginas, como la página de categoría, productos, carrito, etc., deben realizarse vía CSS, copiando las clases para los archivos personalized.css (ver Modificaciones para páginas no editables).