Prestashop

Diseño Web, Gestores de contenidos, Prestashop

Cómo activar el modo debug (developer mode) en Prestashop

Ayer un colaborador tenía un problema con un Prestashop y le indicamos que el modo debug, llamado Developer Mode. Cuando preguntó como le dijimos que estaba en el blog…pero no. Lo teníamos para Moodle y para WordPress, pero no para Prestashop. Así que aquí os dejamos cómo activar el modo debug, Developer Mode, en Prestashop para ver errores en pantalla.  Obviamente, no es bueno activarlo en producción a menos que sea imprescindible. Por FTP abre el fichero:  /config/defines.inc.php Busca la línea que pone define(‘_PS_MODE_DEV_’, false); Cambia la línea a define(‘_PS_MODE_DEV_’, true); Guarda los cambios y recarga la página que daba errores. Con esto  ya deberías ver los problemas. Recuerda hacer el proceso inverso para desactivar el modo de desarrollador. Más información aquí.

Diseño Web, Gestores de contenidos, Prestashop

Como poner banderas en el bloque de idiomas de Prestashop

Prestashop ha incluído muchos cambios en la versión 1.6, y buenos. Pero una de las cosas que ha quitado tanto en la plantilla por defecto, como en la mayoría de las plantillas, es que el selector de idiomas tenga banderas. Hay gente que lo prefiere así, pero también hay gente que prefiere las banderas, como nos pasó el otro día con un cliente. Hoy os explicamos cómo poner dichas banderas. Tenemos que modificar el código del fichero blocklanguages.tpl del módulo blocklanguages.  Este módulo estará tanto en la plantilla como en la raíz. Preferiblemente modifica el de tu plantilla (como siempre haz una copia de seguridad antes). El truco lo hemos sacado de aquí, pero en nuestra versión había que hacer alguna modificación (puede que cuando leas el artículo tu tengas que jugar un poco con el código de tu versión también). Pongo en rojo las modificaciones del fichero que hemos introducido y en azul lo que hemos comentado para cambiar el texto por la imagen: <!– Block languages module –> {if count($languages) > 1} <div class=”btn-group compact-hidden”> <a href=”#” class=”btn-xs dropdown-toggle” data-toggle=”dropdown”> {foreach from=$languages key=k item=language name=”languages”} {if $language.iso_code == $lang_iso} <!– Flag image –> <img style=”border: solid 3px #fff; margin-right:5px;” src=”{$img_lang_dir}{$language.id_lang}.jpg” alt=”{$language.iso_code}” width=”28″ height=”22″ /><!– /Flag image –> <span class=”text-box”>{$language.name|truncate:3:”:true|regex_replace:”/\s.*$/”:””}</span> <span class=”fa fa-angle-down”></span> {/if} {/foreach} </a> <ul class=”dropdown-menu” role=”menu”> {foreach from=$languages key=k item=language name=”languages”} <li {if $language.iso_code == $lang_iso}class=”selected”{/if}> {if $language.iso_code != $lang_iso} {assign var=indice_lang value=$language.id_lang} {if isset($lang_rewrite_urls.$indice_lang)} <a href=”{$lang_rewrite_urls.$indice_lang|escape:’html’:’UTF-8′}” title=”{$language.name}”><!– Flag image –><img src=”{$img_lang_dir}{$language.id_lang}.jpg” alt=”{$language.iso_code}” width=”15″ height=”12″ /><!– /Flag image–><!–{$language.name|regex_replace:”/\s.*$/”:””}–></a> {else} <a href=”{$link->getLanguageLink($language.id_lang)|escape:’html’:’UTF-8′}” title=”{$language.name}”><!– Flag image –><img src=”{$img_lang_dir}{$language.id_lang}.jpg” alt=”{$language.iso_code}” width=”22″ height=”15″ /><!– /Flag image–><!–{$language.name|regex_replace:”/\s.*$/”:””}–></a> {/if} {/if} {if $language.iso_code == $lang_iso} <!– <a href=”#” title=”{$language.name}”>{$language.name|regex_replace:”/\s.*$/”:””}</a> –> {/if} </li> {/foreach} </ul> </div> {/if} <!– /Block languages module –>  

Prestashop, Trucos

Cómo subir logos transparentes png a Prestashop

Si estás haciendo una página en Prestashop, e intentas subir una imagen con fondo transparente como logo (o cualquier otra cosa) a Prestashop, veréis que el fondo lo convierte en blanco. La solución es sencilla, pero como nos hemos peleado con ello varias veces y nos lo han preguntado, os la dejamos aquí. Prestashop, de fábrica, te convierte todas las imágenes png a jpeg (de ahí que el fondo se vuelva blanco). Si queréis quitar esta opción hay que ir a Preferencias, Imágenes y bajar hasta donde pone Usar JPEG. Cambia eso a cualquiera de las otras dos opciones para poder tener imágenes png en tu tienda. Luego sube la imagen normalmente y verás que está resuelto.

