Saltar al contenido

Prestashop 2 – Creación de plantilla para prestashop 1.4.7

  • por

Si deseas ver el video en HD (https://vimeo.com/36608722 )

Si deseas descargar el video:
Prestashop 2 – Creación de plantilla para prestashop 1.4.7

En este video vamos a ver el proceso que en particular yo sigo al momento de crear una plantilla(THEME) para prestashop.

En este caso vamos a «clonar» una plantilla de Template Monster.
cms.template-help.com/prestashop_32937/

Pasos a seguir:
1. Activar el compilador de Smarty
2. Copiar y pegar la plantilla que viene por defecto en prestashop y renombrarla
3. Renombrar la carpeta «css» a «_css»
4. Crear la carpeta «css» de nuevo y colocarle el archivo de «global.css»
5. Referenciar el css de la plantilla original (cms.template-help.com/prestashop_32937/) : esto realizarlo en el archivo (header.tpl)

Dentro de las etiquetas <HEAD> del archivo header.tpl debe de quedar así.

[php]
<head>
<title>{$meta_title|escape:’htmlall’:’UTF-8′}</title>
{if isset($meta_description) AND $meta_description}
<meta name="description" content="{$meta_description|escape:html:’UTF-8′}" />
{/if}
{if isset($meta_keywords) AND $meta_keywords}
<meta name="keywords" content="{$meta_keywords|escape:html:’UTF-8′}" />
{/if}
<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=utf-8" />
<meta name="generator" content="PrestaShop" />
<meta name="robots" content="{if isset($nobots)}no{/if}index,follow" />
<link rel="icon" type="image/vnd.microsoft.icon" href="{$img_ps_dir}favicon.ico?{$img_update_time}" />
<link rel="shortcut icon" type="image/x-icon" href="{$img_ps_dir}favicon.ico?{$img_update_time}" />
<script type="text/javascript">
var baseDir = ‘{$content_dir}’;
var static_token = ‘{$static_token}’;
var token = ‘{$token}’;
var priceDisplayPrecision = {$priceDisplayPrecision*$currency->decimals};
var priceDisplayMethod = {$priceDisplay};
var roundMode = {$roundMode};
</script>

{if isset($css_files)}
{foreach from=$css_files key=css_uri item=media}
<link href="{$css_uri}" rel="stylesheet" type="text/css" media="{$media}" />
{/foreach}
{/if}

<link href="http://cms.template-help.com/prestashop_32937/themes/theme104/css/global.css" rel="stylesheet" type="text/css" media="all" />

{if isset($js_files)}
{foreach from=$js_files item=js_uri}
<script type="text/javascript" src="{$js_uri}"></script>
{/foreach}
{/if}

{$HOOK_HEADER}
</head>
[/php]

6. Mapear los div de la pagina original y esquematizarla en nuestra plantilla

Si te ha interesado este artículo y deseas un apoyo o asesoría en algún requerimiento, envíame un mensaje a: (info@juliopari.com) o sino a través de Linkedin: https://www.linkedin.com/in/juliopari/