Prestashop, Trucos

Como duplicar un módulo en Prestashop

A veces, cuando estás haciendo una página en Prestashop, necesitas clonar un módulo ya existente. Quizás porque necesitas que su funcionalidad se repita en varios sitios, quizás porque necesitas que en ciertas ocasiones el mensaje o la funcionalidad sea algo diferente. A lo mejor, como nos ha pasado a nosotros, quieres tener otro método de pago como pago en tienda y puedes hacerlo clonando y variando el de pago por transferencia. Os explicamos cómo. Los pasos son: Copia la carpeta del módulo en modules a otra carpeta con otro nombre. Por ejemplo copia modulo1 a modulo2 Cambia el nombre de todos los ficheros dentro de la carpeta modulo2 que se referían al anterior. Por ejemplo modulo1.php y modulo1.tpl a modulo2.php y modulo2.tpl. Cambiar la clase en el fichero .php, class modulo2 extends Module Cambiar en el fichero .php, el nombre del módulo en esta línea del .php: $this->name = ‘modulo2’; Cambiar, en el fichero .php, el nombre de los parámetros en las líneas que pone: Configuration::updateValue(‘modulo_2_NBR’, 8); Cambia los valores donde aparece el módulo antiguo en líneas como (depende del módulo): if (isset($config[‘BANK_WIRE3_OWNER’])), if (isset($config[‘BANK_WIRE3_DETAILS’]))  Esto hazlo en todas las funciones del fichero .php (install etc). Si no va a depender del módulo antiguo. Cambia todo nombre referenciando al antiguo módulo en el fichero .php. Es importante porque así cuando lo instales podrá crear en la base de datos los campos necesarios e independientes del otro módulo. Al final del .php donde pone dónde llama al siguiente fichero tpl cambiar el nombre: return $this->display(__FILE__, ‘modulo2.tpl’, $this->getCacheId()); En el fichero config.xml cambia las referencias al módulo antiguo: <?xml version=”1.0″ encoding=”UTF-8″ ?> <module> <name>modulo2</name> <displayName>modulo2</displayName> <version>0.1</version> <description>Lo que quieras poner</description> <tab>advertising_marketing</tab> <is_configurable>1</is_configurable> <need_instance>0</need_instance> </module> Si coge valores en los hooks de otro sitio cambia el id de los valores a uno de tu invención. Por ejemplo: $products = $category->getProducts(intval($params[‘cookie’]->id_lang), 1, ($nb ? $nb : 10)); a $products = $category->getProducts(intval($params[‘cookie’]->id_lang), 123, ($nb ? $nb : 10)); Instálalo desde el backend y mira si hay errores.  Si no los hay cambia la funcionalidad que necesites. Dependiendo de la complejidad del módulo este proceso de duplicarlo será más o  menos complicado. Empezad con uno sencillito para entenderlo.    

Gestores de contenidos, Prestashop, Soporte, Trucos

Insertar códigos de seguimiento como el de Analytics en Prestashop

Hace unos días teníamos que insertar el código de Analytics en un cliente con una tienda de Prestashop. Es verdad que tiene un módulo de Analytics, pero al comprobarlo en Google daba un error como que el script estaba dañado. Por lo que hemos visto le pasa a mucha gente. Así que optamos por poner el script “a mano”, y esta solución sirve también para cualquier script de seguimiento adicional, incluído Google Tag Manager.Pero no se puede poner de cualquier manera por ser ficheros .tpl. Lo primero que tienes que elegir es el fichero donde lo quieres poner. Esto va a depender si lo tienes que poner antes del cierrre de la etiqueta <header> o después de la apertura o cierre de la etiqueta </body>. Va a depender mucho del código.Los ficheros header.tpl y footer.tpl de la plantilla suelen ser unos candidato idóneos a considerar. Si el fichero es .tpl (como header o footer) debes poner el código entre las etiquetas {literal}{/literal}. Sin ellas a nosotros se nos caía la página. Esto es porque estos códigos pueden incluir paréntesis entre sus líneas de código y esto el SMARTY lo puede interpretar como código suyo. Estas etiquetas le dicen que lo que hay entre medias no es para él. Por ejemplo para Google Analytics: {literal} <!– Google Analytics –> <script> (function(i,s,o,g,r,a,m){i[‘GoogleAnalyticsObject’]=r;i[r]=i[r]||function(){ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o), m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m) })(window,document,’script’,’//www.google-analytics.com/analytics.js’,’ga’); ga(‘create’, ‘UA-XXXXX-Y’, ‘auto’); ga(‘send’, ‘pageview’); </script> <!– End Google Analytics –> {/literal} Con esto te funcionará el código. Lo puedes comprobar fácilmente con el Tag Assistant que os comentamos el otro día.

Gestores de contenidos, Navegadores, Prestashop, Trucos

Tag Assistant. Extensión de Chrome para comprobar los códigos de Google en una web

Hace unos días estábamos trabajando con el Prestashop de un cliente para poner el código de Anayltics.  El problema que tenía era que el módulo estaba bien instalado pero Google Webmaster tools decía que no funcionaba el sript. Pero por nuestra parte lo veíamos todo bien. Probamos varias maneras de poner el código pero no podíamos saber si estaba bien puesto o no. Con esta extensión de Chrome, Tag Assistant, puedes comprobar fácilmente si la configuración es correcta. La extensión lee la página en curso y te dice qué códigos de Google están activos y funcionando correctamente y cuales no. Muy sencillo de usar. Por cierto, os recomiendo que pongáis el script de Analytics en Prestashop en un módulo html en el footer o directamente en la plantilla. No uséis el módulo de Prestashop…no funciona bien.

Diseño Web, Prestashop, Sistemas, Trucos

Mostrar los valores en pantalla de un array en un tpl (smarty)

Si manejáis gestores de contenido como Prestashop u otros que usen Smarty, tendréis que modificar algún fichero tpl. Y a veces necesitaréis que se os muestre en pantalla el valor de algún array, aunque sea para ver qué almacena la variable. El equivalente a print_r() en php. Bueno en un tpl es parecido, lo que tienes que poner es {$variable|print_r}  si no queréis ver las etiquetas, o {$variable|@print_r} para ver las etiquetas. Pero esto lo muestra de manera “muy fea” y, al igual que php tiene la función print_pre() para mejorar la presentación de la print_r(), tenéis algo parecido en los tpl. Para mostrarlo de manera más “elegante“, y en un cuadro de pre (código) podéis hacer: <pre> {$variable|print_r()} </pre> Y veréis como se muestran los resultados en pantalla con un cuadro de código y ordenado. Sin en ve

Diseño Web, Prestashop

Módulo para CSS personalizado en Prestashop 1.5 y 1.6

Prestashop es un gestor para tiendas online EXCELENTE, más aún la versión 1.6 que han mejorado mucho. Pero si quieres cambiar algo de las hojas de estilo para personalizar tu tienda tienes que hacerlo directamente en los ficheros tanto de los módulos como de la plantilla. Esto, además de ser más complicado para el usuario medio, tiene el problema que si actualizas los módulos o la plantilla los cambios se pueden deshacer al sobreescribirse los ficheros. Por eso la manera más lógica es que Prestashop tuviera la opción de CSS personalizado….pero todavía no lo tiene. Así que este módulo viene estupendo. Compatible con la 1.5 y la 1.6, sólo tienes que descargarlo, instalarlo, activarlo y en la configuración poner el CSS que quieres personalizar. Obviamente esto requiere algo de conocimiento para saber cual es, pero supongo que lo sabes. A mi me ha funcionado de maravilla. Puedes descargarlo aquí: https://dh42.com/blog/free-prestashop-css-module/

Prestashop, Trucos

Prestashop: añadir o quitar las subcategorías de tu páginas de categorías

Hace unos días, para un cliente, tuvimos que añadir en una plantilla que mostrara las subcategorías en la página de categorías. La plantilla estaba pensada para sólo tener un nivel de categorías y entonces mostrar productos. En otros casos puede ocurrir lo contrario, que queramos quitar el que muestre las subcategorías. Bueno es bien fácil. En tu directorio themes, en tu tema, edita el fichero category.tpl y añade (o quita) este código: {if isset($subcategories)}   <!– Subcategories –>   <div id=”subcategories”>    <h3>{l s=’Subcategories’}</h3>    <ul class=”inline_list”>    {foreach from=$subcategories item=subcategory}         <li>          <a href=”{$link->getCategoryLink($subcategory.id_category, $subcategory.link_rewrite)|escape:’htmlall’:’UTF-8′}” title=”{$subcategory.name|escape:’htmlall’:’UTF-8′}”>           {if $subcategory.id_image}            <img src=”{$link->getCatImageLink($subcategory.link_rewrite, $subcategory.id_image, ‘medium’)}” alt=”” width=”{$mediumSize.width}” height=”{$mediumSize.height}” />           {else}            <img src=”{$img_cat_dir}default-medium.jpg” alt=”” width=”{$mediumSize.width}” height=”{$mediumSize.height}” />           {/if}          </a><br />          <a href=”{$link->getCategoryLink($subcategory.id_category, $subcategory.link_rewrite)|escape:’htmlall’:’UTF-8′}”>{$subcategory.name|escape:’htmlall’:’UTF-8′}</a>         </li>    {/foreach}    </ul>    <br/>   </div>   {/if}

Scroll al inicio