PrestaShop Ecommerce - Guia tecnica en español

PrestaShop

Documentación: documentación técnica de PrestaShop

v 1.0

v1.0 – 16 diciembre 2010

PrestaShop



Documentación Documentación técnica de la Solución e-comercio open-source PrestaShop DEFINICIONES................................................................................................................................................... 4 INTRODUCCIÓN GENERAL Y FILOSOFÍA DEL PROYECTO .................................................................................... 4 PRERREQUISITOS TÉCNICOS ............................................................................................................................. 5 INSTALAR PRESTASHOP .................................................................................................................................... 5 ¿INSTALACIÓN LOCAL O A DISTANCIA ? .......................................................................................................................... 5 DESCARGAR PRESTASHOP .......................................................................................................................................... 6 COPIAR LOS ARCHIVOS DE INSTALACIÓN ........................................................................................................................ 6 COMPROBAR LOS PERMISOS ....................................................................................................................................... 6 CREAR LA BASE DE DATOS ........................................................................................................................................... 6 SENSIBILIZACIÓN A LAS COPIAS DE SEGURIDAD ................................................................................................................ 7 LANZAR LA INSTALACIÓN ............................................................................................................................................ 7 Etapa 1 – Bienvenido ....................................................................................................................................... 7 ¿En qué idioma quiere efectuar la instalación? ............................................................................................................ 7 Método de instalación .................................................................................................................................................. 7 Etapa 2 – Compatibilidad del sistema ............................................................................................................. 8 Por favor, asegúrese de que ha validado los siguientes parámetros ............................................................................ 8 Parámetros opcionales .................................................................................................................................................. 8 Etapa 3 – Configuración del sistema ............................................................................................................... 8 Configuración de la base de datos ................................................................................................................................ 8 Parámetros de envío de emails ................................................................................................................................... 10 Etapa 4 – Configuración de la tienda ............................................................................................................ 10 Nombre de la tienda ................................................................................................................................................... 10 País por defecto .......................................................................................................................................................... 10 Logo de la tienda ......................................................................................................................................................... 10 Nombre ....................................................................................................................................................................... 10 Apellido ....................................................................................................................................................................... 10 Dirección email............................................................................................................................................................ 10 Contraseña de la tienda .............................................................................................................................................. 10 Confirmar la contraseña .............................................................................................................................................. 10 Recibir mis datos por email ......................................................................................................................................... 11 Etapa 5 – ¡Instalación terminada! ........................................................... ...................................................... 11

PERSONALICE SU TIENDA .......................................................................................................................................... 12 ACTUALIZACION DE PRESTASHOP .................................................................................................................. 13 PRECAUCIONES ...................................................................................................................................................... 13 COPIA DE SEGURIDAD .............................................................................................................................................. 13 Copia de seguridad de sus traducciones ....................................................................................................... 13 Copia de seguridad de su base de datos ....................................................................................................... 13 Copia de seguridad de sus archivos PrestaShop ............................................................ ................................ 14

INSTALACIÓN DE LA NUEVA VERSIÓN .......................................................................................................................... 14 Descarga ....................................................................................................................................................... 14 Extraer y copiar ............................................................................................................................................. 14 Restaurar los datos a partir de una antigua versión ..................................................................................... 14 Instalar la actualización ................................................................................................................................ 15

ARQUITECTURA GENERAL .............................................................................................................................. 15 GRANDES PRINCIPIOS (MÓDULOS, TEMAS) .................................................................................................... 16 MÓDULOS ............................................................................................................................................................ 16 El concepto .................................................................................................................................................... 16 2/41

PrestaShop



Funcionamiento técnico de un módulo ......................................................................................................... 16 Lista de los hooks de PrestaShop................................................................................................................... 17

TEMAS ................................................................................................................................................................. 21 El concepto .................................................................................................................................................... 21 Funcionamiento técnico de un tema ............................................................................................................. 21 La gestión de las traducciones ...................................................................................................................... 22 Transmitir informaciones (datos) a un tema PrestaShop ......................................................... ..................... 22

LA ARBORESCENCIA DE PRESTASHOP ............................................................................................................. 23 BUENOS HÁBITOS QUE DEBEN RESPETARSE (DESARROLLADORES, INTEGRADORES)...................................... 24 SECURIZAR SU INSTALACIÓN PRESTASHOP .................................................................................................... 24 OPCIONES DE CONFIGURACIÓN C ONFIGURACIÓN Y FINE-TUNING/PERFORMANCES ................................................................. 25 ARCHIVO CONFIG.INC.PHP ....................................................................................................................................... 25 ARCHIVO DEFINES.INC.PHP ....................................................................................................................................... 25 ARCHIVO SMARTY.CONFIG.INC.PHP............................................................................................................................ 25 MEJORA DE LAS PRESTACIONES DE PRESTASHOP .......................................................................................... 25 PRÁCTICAS ..................................................................................................................................................... 26 CREAR UN TEMA PRESTASHOP .................................................................................................................................. 26 Tema por defecto PrestaShop ....................................................................................................................... 26 Crear un nuevo tema ..................................................................................................................................... 26 Arborescencia de un tema ............................................................................................................................. 27 Tema de los módulos .......................................................... ................................................................. .......... 28 Consejos para editar un tema PrestaShop .................................................................................................... 28 Firebug ........................................................................................................................................................................ 28 JavaScript .................................................................................................................................................................... 28 Archivo preview.jpg .................................................................................................................................................... 28 Normas W3C y compatibilidad inter-navegadores ..................................................................................................... 28

CREAR UN MÓDULO PRESTASHOP ............................................................................................................................. 29 Principio de los módulos ................................................................................................................................ 29 Arborescencia de los módulos ....................................................................................................................... 29 Estructura de base de un módulo .................................................................................................................. 29 Configuración de un módulo ......................................................................................................................... 31 Trasladar un módulo ..................................................................................................................................... 32 Mostrar un módulo ....................................................................................................................................... 33 Utilización de Smarty .................................................................................................................................... 36 Traducción de los módulos ............................................................................................................................ 37

CREAR UNA PESTAÑA EN EL BACK-OFFICE, ASÍ COMO SU CLASE ........................................................................................ 39 EN CASO DE PROBLEMA PROBL EMA ................................................................................................................................. 40 FORO OFICIAL PRESTASHOP...................................................................................................................................... HERRAMIENTA DE INFORMES DE ERRORES : EL "BUG TRACKER"........................................................................................ PARTICIPAR EN EL FORO ........................................................................................................................................... SOMETER UN ERROR EN EL BUG TRACKER ...................................................................................................................

40 40 41 41

SITIOS OFICIALES PRESTASHOP ...................................................................................................................... 41

Para cualquier pregunta, sugerencia o corrección cor rección sobre este documento, póngase en contacto con PrestaShop [email protected] 3/41


PrestaShop


Documentación Documentación técnica de la solución e-comercio open-source PrestaShop Definiciones Back Office / BO / Pa nel de administrador El Back B ack Office (BO) BO) es la parte de un sitio Web que permite al administrador administrarlo, en oposición al Front Office que constituye la interfaz con el usuario. Para un sitio de comercio en línea, también se puede hablar de trastienda. En él, el vendedor puede administrar sus productos, los clientes, los pedidos, los parámetros, etc. Front office / FO El Front F ront Office (FO) FO) es la parte de un sitio Web destinado a los usuarios, es decir a los clientes en el caso de un sitio de venta en línea. La interfaz destinado al administrador se llama Back Office. Open-Source La designación Open-Source se aplica a los software cuya licencia respeta los criterios establecidos por el Open Source Initiative, es decir, la posibilidad de libre predistribución, de acceso al código fuente y de los trabajos derivados.

Introducción general y filosofía del proyecto PrestaShop es un software e-comercio Open-source que puede descargarse de manera gratuita a partir de la siguiente dirección internet: http://www.prestashop.com http://www.prestashop.com.. El software ha sido editado por una empresa francesa, basada en París, también llamada PrestaShop. En elle trabajan un equipo de quince personas para proporcionar un software de calidad, lo más completo posible tanto en el plano técnico como de las aplicaciones que propone. El proyecto está financiado por servicios específicos a vendedores (personalización grafica, desarrollos técnicos…) así como por dos proyectos:

El proyecto está financiado por: 

Servicios específicos a los vendedores (personalización (personalización gráfica, desarrollos técnicos, …), formaciones de

4 tipos:





desarrollos (PHP, MySQL) con PrestaShop,



integración (XHTML, CSS, Smarty) con PrestaShop,



optimización de su referenciamiento con PrestaShop,



utilización del Back-office PrestaShop,

así como por dos proyectos: 

www.addons.prestashop.com La tienda oficial para PrestaShop (temas, módulos, logos, …). 4/41


PrestaShop 


www.prestabox.com Una solución de hosting llave en mano para el software PrestaShop.

Las claves del proyecto PrestaShop son:  Simplicidad  Eficacia  Flexibilidad  Rapidez Cada usuario del software PrestaShop puede contribuir como quiera, y como pueda:  Traduciéndolo en diferentes idiomas, http://www.prestashop.com/es/donate/)),  Haciendo un don que permita que el proyecto mejore (http://www.prestashop.com/es/donate/ (http://www.prestashop.com/forums/), ),  Participando en el foro comunitario (http://www.prestashop.com/forums/  ... PrestaShop agrupa actualmente a más de 40 000 vendedores a través de todo el mundo y progresa a pasos agigantados, gracias a una comunidad muy activa, con más de 100 000 miembros.

Prerrequisitos técnicos PrestaShop es un software pensado con el lenguaje de programación PHP 5 y el sistema de base de datos MySQL 5. Para instalarlo, necesitará un servidor Web (Apache, IIS), también es posible utilizar un sistema en el que todo está incorporado, como WAMP, MAMP o EasyPHP. El 99% de los posting aceptan dichos elementos técnicos, por lo que podrá instalar fácilmente PrestaShop independientemente de cual sea su hosting.

Instalar PrestaShop ¿Instalación local o a distancia? Para que su tienda sea accesible en Internet, deberá estar instalada en un servidor distante, por ejemplo en un hosting. En ese caso, antes de hacer una inscripción compruebe que su hosting propone todos los requisitos técnicos que hemos citado. El hosting pondrá a su disposición todas las herramientas necesarias para administrar su sitio Web (acceso FTP, servidor HTTP, herramientas de gestión de las bases de datos de los datos MySQL como PHPMyAdmin, etc.). Sin embargo, antes de lanzarse y de invertir en una inscripción, es posible hacer un test de PrestaShop en su propio ordenador (Mac, PC, etc.). Esto es posible gracias a varios programas que dan acceso a los prerrequisitos técnicos. Dichos programas se encuentran disponibles tanto para Mac como para Windows o Linux. A continuación una lista no exhaustiva de dichos programas: Sistema de explotación Linux Mac Windows

Software

URL

XAMPP MAMP WAMP EasyPHP

http://www.apachefriends.org/fr/xampp.html

http://www.mamp.info/en/index.html http://www.wampserver.com/ http://www.easyphp.org/

Para más información sobre la utilización de dichos programas, puede consultar su documentación.

5/41

PrestaShop



Descargar PrestaShop El último archivo estable de la solución PrestaShop puede descargarse descargarse en la siguiente dirección:

http://www.prestashop.com/es/downloads/ Las versiones consideradas estables estables para utilizar en producción llevan el término "final". Otras versiones en curso pueden ponerse a disposición en esta página pero solo para test. Se identifican por las palabras "alpha", "beta" o "RC". Le desaconsejamos que uti lice estas versiones en producción.

Copiar los archivos de instalación Una vez haya descargado el archivo, debe extraer el contenido. Aparece una carpeta prestashop que contiene todos las carpetas y archivos de la solución. Copie todos los elementos en su sitio Web, o bien en la raíz, o bien en una subcarpeta. Se recomienda guardar el archivo descargado que sirvió para instalar su tienda, ya que en caso de problema, si no ha hecho copia de seguridad, puede necesitarlo posteriormente para reinstalar o restaurar un archivo corrupto.

Comprobar los permisos Asegúrese de que las siguientes siguientes carpetas tienen permisos en lectura/escritura, lectura/escritura, llamados también CHMOD 666, de manera no recursiva, recursiva, es decir, decir, aplicados a la carpeta misma pero no a las subcarpetas: /config /download /tools/smarty/compile /upload Asegúrese de que las siguientes carpetas tienen permisos en lectura/escritura, de manera recursiva: recursiva: /img /mails /modules /themes/prestashop/lang /translations

Crear la base de datos En el momento de validar la tercera etapa de la instalación de PrestaShop, las tablas necesarias de funcionamiento de la solución se crearán en el seno de la base de datos. Por lo tanto es necesario crear la base de datos antes de dicha etapa. Lo más sencillo es crear la base de datos con la herramienta de su servidor (por ejemplo PHPMyAdmin) a partir de este momento. Ejemplo de creación de la base de datos, en local, con WAMP Para crear una nueva base de datos con WAMP:  Asegúrese de que ha lanzado los servidores Apache y MySQL,  Conéctese a http://127.0.0.1/phpmyadmin/ a partir de su navegador,  En el campo Crear una base de datos, escriba el nombre de la base de datos que va a crear (sin espacios ni caracteres especiales). Por ejemplo : mitienda,

 Pulse en el botón Crear. La base de datos ya ha sido creada. Memorice el nombre de la base de datos, lo necesitará en la etapa 3 de la instalación de PrestaShop.

6/41


PrestaShop


Sensibilización a las copias de seguridad Porque un incidente puede surgir en cualquier momento (mala manipulación, virus, alteración de datos, etc.), es preferible hacer copias de seguridad de su tienda con frecuencia. Una tienda PrestaShop está formada por una parte de carpetas y archivos (los que constituyen la solución pero también las imágenes añadidas posteriormente, los archivos puestos a disposición para las descargas del cliente, etc.) y por otra parte de una base de datos que agrupa toda la información como la descripción de los productos, cuentas clientes, pedidos, etc. Es importante hacer copias de seguridad de ambas partes para no correr el riesgo de perder la mitad de su tienda.

Lanzar la instalación Lanzar la instalación, accediendo a partir de su navegador habitual, a la carpeta que contiene sus archivos PrestaShop. Por ejemplo, escribir www.mitienda.com si se encuentra en la raíz de su sitio (o localhost en local), et www.mitienda.com/shop/ si se encuentra en una subcarpeta shop (o localhost/shop/ en local).

Etapa 1 – Bienvenido ¿En qué idioma quiere efectuar la instalación? Seleccione el idioma que se utilizará en la ayuda de instalación. La ayuda de instalación PrestaShop se encuentra disponible en tres idiomas: inglés, francés y español.

Esta elección determina igualmente cuál será el idioma por defecto del Front Office y del Back Office después de la instalación. Existen paquetes de idiomas, disponibles gratuitamente que le permiten traducir tanto el Front Office como el Back Office de su tienda en la siguiente dirección:

http://www.prestashop.com/es/downloads/

Método de instalación Para lanzar una nueva instalación de PrestaShop, marque Instalación completa de PrestaShop. Para efectuar la actualización de una tienda PrestaShop a una versión más reciente, marque Actualización. Si el asistente de instalación instalación no detecta la instalación anterior, anterior, sólo se propondrá la instalación completa completa de PrestaShop.

Pulse en

para validar esta epata y pasar a la siguiente.

7/41


PrestaShop


Etapa 2 – Compatibilidad del sistema Por favor, asegúrese de que ha validado los siguientes parámetros Todos los elementos de la siguiente lista deben estar seleccionados en verde.

Si aparece aparece un círculo rojo significa que la condición correspondiente no se ha respetado; respetado; en ese caso es necesario corregir el problema. Las soluciones pueden ser diferentes en función del hosting. Haga una búsqueda de las soluciones que mejor se adapten a su caso en nuestro foro (http://www.prestashop.com/forums).

Parámetros opcionales Todos los elementos de la siguiente lista son opcionales, pero se recomienda que se validen.

Si,

una

vez

solucionados

los

problemas,

quiere

comprobar

su

configuración,

pulse

en

. Pulse en

para validar esta etapa y pasar a la siguiente.

Etapa 3 – Configuración del sistema Para esta etapa, se debe crear una base de datos y poder asi generar las tablas. Ver párrafo « Crear la base de datos » a continuación para más detalles.

Configuración de la base de datos

8/41

PrestaShop



Los cuatro primeros campos Servidor, Nombre de la base, Identificación y Contraseña permiten configurar el acceso a la base de datos creada precedentemente. En el caso de una tienda instalada en local y de la utilización de un programa tipo LAMP (EasyPHP, WAMP, especificar. MAMP, etc.) consulte la documentación oficial del mismo para saber qué parámetros especificar. En el caso de una instalación en un hosting, éste ha debido comunicarle todos los parámetros necesarios (por email o en el panel de administrador de su cuenta). El botón permite comprobar la conexión correcta a la base de datos. No es posible pasar a la etapa siguiente si este test no se realiza con éxito. Si el acceso al servidor no es posible (servidor que no se lanza, nombre de servidor incorrecto, identificador o contraseña incorrectos), aparecerá el siguiente mensaje:

Si no se ha encontrado la base de datos (base de datos no creada, nombre de la base de datos incorrecta), aparecerá el siguiente mensaje:

Si los parámetros son correctos, el test será validado por el siguiente si guiente mensaje:

El campo Prefijo de las tablas permite especificar el prefijo con el que se relacionará el nombre de todas las tablas creadas con la herramienta de instalación PrestaShop en la base de datos. Este prefijo permite diferenciar fácilmente las tablas de varias aplicaciones que utilizarían la misma base de datos. Después, deberá elegir entre dos modos de instalación: in stalación:

Modo completo Las tablas de la base han sido creadas, los principales módulos están instalados y se han añadido ejemplos (categorías, productos, clientes, pedidos, etc.) a la base. ¡I deal para hacer pruebas! Modo simple Las tablas de la base de datos han sido creadas pero no se ha incluido ningún producto ejemplo ni se ha instalado ningún módulo. Tras la instalación, el Front Office aparecerá prácticamente vacío. Este es, es, 9/41


PrestaShop


evidentemente, el modo que debe utilizar uti lizar cuando instala su tienda definitiva , para que no se “contamine” con los datos de ejemplos del otro modo.

Parámetros de envío de emails Para saber si la configuración del envío de emails es funcional, es posible solicitar el envío de un email de test especificando una dirección email en el campo situado en la parte inferior de la página y pulsando en . Por defecto, la función mail() de PHP se utiliza para el envío de emails. emai ls. Los usuarios con más conocimientos, podrán especificar sus propios parámetros marcando la casilla Configurar el envío SMTP y cubriendo los campos que aparecen. Pulse en para validar esta etapa. La herramienta de instalación procede de la creación de las tablas necesarias para que la solución PrestaShop funcione antes de pasar pasar a la siguiente etapa. Esto puede llevar algunos minutos.

Etapa 4 – Configuración de la tienda Nombre de la tienda Escriba el nombre de su nueva tienda PrestaShop. Este nombre se utilizará en la etiqueta y aparecerá en la barra sistema del navegador de visitantes. País por defecto Elija el país que se utilizará utili zará por defecto en su tienda. Logo de la tienda Pulse en Recorrer… para elegir en su disco duro la imagen i magen correspondiente al logo de su tienda. Este campo es opcional, podrá añadir su logo más tarde, desde el Back Office (Back ( Back Office >> Preferencias >> Apariencia). Apariencia ). Nombre Nombre del administrador de la tienda. Apellido Apellido del administrador de la tienda. Dirección email Dirección email del administrador de la tienda. Esta dirección servirá como identificador de conexión en el panel de administrador de la tienda. Contraseña de la tienda Contraseña del administrador de la tienda. Esta debe contener al menos 8 caracteres, únicamente letras, cifras o guiones: - _ Confirmar la contraseña Introduzca de nuevo la contraseña del administrador de la tienda para verificación. 10/41 PrestaShop Documentación: documentación técnica de PrestaShop v1.0 – 16 diciembre 2010 Recibir mis datos por email Si desea recibir sus datos de conexión por email, marque esta casilla. Etapa 5 – ¡Instalación terminada! Esta última etapa recapitula algunos de los datos más importantes de su tienda (nombre de la tienda, nombre y apellidos del administrador). A partir de este momento, ya puede acceder a su tienda pulsando en el cuadro Front Office. Si ha optado por la instalación simple, esta puede tener un aspecto casi vacío. Un clic en el cuadro Back Office le conduce a su panel de administrador. administrador. Pero, de momento, este lo le permite conectarse. Le invita, por razones de seguridad, a suprimir la carpeta install y a renombrar la carpeta admin admin.. 11/41 PrestaShop Documentación: documentación técnica de PrestaShop v1.0 – 16 diciembre 2010 Se aconseja evitar un nombre demasiado simple, como por ejemplo admin2 admin2.. Estas operaciones se hacen manualmente en la carpeta de instalación de su tienda, ya sea en su disco duro para una instalación en local, o bien a través de su cliente FTP si la instalación se hace en un servidor distante. Si, en ese momento, intenta acceder a su panel de administrador pulsando de nuevo en el cuadro Back Office, aparecerá un error 404 "Página no encontrada" ya que, al nombrar de nuevo la carpeta, se ha modificado su camino de acceso. Para poder acceder al mismo, basta con sustituir en la barra de direcciones de su navegador la carpeta admin por el nombre que le ha dado. Ejemplo en local Ejemplo en línea Sustituir: Sustituir: http://127.0.0.1/shop/admin http://myshop.com/shop/admin por: por: http://127.0.0.1/shop/admin567 http://myshop.com/shop/admin567 En ese momento, tendrá acceso al formulario de conexión y al panel de configuración de su nueva tienda PrestaShop. Introduzca la dirección email y la contraseña especificadas especificadas en la etapa 4 de la instalación. Personalice su tienda Para terminar, esta quinta etapa del asistente de instalación le permite descubrir las múltiples maneras de personalizar su tienda PrestaShop, tanto a nivel del aspecto como de las aplicaciones gracias a las numerosas contribuciones disponibles en addons.prestashop.com, addons.prestashop.com, el Marketplace de PrestaShop: PrestaShop: www.addons.prestashop.com 12/41 Documentación: documentación técnica de PrestaShop PrestaShop v1.0 – 16 diciembre 2010 Actualización de PrestaShop Precauciones La actualización es un proceso delicado que afecta a la vez a los archivos y a la base de datos de su tienda PrestaShop; por lo tanto le recomendamos que antes de actualizar su tienda se entrene en una tienda test. Copia de seguridad Copia de seguridad de sus traducciones Para exportar sus traducciones, utilice la herramienta del panel de administración de PrestaShop prevista para tal efecto: Seleccione el idioma que quiera exportar y pulse pul se en Exportar. Repita la operación para cada idioma idi oma que quiera exportar. Copia de seguridad de su base de datos Haga una copia de seguridad de su base de datos utilizando la herramienta de copia de seguridad puesta a su disposición por su hosting (phpMyAdmin u otro). 13/41 Documentación: documentación técnica de PrestaShop PrestaShop v1.0 – 16 diciembre 2010 Copia de seguridad de sus archivos PrestaShop Si su tienda PrestaShop está instalada en una subcarpeta de su sitio Web, la futura actualización se instalará en la misma carpeta. Para hacer una copia de los archivos de la antigua versión de su tienda, renombre de nuevo las carpetas que lo contienen. Por ejemplo, si su tienda está en una carpeta myshop myshop:: /myshop Cambie el nombre por: /myshop_old Si los archivos de su tienda están instalados directamente en la raíz del sitio Web, cree una nueva carpeta: /prestashop_old Y copie en ella el conjunto de su tienda PrestaShop. Instalación de la nueva versión Descarga Descargue la última versión final de PrestaShop en la siguiente dirección: http://www.prestashop.com/es/downloads/ Extraer y copiar Extraer el archivo descargado a su disco duro y transferirlo con ayuda de su cliente FTP a la raíz de su sitio Web o a la carpeta que contiene su tienda. Restaurar los datos a partir de una antigua versión Si ha personalizado alguno de los elementos de PrestaShop (idiomas, plantillas de emails, etc.), deberá realizar de nuevo las modificaciones en la nueva instalación a partir de la copia de seguridad que ha hecho anteriormente. Las imágenes deberán restaurarse a partir de la carpeta /img de la anterior copia hacia la carpeta /img de la nueva instalación. También deberá instalar de nuevo los módulos terceros utilizados en su anterior tienda. Asegúrese de que son compatibles con la nueva versión de PrestaShop. Si por alguna razón, ha modificado el archivo .htaccess .htaccess,, regenere un nuevo archivo .htaccess con la herramienta: Después añada la información que contenía el anterior archivo .htaccess en el nuevo, suprimiendo posibles elementos que estén duplicados. Si utiliza un tema personalizado, copie la carpeta correspondiente a dicho tema a partir de la antigua a ntigua versión: /myshop_old/themes/montheme hacia la nueva: /myshop/themes/montheme Copie el archivo: /myshop_old/config/settings.inc.php de su antigua tienda hacia la nueva: /myshop/config/settings.inc.php 14/41 Documentación: documentación técnica de PrestaShop PrestaShop v1.0 – 16 diciembre 2010 Instalar la actualización Lance el asistente de instalación a partir de su navegador añadiendo /install a la dirección de su tienda: http://www.myshop.com/myshop/install Siga el mismo proceso que para la instalación pero esta vez marque la casilla Actualización en la primera etapa del asistente de instalación. Arquitectura general PrestaShop es un software basado en una arquitectura tres capas, como nos muestra el siguiente esquema: Este modelo retoma el principio de MVC ("Modelo-Vista-Controlador"), simplificándolo y haciéndolo accesible a todos. Nuestro equipo técnico ha decidido no utilizar Framework PHP (Zend Framework, Symfony, CakePHP...) para permitir una mayor visibilidad del código y una modificación más rápida. Esto también permite obtener un mayor rendimiento, ya que el software contiene únicamente el código PHP necesario para un funcionamiento correcto (y no un conjunto de librerías genéricas). Las ventajas de la arquitectura tres capas son numerosas:  La posibilidad de comprender fácilmente el código fuente del software,  Modificaciones rápidas y simples para los desarrolladores,  La posibilidad para los grafistas/integradores de trabajar en la carpeta temas sin necesidad de comprender ni leer el código PHP,  La posibilidad para los desarrolladores de preparar datos y módulos complementarios para el integrador. 15/41 Documentación: documentación técnica de PrestaShop PrestaShop v1.0 – 16 diciembre 2010 Grandes principios (Módulos, Temas) Módulos El concepto El software e-comercio PrestaShop se articula en torno a un principio de módulos que facilita su utilización, su personalización y su extensión. Un módulo es un complemento de PrestaShop que permit e realizar las siguientes acciones:  Aportar una aplicación suplementaria a PrestaShop,  Mostrar elementos suplementarios en su sitio Web (selección de productos, etc.),  Comunicar con actores del comercio en línea (guías de compra, plataformas de pago, responsables de logística, …). La empresa PrestaShop propone gratuitamente con su su software más de 50 módulos que le permiten lanzar su actividad de manera gratuita rápidamente. Más de 400 módulos complementarios se encuentran disponibles en www.addons.prestashop.com Estos han sido realizados por la empresa PrestaShop y/o la comunidad PrestaShop y se comercializan a un precio muy abordable. Si usted es desarrollador, también puede proponer módulos en PrestaShop Addons y percibir el 70% del importe de la venta de sus creaciones. Funcionamiento técnico de un módulo Un módulo se compone de:  Una carpeta con el nombre del módulo, situada en la carpeta módulos de PrestaShop,  Un archivo PHP con el nombre del módulo, situado en la misma carpeta,  Un archivo icono, logo.gif , que representa dicho módulo,  Eventualmente: archivos .tpl, que representan el tema del módulo,  Eventualmente: archivos de idioma, si éste último incluye texto, /themes/modules/,, una carpeta con el mismo nombre que el módulo  Eventualmente: en una carpeta /themes/modules/ que incluye los archivos TPL y archivos de idiomas si es el caso. Esta última carpeta es esencial esencial para cualquier modificación de un módulo que ya existe, para poder adaptarlo sin que afecte al archivo de origen, y permite fundamentalmente mostrar de manera diferente un mismo módulo según el tema utilizado. Ejemplo con el módulo blockinfos disponible gratuitamente en PrestaShop: Cada módulo PrestaShop, si ha sido instalado por el vendedor, puede intervenir en uno o varios "points d'accroche" llamados también "hook" en inglés. Un hook es la representación en la vista a partir del momento 16/41 Documentación: documentación técnica de PrestaShop PrestaShop v1.0 – 16 diciembre 2010 en que se efectúa un tratamiento del módulo o se muestran informaciones (ejemplo: en el carrito, la ficha producto, tras actualizar el stock). Más concretamente un hook es un atajo hacia los diferentes métodos del objeto Módulo asignados al mismo. Lista de los hooks de PrestaShop A continuación presentamos a la lista de los 33 hooks disponibles en PrestaShop: Front-office Inicio y entorno del sitio Nombre del hook Ubicación (archivo) Visible por los internautas Descripción Es llamado entre las etiquetas <head></head> de la página. Ideal parar cargar sus archivos Javascript y CSS. Es llamado en el encabezamiento de la página. header header.php No top header.php Sí leftColumn header.php Sí Es llamado al cambiar la columna de la izquierda. rightColumn footer.php Sí Es llamado al cambiar la columna de la derecha. footer footer.php Sí home index.php Sí Es llamado al pie de página. Es llamado en el centro de la página de inicio. Ficha producto Nombre del hook Ubicación (archivo) Visible por los internautas Descripción extraLeft product.php Sí Es llamado justo encima del link "Imprimir", bajo la foto. extraRight product.php Sí Es llamado debajo del bloque que contiene el botón "Añadir al carrito". productActions product.php Sí productOutOfStock product.php Sí productfooter product.php Sí Es llamado en el interior del bloque que contiene el botón "Añadir al carrito", bajo el botón. Es llamado en el interior del bloque que contiene el botón "Añadir al carrito", debajo de la información "Disponibilidad:". Es llamado encima de las pestañas. Es llamado en la lista de las pestañas como "Más información", "Características", "Accesorios"… productTab product.php Sí productTabContent product.php Sí 17/41 Ideal para añadir una pestaña suplementaria cuyo contenido administrará el hook productTabContent. productTabContent. Es llamado al pulsar en una de las pestañas, ideal para mostrar el contenido correspondiente a una pestaña que ha añadido con el hook productTab. productTab. Documentación: documentación técnica de PrestaShop PrestaShop v1.0 – 16 diciembre 2010 Carrito Nombre del hook cart Ubicación (archivo) Clase: Cart.php Visible por los internautas Descripción No Es llamado justo después de crear o actualizar un carrito. shoppingCart order.php Sí shoppingCartExtra order.php Sí createAccountTop authentication.php Sí createAccountForm authentication.php Sí createAccount authentication.php No customerAccount my-account.php Sí myAccountBlock Módulo: blockmyaccount.php Sí authentication authentication.php No Es llamado debajo del cuadro que muestra los productos contenidos en el carrito. Es llamado debajo del cuadro que muestra los productos contenidos en el carrito, debajo de los botones de navegación. Es llamado en el formulario de creación de una cuenta cliente, encima del bloque "Sus datos personales". Es llamado en el formulario de creación de una cuenta cliente, encima del botón "Inscripción". Es llamado justo después de la creación de una cuenta cliente. Es llamado en Inicio de la cuenta cliente, en la parte inferior de la lista de los links disponibles. Ideal para añadir un link a dicha lista. Es llamado en el bloque "Mi cuenta" en la columna de la izquierda, en la parte inferior de la lista de los links disponibles. Ideal para añadir un link a dicha lista. Es llamado justo tras la identificación de un cliente, únicamente si ésta es válida (dirección email y contraseña correctos). Búsqueda Nombre del hook search Ubicación (archivo) Clase: Search.php Visible por los internautas Descripción No Es llamado después de cada búsqueda. Ideal para analizar y/o optimizar las búsquedas (y resultados de búsqueda) efectuadas por sus clientes. Visible por los internautas Descripción Sí Es llamado debajo de la lista de los transportistas disponibles en el momento del pedido. Ideal para añadir un transportista desarrollado en forma de módulo (ejemplo: transportista punto de entrega). Visible por los internautas Descripción Sí Es llamado para constituir la lista de modos de pago disponibles durante el proceso de pedido. Ideal para permitir Elección de un transportista Nombre del hook extraCarrier Ubicación (archivo) order.php Pago Nombre del hook payment Ubicación (archivo) order.php 18/41 Documentación: documentación técnica de PrestaShop PrestaShop v1.0 – 16 diciembre 2010 elegir un módulo de pago que usted mismo haya desarrollado. paymentReturn order-confirmation.php Sí orderConfirmation order-confirmation.php Sí backBeforePayment order.php No Es llamado al volver a la tienda después de un pago. Ideal para mostrar un mensaje de confirmación y/o para aportar precisiones relativas al pago. Idéntico al paymentReturn. paymentReturn. Es llamado al volver a la tienda tras un pago. Ideal para mostrar un mensaje de confirmación y/o para aportar precisiones relativas al pago. Es llamado al mostrar la lista de modos de pago disponibles. Ideal para redirigir al comprador en lugar de mostrarle la lista (Ejemplo: Checkout 1-click PayPal). Devolución mercancía Nombre del hook Ubicación (archivo) Visible por los internautas orderReturn order-follow.php No PDFInvoice Classe : PDF.php Sí Descripción Es llamado cuando un cliente solicita una devolución del producto, únicamente si no ha aparecido ningún error. Es llamado al mostrar una factura en formato PDF. Ideal para mostrar contenido dinámico o estático en dicha factura. Back-office y tratamientos anexos General Nombre del hook Ubicación (archivo) Visible por los internautas Descripción Es llamado en el encabezamiento, encima de las pestañas. Es llamado entre las etiquetas <head></head> de la página. Ideal para cargar sus archivos Javascript et CSS. backOfficeTop header.inc.php Sí backOfficeHeader header.inc.php No backOfficeFooter footer.inc.php Sí Es llamado a pie de página, encima de la indicación "Powered By PrestaShop". backOfficeHome index.php Sí Es llamado en el centro de la página de inicio. Pedidos y detalle de los pedidos Ubicación (archivo) Visible por los internautas newOrder Classe : PaymentModule.php No Es llamado al crear un nuevo pedido , tras la creación. paymentConfirm Classe : Hook.php No Es llamado cuando el estado de un pedido pasa a "Pago aceptado". updateOrderStatus Classe : OrderHistory.php No Es llamado al cambiar el estado de un pedido, antes del cambio. postUpdateOrderStatus Classe : OrderHistory.php No Es llamado al cambiar el estado de un pedido, tras el cambio. Nombre del hook 19/41 Descripción PrestaShop cancelProduct Documentación: documentación técnica de PrestaShop AdminOrders.php No invoice AdminOrders.php Sí adminOrder AdminOrders.php Sí orderSlip AdminOrders.php No v1.0 – 16 diciembre 2010 Es llamado al suprimir un producto de un pedido, tras la supresión. Es llamado en el detalle de un pedido, antes del bloque relativo a los datos del cliente. Es llamado en el detalle de un pedido, tras el bloque relativo a los datos del cliente. Es llamado al crear un vale, tras la creación. Productos Nombre del hook Ubicación (archivo) Visible por los internautas Descripción addproduct AdminProducts.php No Es llamado al crear o duplicar un producto, tras la creación/duplicación. updateproduct AdminProducts.php No Es llamado al actualizar un producto con una nueva foto, tras la actualización. deleteproduct Clase: Product.php No Es llamado al suprimir un producto, antes de suprimirlo. updateQuantity Clase: PaymentModule.php No Es llamado al validar un pedido cuyo estado no es "Anulado" o "Error de pago", para cada producto del pedido. updateProductAttribute Clase: Product.php No Es llamado al actualizar una declinación de producto, tras la actualización. watermark AdminProducts.php No Es llamado al añadir una imagen a un producto, después de añadirlo. Visible por los internautas Descripción Estadísticas Nombre del hook Ubicación (archivo) GraphEngine Clase: ModuleGraph.php Sí Es llamado al mostrar un gráfico de estadísticas. GridEngine ModuleGridEngine.ph p Sí Es llamado al mostrar una lista de datos estadísticos. AdminStatsModules AdminStatsTab.php Sí Es llamado al mostrar la lista de los módulos de estadísticas. Clientes Nombre del hook adminCustomers Ubicación (archivo) Visible por los internautas Descripción AdminCustomers.php Sí Es llamado en el detalle de un cliente, tras la lista de los grupos de clientes a la que pertenece. Ubicación (archivo) Visible por los internautas Descripción No Es llamado en el momento de actualizar un transportista, tras la actualización. Transportistas Nombre del hook updateCarrier AdminCarriers.php Al mostrar una página del sitio de venta en línea, el motor PrestaShop comprueba, para cada uno de los hooks que la componen, qué módulos debe llamar. 20/41 Documentación: documentación técnica de PrestaShop PrestaShop v1.0 – 16 diciembre 2010 A continuación presentamos un recapitulativo de la arquitectura modular de PrestaShop: Temas El concepto El software e-comercio PrestaShop propone un sistema de temas para permitir a los vendedores de venta en línea una personalización con los colores de la tienda. Este sistema se articula en torno a un motor de plantillas llamado Smarty (http://www.smarty.net http://www.smarty.net)). Este último permite a los integradores desarrollar fácilmente, sin conocimientos técnicos específicos, sus propios temas. PrestaShop propone en estándar un tema neutro, con tonos grises, que permite desarrollar de manera sencilla y gratuita cualquier sector de actividad. Más de 100 temas PrestaShop se encuentran disponibles d isponibles en el sitio www.addons.prestashop.com Estos han sido realizados por la empresa PrestaShop y/o la comunidad PrestaShop y se comercializan a un precio muy abordable. Si usted es grafista/integrador, también puede proponer temas en PrestaShop Adons y percibir el 70% del importe de la venta de sus creaciones. Funcionamiento técnico de un tema Un tema PrestaShop es un conjunto de archivos que permiten modificar el aspecto de su tienda. A continuación le presentamos la principal información que debe tener en cuenta: /temas..  Todos los archivos relativos a un tema gráfico se encuentran en la carpeta /temas  Cada tema está representado por una subcarpeta que lleva su nombre. h  Cada tema está formado por archivos plantillas (.tpl), imágenes (.gif, .jpg, .png), y una o varias hojas de estilo CSS y a veces archivos JS.  Cada tema incluye un archivo preview.jpg en su carpeta, lo que permite al vendedor en línea visualizar el tema en el Back-office y también seleccionarlo. 21/41 PrestaShop Documentación: documentación técnica de PrestaShop v1.0 – 16 diciembre 2010 Así se presenta la arborescencia de un tema PrestaShop: La carpeta css contiene los archivos relativos a los estilos CSS del tema.  La carpeta img contiene los archivos relativos a las imágenes del tema.  carpeta js contiene los archivos relativos a la  La carpeta js Javascript del tema. La carpeta lang contiene las traducciones del tema. No se olvide de incluir los derechos correspondientes (ej: CHMOD 666) para que la herramienta de Back-office pueda guardar las traducciones.  La raíz del tema contiene únicamente los archivos .tpl (plantillas Smarty) así como el archivo  preview.jpg.. preview.jpg Nota: las carpetas css css,, img y js no son indispensables para el funcionamiento de un t ema personalizado. La gestión de las traducciones Para la totalidad de los textos contenidos en sus archivos .tpl, debe incluir la siguiente etiqueta: {l s='Mon texte'} Esto le permitirá traducir fácilmente dichos textos a través de la pestaña: sección Modificar las traducciones del Back-office PrestaShop. Transmitir informaciones (datos) a un tema PrestaShop A continuación presentamos un esquema del funcionamiento de la transmisión de datos entre el corazón de PrestaShop y los temas PrestaShop. Llamar a la aplicación l, en hello.tpl hello.tpl,, permite mostrar el texto en el idioma seleccionado, si se ha traducido como se ha indicado anteriormente. 22/41 Documentación: documentación técnica de PrestaShop PrestaShop v1.0 – 16 diciembre 2010 La arborescencia de PrestaShop Nuestro equipo técnico ha querido separar de manera clara e intuitiva los diferentes elementos del software. A continuación presentamos cada carpeta de la arborescencia de PrestaShop: admin: contiene la totalidad de los archivos relativos admin: relativos al Back-office de PrestaShop. Para más seguridad será necesario renombrarlo tras haber instalado PrestaShop. Importante: le recomendamos que proteja esta carpeta a través de un archivo n.htaccess .htaccess//.htpasswd  classes: contiene la totalidad de los archivos relativos al modelo objeto de PrestaShop. classes: Cada archivo representa una clase (un objeto) y sus propiedades/métodos.  config: contiene los archivos de configuración de PrestaShop. Salvo caso excepcional, config: no debe editarlos manualmente, ya que están administrados por la herramienta de instalación y el Back-office.  css: contiene los archivos CSS que no son relativos a los temas. Se trata por ejemplo de css: los archivos CSS del Back-office.  docs:: contiene documentación y debe suprimirse suprimi rse si trabaja en un entorno de  docs producción.  download:: contiene sus productos desmaterializados (ejemplo: pdf, mp3…). download img: contiene la totalidad de las imágenes, iconos y fotos de PrestaShop, excepto los de los temas. En ella img: encontrará las fotos de las categorías de producto (subcarpeta c), las de los productos (subcarpeta p) e incluso las del Back-office (subcarpeta admin admin). ).  install: contiene la totalidad de los archivos relativos a la herramienta de instalación de PrestaShop. Deberá install: suprimirlo una vez haya instalado PrestaShop para más seguridad.  js::  js contiene los archivos Javascript que no son relativos a los temas. Se trata por ejemplo de los archivos Javascript del Back-office. También contiene el framework Javascript jQuery. mails: contiene la totalidad de los archivos HTML y TXT relativos a los emails enviados desde PrestaShop. mails: Existe una subcarpeta por idioma disponible. Si desea modificar el contenido de un email, deberá ir a esta carpeta para editarlo manualmente.  23/41 PrestaShop Documentación: documentación técnica de PrestaShop v1.0 – 16 diciembre 2010 modules: contiene una subcarpeta por módulo disponible. Si desea desinstalar definitivamente un módulo, modules: comience por desinstalarlo a través del Back-office de PrestaShop antes de suprimir su subcarpeta.   themes:: contiene una subcarpeta por tema disponible. themes tools: contiene herramientas externas integradas en PrestaShop. En elle encontramos fundamentalmente las tools: siguientes herramientas: Smarty (motor de plantilla/tema), FPDF (motor de generación de archivos PDF), Swift (motor de envío de emails), PEAR Xml parser (herramienta PHP).  translations:: contiene una subcarpeta por idioma disponible. Si desea modificar las traducciones, deberá translations hacerlo a través del Back-office de PrestaShop y no directamente en dichas carpetas.  upload: contiene los archivos transmitidos por los clientes durante la compra de productos personalizables upload: (ejemplo: la foto de un cliente para imprimirla en una taza).  Buenos hábitos que deben respetarse (desarrolladores, integradores) A continuación presentamos una lista li sta de buenas costumbres que deben respetarse: 1. Durante la creación de un tema, no mezcle nunca los códigos XHTML y PHP. 2. Durante la creación de un tema, no mezcle nunca los códigos XHTML y CSS, coloque su código en un archivo CSS separado. 3. No efectúe nunca una búsqueda SQL en un controlador PHP (archivos .php en la raíz de PrestaShop), privilegie el uso de los métodos existentes en las clases PHP y/o cree nuevos métodos en dichas clases. 4. Valide su código XHTML y su código CSS gracias al validador W3C http://validator.w3.org/ http://validator.w3.org/.. 5. Compruebe sistemáticamente si no existe ya un método en las clases. 6. No modifique los archivos del corazón de PrestaShop, desarróllelos bajo la forma de módulos para facilitar las actualizaciones. 7. Respete las normas de códigos para un código legible y de fácil mantenimiento. 8. Comente su código, en inglés. 9. Ponga la tienda en mantenimiento a través del Back-office de PrestaShop cuando efectúe correcciones. 10. Utilice el navegador Firefox o Google Chrome e incite a la gente de su entorno a hacer lo mismo. 11. No dude en hacer una donación a PrestaShop si está satisfecho de sus servicios. Securizar su instalación PrestaShop A continuación le damos algunos consejos para que su tienda PrestaShop sea más segura. Se presentan por orden de prioridad: 1. Securice su acceso al Back-office PrestaShop : a. Renombre la carpeta admin tras la instalación de PrestaShop, elija un nombre de carpeta más complicado, con una mezcla de cifras y letras, b. Proteja dicha carpeta con un archivo .htaccess .htaccess//.htpasswd .htpasswd,, o pida a su hosting que lo haga por usted, c. No guarde sus claves de acceso en su ordenador, d. Elija una contraseña compleja (mezcla de cifras y letras) y modifíquela con frecuencia. 2. Securice su instalación de PHP : a. La opción "register_globals" debe configurarse en "Off", b. La opción "magic_quotes" debe configurarse en "Off", c. La opción "allow_include_url" debe configurarse en "Off". 3. Suprima sistemáticamente la carpeta install tras la instalación o actualización de PrestaShop. 4. Suprima sistemáticamente los archivos inútiles tras la instalación o actualización de PrestaShop: a. readme_fr.txt,, readme_en.txt readme_fr.txt readme_en.txt,, readme_es.txt, b. CHANGELOG,, CHANGELOG c. carpeta docs docs.. 5. Prohíba el acceso a sus archivos de tema (templates), gracias a un archivo .htaccess que incluya el siguiente código: 24/41 PrestaShop Documentación: documentación técnica de PrestaShop v1.0 – 16 diciembre 2010 <FilesMatch "\.tpl$"> order deny,allow deny from all </FilesMatch> Opciones de configuración y fine-tuning/performances Este párrafo le permite descubrir las variables de configuración de PrestaShop que no se administran desde el Back-office sino directamente en el seno de los archivos de configuración. En PrestaShop, hay cuatro archivos de configuración:  config/config.inc.php : contiene la configuración del corazón de PrestaShop. Este archivo debe editarse manualmente.  config/defines.inc.php : contiene la definición de las constantes. Anteriormente se encontraban en el archivo settings.inc.php.  config/settings.inc.php : contiene los accesos a la base de datos así como su número de versión. Este archivo se administra directamente desde el Back-office de PrestaShop y la herramienta de instalación.  config/smarty.config.inc : contiene la configuración relativa a la herramienta Smarty (motor de template/tema). Este archivo debe editarse manualmente. Archivo config.inc.php   Si se encuentra en modo producción, recuerde que debe dejar @ini_set('display_errors', 'Off'); en Off. Por el contrario, si se encuentra en fase de desarrollo, le será útil pasar a On para detectar posibles errores. Si se encuentra en modo producción, recuerde que debe dejar define('_PS_DEBUG_SQL_', false); en false. Por el contrario, si se encuentra en fase de desarrollo, le será útil pasar a true para detectar posibles errores. Archivo defines.inc.php  Este archivo contiene la totalidad de los emplazamientos de los archivos, a través del método PHP define(). Si desea modificar esos emplazamientos, no se olvide de modificar las líneas correspondientes. Archivo smarty.config.inc.php     El sistema de cache de Smarty ($smarty->caching) se encuentra desactivado ya que no es compatible con el motor dinámico de PrestaShop. IMPORTANTE: el parámetro $smarty->force_compile , debe pasarse a false cuando tiene un sitio Web en producción. Esto le permitirá ganar hasta 30% de tiempo al cargar las páginas. En contrapartida, al modificar el archivo .tpl, deberá suprimir el contenido de la carpeta /tools/smarty/compile/ (sauf index.php (sauf index.php). ). El parámetro $smarty->compile_check debe dejarse en false. El parámetro $smarty->debugging le permite beneficiarse de informaciones de DEBUG Smarty al mostrar sus páginas. Mejora de las prestaciones de PrestaShop A continuación le damos algunos consejos que le permitirán optimizar las prestaciones de su instalación PrestaShop.  Active el cache MySQL (o pida a su hosting que lo active) y configúrelo en un valor bastante elevado (ejemplo : 256M).  No se olvide de pasar d $smarty->force_compile a false (leer el párrafo "Archivo smarty.config.inc.php").  Utilice técnicas avanzadas de integración tales como Spriting CSS: http://www.alistapart.com/articles/sprites 25/41 PrestaShop  Documentación: documentación técnica de PrestaShop v1.0 – 16 diciembre 2010 Reparta sus elementos estáticos en subdominios diferentes para paralelizar los flujos http de los visitantes. Para ello, vaya al archivo config/defines.inc.php y añada lo siguiente: if ($_SERVER['REMOTE_ADDR'] != '127.0.0.1') { define('_THEME_IMG_DIR_', 'http://img2.xxx.com/'); define('_THEME_CSS_DIR_', 'http://css.xxx.com/'); define('_THEME_JS_DIR_', 'http://js.xxx.com/'); define('_THEME_CAT_DIR_', 'http://img1.xxx.com/c/'); '); define('_THEME_PROD_DIR_', 'http://img1.xxx.com/p/'); '); define('_THEME_MANU_DIR_', 'http://img1.xxx.com/m/'); define('_PS_IMG_', 'http://img1.xxx.com/'); define('_PS_ADMIN_IMG_', 'http://img1.xxx.com/admin/'); } else { define('_THEME_IMG_DIR_', define('_THEME_IMG_DIR _', _THEMES_DIR_._THEME _THEMES_DIR_._THEME_NAME_.'/img/'); _NAME_.'/img/'); define('_THEME_CSS_DIR_', define('_THEME_CSS_DI R_', _THEMES_DIR_._THEME_NAME_. _THEMES_DIR_._THEME_NAME_.'/css/'); '/css/'); define('_THEME_JS_DIR_', _THEMES_DIR_._THEME_NAM _THEMES_DIR_._THEME_NAME_.'/js/'); E_.'/js/'); define('_THEME_CAT_DIR_', define('_THEME_CAT_DI R_', __PS_BASE_URI__.'img/c/'); define('_THEME_PROD_DIR_', define('_THEME_PROD_DI R_', __PS_BASE_URI__.'img/p/'); define('_THEME_MANU_DIR_', define('_THEME_MANU_DI R_', __PS_BASE_URI__.'img/m/'); define('_PS_IMG_', __PS_BASE_URI__.'img/'); define('_PS_ADMIN_IMG_', define('_PS_ADMIN_IM G_', _PS_IMG_.'admin/'); }  Instale un cache de opcode (o pida a su hosting que lo haga), PrestaShop es compatible con eAccelerator: http://www.eaccelerator.net/ http://www.eaccelerator.net/.. Esto le permitirá ganar en términos de carga de procesador. Prácticas Crear un tema PrestaShop Tema por defecto PrestaShop El tema por defecto de PrestaShop es lo bastante sencillo para adaptarse a cualquier sector del comercio en línea. Además, este tema respeta escrupulosamente las normas del W3C y fue optimizado para mostrarse correctamente con todos los navegadores más utilizados. Sin embargo, es posible modificar el tema de su tienda, ti enda, para adaptarlo mejor a su actividad. acti vidad. Lo más sencillo es partir de un tema ya existente. Crear un nuevo tema Los temas se encuentran en la carpeta /themes/ ; es ahí donde deberán ponerse los diferentes temas que pueden aplicarse a la tienda. También aparece una subcarpeta prestashop que corresponde al tema PrestaShop por defecto. Partiremos de ese tema para crear otros. No obstante, le aconsejamos que conserve intacto el tema por defecto de PrestaShop. Una de las razones es que la modificación del tema puede generar errores y el hecho de sustituir temporalmente el tema personalizado por el tema PrestaShop por defecto permite comprobar si el problema proviene del tema personalizado o no. Si el problema desaparece con el tema PrestaShop por defecto, significa que el tema personalizado ha generado el problema. Empecemos por duplicar la carpeta /themes/prestashop/ y nombrarla, por ejemplo, /themes/montheme/ /themes/montheme/.. De esta manera, el tema por defecto se mantiene intacto. 26/41 Documentación: documentación técnica de PrestaShop PrestaShop v1.0 – 16 diciembre 2010 Arborescencia de un tema Archivo / Carpeta preview.jpg 404.tpl address.tpl addresses.tpl authentication.tpl best-sales.tpl breadcrumb.tpl category-tree-branch.tpl category.tpl cms.tpl contact-form.tpl discount.tpl errors.tpl footer.tpl header.tpl history.tpl identity.tpl index.tpl maintenance.tpl manufacturer-list.tpl manufacturer.tpl my-account.tpl new-products.tpl order-address.tpl order-carrier.tpl order-confirmation.tpl order-detail.tpl order-follow.tpl order-payment.tpl order-return.tpl order-slip.tpl order-steps.tpl pagination.tpl password.tpl prices-drop.tpl product-list.tpl product-sort.tpl product.tpl scenes.tpl search.tpl shopping-cart-productline.tpl shopping-cart.tpl sitemap.tpl Descripción Imagen utilizada como previsualización en el apartado de la página Panel de administración >> Preferencias >> Apariencia. Apariencia . La presencia de esta imagen es obligatoria, si no, el tema no puede seleccionarse en este apartado. Página mostrada cuando la página solicitada no se encuentra (erreur 404). Página para añadir o modificar una dirección cliente. Página que lista las direcciones de un cliente. cliente. Página de identificación y de creación de cuenta. Página que lista las mejores ventas. Camino de navegación (raíz de navegación). Utilizado únicamente para el bloque Categorías. Página que lista los productos en el seno de una categoría. Páginas informativas (pestaña Outil >> CMS del BO). Página del formulario de contacto. Página que lista los vales descuento de un cliente. Es llamado por la totalidad de las páginas. Muestra los errores. Pie de página. Encabezado. Página que lista los pedidos de un cliente. Página de modificación de los datos personales de un cliente. Página de inicio. Página de mantenimiento del sitio. Página que lista los fabricantes. Página que lista los productos de un fabricante. Página de inicio de cuenta de un cliente. Página que lista los productos añadidos a ñadidos recientemente. Página del proceso de pedido: Etapa 1 – Elección de las direcciones (entrega, facturación). Página del proceso de pedido: Etapa 2 – elección del modo de entrega. Página de confirmación de pedido p edido (después del pago). Página de detalle del pedido de un cliente. Página de solicitud de devolución por parte de un cliente. Página del proceso de pedido: Etapa 3 – elegir modo de pago. Página de detalle de la devolución de un cliente. Página que lista los vales de un cliente. Barra de evolución del proceso de pedido. Es llamado por todas las páginas que listan productos. Botones que permiten cambiar de página en una lista de productos. Página de cambio de contraseña de un cliente. Página que lista los descuentos. Es llamado por todas las páginas que listan productos. Lista de los productos. Es llamado por todas las páginas que listan productos. Menú que permite filtrar una lista de productos. Página de detalle de un producto. Página de detalle de una escena en una categoría de productos. Página que lista los resultados de una u na búsqueda. Página de detalle de una línea del carrito. Página que lista los productos en el carrito de un cliente. Página de plano del sitio Web. 27/41 Documentación: documentación técnica de PrestaShop PrestaShop supplier-list.tpl supplier.tpl thickbox.tpl css v1.0 – 16 diciembre 2010 Página que lista los proveedores. Página que lista los productos de un proveedor. proveedor. Página de zoom de la foto de un producto. Contiene las hojas de estilo del tema. El archivo global.css incluye los elementos para dar forma a la mayor parte del sitio Web. Excepto si es un usuario avanzado, le recomendamos que deje los archivos de origen. img Contiene las imágenes del tema. Sustituye las imágenes adecuadas por sus propias creaciones. Excepto si es un usuario avanzado, avanzado, le recomendamos que deje los archivos a rchivos de origen. js lang Scripts JavaScript utilizados en el tema. Excepto si es un usuario avanzado, le recomendamos que deje los archivos de origen. Archivos de traducción. Estos archivos son generados por el Back Office y su contenido debe modificarse a partir de la herramienta Panel de Administración >> Herramientas >> Traducciones, Traducciones, apartado Modificar las traducciones. t raducciones. Tema de los módulos Algunos módulos poseen sus propios archivos .tpl. Si usted crea su propio tema, también deberá adaptar el de los módulos. Es posible hacer esta operación sin modificar l os archivos originales de los módulos. Para ello, en la carpeta de su tema, cree una carpeta módulos: /themes/montheme/modules/ Y copie en ella los módulos que va a modificar. Conserve únicamente en estas carpetas los archivos .tpl que podrá modificar en función de sus necesidades. Dichos elementos se utilizarán prioritariamente sobre los originales. Consejos para editar un tema PrestaShop Firebug Para simplificarle el trabajo de integración, le recomendamos que se familiarice con add-on Firebug para Firefox, que le permitirá delimitar rápidamente cada bloque y mostrar las propiedades CSS que se aplican a cada uno. Link útil: http://www.prestashop.com/forums/viewthread/16736 JavaScript Las aplicaciones JavaScript deben archivarse en la carpeta js carpeta js.. Archivo preview.jpg Una vez que haya terminado su tema, no olvide hacer una captura de pantalla, redimensionarla y copiar el archivo en lugar del archivo preview.jpg que ya se encuentra presente en el tema. Para hacer una captura de pantalla de una página Web completa de un tamaño superior a la imagen, puede resultar muy práctico recurrir a un add-on de Firefox como FireShot o ScreenGrab. ScreenGrab. Normas W3C y compatibilidad inter-navegadores Es aconsejable comprobar la compatibilidad de las páginas de su tema con las normas del W3C con ayuda del validador propuesto por este organismo en la página: página : http://validator.w3.org/ . Para terminar, haga un test para mostrar las diferentes páginas de su tema en los navegadores más utilizados (Firefox, Internet Explorer, Chrome, Safari, Opera). 28/41 PrestaShop Documentación: documentación técnica de PrestaShop v1.0 – 16 diciembre 2010 Crear un módulo PrestaShop Principio de los módulos Los módulos son ideales para dar rienda suelta a su imaginación y a su talento de desarrollador, ya que las posibilidades de creación son numerosas. Los módulos pueden mostrar contenido (bloques, texto, etc.), realizar tratamientos (actualizaciones en masa, importar, exportar, etc.), entrar en interfaz con otros programas, etc. Se pueden crear módulos más o menos configurables. Cuanto más se pueda configurar, más sencillo será su uso y por lo tanto responderá a las necesidades de un mayor número de personas. Uno de los principales intereses de un módulo es añadir a la solución aplicaciones sin modificar la base de la misma, para facilitar una futura actualización que borraría las modificaciones aportadas a la base. Es la razón por la que, en la medida de lo posible, el desarrollo de un módulo deberá evitar al máximo la modificación del corazón de la solución , aunque, a veces, sea desafortunadamente inevitable para el desarrollo de ciertas aplicaciones. Arborescencia de los módulos La solución PrestaShop contiene una carpeta /modules en las que se agrupan todos los módulos. Se trata tanto de los módulos integrados a la solución como módulos terceros añadidos posteriormente. Cada módulo está archivado en una subcarpeta distinta en el interior de la carpeta /modules (bankwire bankwire,, birthdaypresent birthdaypresent,, etc.). Estructura de base de un módulo La estructura de base es sencilla y similar para cada módulo, lo que facilita la implementación de nuevos módulos. Para describirla, vamos a crear un módulo rudimentario. Este ejemplo se creará voluntariamente en inglés, ya que por una parte es interesante acostumbrarse a desarrollar en inglés y por otra parte, puesto que el sistema de traducción de PrestaShop es muy flexible, será muy fácil hacer la traducción del módulo. Veremos ese apartado más adelante. Llamaremos al módulo "My module". Para empezar a crear un módulo, empecemos por crear la carpeta que lo va a contener. Esta se llamará como el nombre que queramos dar al módulo. Este nombre debe estar compuesto únicamente por cifras, letras, guiones y paréntesis (-_) todo en minúsculas. Esta carpeta debe contener un archivo PHP responsable del tratamiento de datos. Tendrá el mismo nombre que la carpeta padre. 29/41 PrestaShop Documentación: documentación técnica de PrestaShop v1.0 – 16 diciembre 2010 Este archivo es suficiente para crear un módulo básico. Otros archivos y subcarpetas podrán completarlo más tarde. Un archivo TPL será útil en el caso de mostrar datos en el Front Office. Los archivos TPL deben deben estar situados en la raíz del módulo. Los archivos TPL pueden tener cualquier nombre. Cuando sólo hay uno, se llama a menudo como el módulo, pero es conveniente acostumbra rse a darles nombres explícitos. El archivo mymodule.php va a contener la clase de nuestro módulo. Esta tendrá el mismo nombre que el módulo, y por lo tanto que el repertorio padre. Además, esta clase hereda de la clase Módulo ( /classes/Module.php /classes/Module.php)) o de cualquier clase derivada (PaymentModule, ModuleGridEngine, ModuleGraph) poniendo así a nuestra disposición algunas propiedades y métodos. Fichier mymodule.php <?php class MyModule extends Module { public function __construct() { $this->name = 'mymodule'; $this->tab = 'Test'; $this->version = 1.0; parent::__construct(); $this->displayName = $this->l('My module'); $this->description = $this->l('Description of my module.'); } public function install() { if(parent::install() == false) return false; return true; } } ?> public function __construct() Constructor de la clase. $this->name = 'mymodule'; Atribución de un nombre a nuestra instancia de clase. $this->tab = 'Test'; Título del cuadro que contendrá el módulo en la lista de módulos del Back Office. Puede tratarse de un nombre que ya existe ( Products, Blocks, Stats) o de un nombre personalizado. En este último caso, se creará un nuevo cuadro con dicho título. $this->version = '1.0'; Número de versión del módulo, mostrado en la lista de módulos. parent::__construct(); Llamar al constructor padre. Debe llamarse al constructor obligatoriamente antes de la utilización de los métodos $this->l() y una vez se haya guardado el nombre. En antiguas versiones de PrestaShop (< 1.3) aparece a parece lo siguiente: $this->page = basename(__FILE__, '.php'); Permite recuperar el nombre del archivo, sin la extensión '.php'. __FILE__ es una costante mágica que contiene el camino y el nombre del archivo (desde PHP 4.0.2, __FILE__ contiene siempre el camino absoluto). La función basename() separa el nombre el archivo del resto del camino, y el argumento '.php' sirve para suprimir dicho prefijo. 30/41 Documentación: documentación técnica de PrestaShop $this->displayName = $this->l('My module'); PrestaShop v1.0 – 16 diciembre 2010 Nombre del módulo mostrado en la lista de módulos del Back Office. Veremos más adelante como traducir el texto 'My module'. El llamamiento al método l() se explica más adelante, en el párrafo "Traducción de los módulos ". ". $this->description = $this->l('Description of my module.'); Descripción del módulo mostrado en la lista de módulos del Back Office. El llamamiento al método l() se explica más adelante, en el párrafo "Traducción de los módulos ". ". public function install() { if(parent::install() == false) return false; return true; } Tal cual, este método no es imprescindible, ya que lo único que hace es comprobar la devolución del método Module.php.. Por otra parte, si este método estuviera ausente, el método de la clase madre install() de la clase Module.php sería llamado automáticamente y el resultado sería el mismo. No obstante, mencionamos este método aquí, ya que nos servirá para hacer controles y otras acciones durante la instalación del módulo (creación de tablas, copia de archivos, creación de variables de configuración, etc.). De la misma manera, el módulo podrá contener un método uninstall() que permita personalizar la desinstalación del módulo. Un ejemplo de utilización de este método: public function uninstall() { Db::getInstance()->Execute('DELETE Db::getInstance()->Execut e('DELETE FROM ` '._DB_PREFIX_.'block_cms` '._DB_PREFIX_.'block_cms` WHERE `id_block` ='.intval($this->id)); parent::uninstall(); } Para terminar nuestro módulo de base, vamos a añadir un icono al lado del nombre del módulo en la lista de los módulos. Para ello, basta con poner una imagen 16x16 en la carpeta del módulo y llamarla logo.gif . El sitio http://www.famfamfam.com/lab/icons/silk/ propone una gran biblioteca de iconos gratuitos. A continuación, en la pestaña Panel de administrador >> Módulos, el resultado obtenido con el código anterior. Un clic en el botón llama al método install() del módulo que llama a su vez al método install() de la clase Module.php que añade a su vez una ocurrencia a la tabla ps_module. ps_module. Configuración de un módulo Como decíamos anteriormente, es posible hacer módulos configurables y por lo tanto adaptables a las necesidades de un gran número de usuarios. Para permitir el acceso a la interfaz de configuración de un módulo, hay que añadir una función getContent() a la clase de nuestro módulo. Fichier mymodule.php (extrait) public function getContent () { // Instructions de la page de configuration… configuration… } El simple hecho de añadir esta función provoca la aparición de un enlace >> Configurar. Configurar . 31/41 PrestaShop Documentación: documentación técnica de PrestaShop v1.0 – 16 diciembre 2010 Trasladar un módulo Para que un módulo se traslade a un lugar en el Front Office o en el Back Office, por ejemplo, para mostrar un bloque o para ejecutar un tratamiento en un momento determinado, hay que permitirle utilizar uno de los hooks que hemos visto anteriormente. Para ello, vamos a modificar el código de nuestro módulo de la siguiente manera: Fichier mymodule.php (extrait) public function install() { if(parent::install() == false OR !$this->registerHook('leftColu !$this->registerHook('leftColumn') mn')) return false; return true; } … public function hookLeftColumn($param hookLeftColumn($params) s) { global $smarty; return $this->display(__FILE__, $this->display(__FILE__, 'mymodule.tpl'); } public function hookRightColumn($params) { return $this->hookLeftCol $this->hookLeftColumn($param umn($params); s); } if(parent::install() == false OR !$this->registerHook('leftColu !$this->registerHook('leftColumn') mn')) Si la instalación o el traslado falla, se comunica el fracaso al corazón. public function hookLeftColumn($params) { global $smarty; return $this->display(__FILE__, 'mymodule.tpl'); 'mymodule.tpl'); } Este método permite que se muestre el aspecto final en la columna de la izquierda del Front Office. public function hookRightColumn($params) { return $this->hookLeftColumn($params); $this->hookLeftColumn($params); } Este método permite que se muestre el aspecto final en la columna de la derecha del Front Office. Consiste simplemente en llamar a la función hookLeftColumn(). A partir de este momento ya es posible trasladar este módulo al hook que se desee y en el lugar que se quiera en dicho hook. La elección del o de los hooks a los que se va a trasladar el módulo se hace en la pestaña Panel de administración >> Módulos >> Posiciones del Back Office. Pulse en Trasladar un módulo, módulo , en el campo Módulo seleccionar el módulo que se va a trasladar, en este caso "My module" y en el campo Trasladar el módulo a elegir "Left column blocks" , después pulsar en guardar para validar. 32/41 PrestaShop Documentación: documentación técnica de PrestaShop v1.0 – 16 diciembre 2010 Atención: es inútil trasladar un módulo a un hook para el que no se ha implementado ningún método. Volver a la página Panel de administración >> Módulos >> Posiciones Posiciones,, y en el cuadro "Left column blocks" desplazar el recuadro "My module" hacia el lugar deseado, con ayuda de las flechas o con un arrastrar-colocar. Mostrar un módulo Nuestro módulo necesita mostrar algo en la columna de la izquierda del Front Office. 33/41 PrestaShop Documentación: documentación técnica de PrestaShop v1.0 – 16 diciembre 2010 Como nos muestra Firebug, la columna de la izquierda de PrestaShop está materializada por una etiqueta <div> con el nombre de "left_column". La función hookLeftColumn() va a mostrar como aparece nuestro módulo en esta div. Como ya hemos visto, el archivo que contiene los elementos que van a mostrarse es, en nuestro caso, el archivo mymodule.tpl que hemos pasado en parámetros del método display() en el método hookLeftColumn() . return $this->display(__FILE__, 'mymodule.tpl'); Editemos el archivo mymodule.tpl para añadir el siguiente contenido: Fichier mymodule.tpl (extrait)  <div id="mymodule_block_left" id="mymodule_block_left" class="block"> <h4>Welcome!</h4> 34/41 PrestaShop Documentación: documentación técnica de PrestaShop v1.0 – 16 diciembre 2010 <div class="block_content"> class="block_content"> <ul> <li><a href="{$base_dir}modules/mymodule/page.php" href="{$base_dir}modules/mymodule/page.php" title="Click this link" rel="nofollow"> Click me! </a></li> </ul> </div> </div>  Al cargar de nuevo la página del del Front Office, vemos aparecer el módulo. De momento el hiperlink no conduce a ninguna parte. Para hacer un test, basta con crear el archivo mencionado en mymodule.tpl mymodule.tpl,, es decir un archivo mymodule_page.php en nuestra carpeta mymodule mymodule,, y añadir texto. Fichier mymodule_page.php Welcome to my shop! Un clic en el link nos conduce a nuestra página, pero el aspecto no es muy "PrestaShop". Por lo tanto, vamos a crear un archivo mymodule_page.tpl mymodule_page.tpl,, en el que copiaremos el contenido de nuestro archivo mymodule_page.php mymodule_page.php,, que en nuestro caso es: Fichier mymodule_page.tpl Welcome to my shop! Nota: le recomendamos que nombre sus archivos TPL con nombres explícitos para encontrarlos más fácilmente en el Back Office de PrestaShop posteriormente (en especial a nivel de las traducciones). Y en el archivo mymodule_page.php mymodule_page.php,, vamos por supuesto a llamar al archivo TPL de nuevo para que Smarty se encargue de mostrarlo, pero también vamos a provocar la llamada de archivos TPL encargados de mostrar el resto de la interfaz del Front Office, es decir los archivos header.tpl y footer.tpl footer.tpl.. El código de nuestro archivo pasa así a: Fichier mymodule_page.php <?php global $smarty; include('../../config/config.inc.php'); include('../../header.php'); $smarty->display(dirname(__FILE__).'/mymodule_page.tpl'); include('../../footer.php'); ?> global $smarty; Recupera la instancia corriente de Smarty. Debe hacerse antes del primer display(). include('../../config/config.inc.php'); Carga la configuración de PrestaShop. include('../../header.php'); 35/41 Documentación: documentación técnica de PrestaShop PrestaShop v1.0 – 16 diciembre 2010 include('../../footer.php'); Llamada de los archivos PHP encargados de mostrar el resto del formato, en especial afectando a cada variable Smarty que corresponde a los hooks, su contenido. Estos archivos llaman respectivamente a header.tpl y a footer.tpl que hacen posible el aspecto final. $smarty->display(dirname(__FILE__).'/mymodule_page.tpl'); Llamada de nuestro archivo mymodule_page.tpl para mostrarlo. Si cargamos de nuevo la página del Front Office, ¡el resultado es mucho más atractivo! ;-) Utilización de Smarty Smarty es el motor de plantillas utilizado en PrestaShop. Recorre los archivos TPL en búsqueda de elementos dinámicos para sustituirlos por los datos adecuados antes de mostrar el resultado obtenido. Dichos elementos aparecen entre llaves { … }. El usuario puede crear sus propias variables y usarlas en los archivos TPL. Por ejemplo, en el archivo mymodule_page.php mymodule_page.php,, se crea una variable. Fichier mymodule_page.php <?php global $smarty; include('../../config/config.inc.php'); include('../../header.php'); include(‘MyModule.php'); $mymodule = new MyModule(); $message = $mymodule->l('Welcome to my shop!'); $smarty->assign('messageSmarty', $message); $mymodule->display(dirname(__FILE__).'/mymodule_page.tpl'); include('../../footer.php'); ?> A partir de este momento, se puede pedir a Smarty que muestre el contenido de dicha variable en el archivo page.tpl.. page.tpl Fichier mymodule_page.tpl {$messageSmarty} De la misma manera, el elemento{$HOOK_LEFT_COLUMN} será sustituido por el contenido de la columna de la izquierda, es decir por el contenido de todos los módulos trasplantados al hook correspondiente a dicha columna. Todas las variables Smarty son globales. Hay que tener cuidado en no utilizar un nombre similar a una variable existente para no suprimirla. Se aconseja evitar nombres de variables demasiado sencillos como "productos". A continuación presentamos una lista de variables Smarty comunes a todas las páginas: Archivo / Carpeta Descripción img_ps_dir URL de la carpeta imagen. img_cat_dir URL de la carpeta imagen de las categorías. img_lang_dir URL de la carpeta imagen de los idiomas. img_prod_dir URL de la carpeta imagen de los productos. img_manu_dir URL de la carpeta imagen de los fabricantes. img_sup_dir URL de la carpeta imagen de los proveedores. img_ship_dir URL de la carpeta imagen de los transportistas. 36/41 Documentación: documentación técnica de PrestaShop PrestaShop img_dir css_dir js_dir tpl_dir modules_dir mail_dir pic_dir lang_iso come_from shop_name cart_qties cart currencies id_currency_cookie currency cookie languages logged page_name customerName priceDisplay roundMode use_taxes v1.0 – 16 diciembre 2010 URL de la carpeta imagen del tema. URL de la carpeta css del tema. URL de la carpeta javascript del tema. URL de la carpeta del tema corriente. URL de la carpeta de los módulos. URL de la carpeta de las plantillas de email. URL de la carpeta de descarga. Código ISO del idioma utilizado. URL del origen del usuario. Nombre de la tienda. Nombre de productos en el carrito. El carrito. Las diferentes divisas disponibles. ID de la divisa utilizada. Objet Currency (divisa actualmente utilizada). Cookie del usuario. Lista de los diferentes idiomas disponibles. Indica si el usuario dispone de una cuenta cliente. Nombre de la página. Nombre del cliente (cuando está conectado). Modo de mostrar los precios (con o sin IVA, …). Modo de redondeo utilizado. Indica si los impuestos i mpuestos están activados. Para mostrar todas las variables Smarty disponibles en una página determinada, se puede añadir la siguiente instrucción en el archivo TPL : {debug} Para poner una parte de un archivo TPL en comentario, en lugar de utilizar los comentarios HTML que se encuentran en el código fuente de la página, se pueden usar los comentarios Smarty {* … *}. {* Cette chaîne est un commentaire et ne sera pas affichée. *} Traducción de los módulos Hemos redactado nuestro texto en inglés y queremos traducirlo al francés. Esta labor va a estar simplificada por Smarty así como por la herramienta de traducción de PrestaShop. Actualmente, los textos aparecen de manera estática. Por lo tanto, sea cual sea el idioma elegido en el Front Office o en el Back Office, los textos del módulo siguen estando en inglés. Langue Back Office Front Office Vamos a ver como es posible la traducción de nuestros textos. Para ello, utilizaremos, en los archivos PHP, el método l() de la clase abstracta Module.php Module.php.. Sin embargo, en los archivos TPL los textos estáticos pasarán a ser elementos dinámicos que Smarty sustituirá por la traducción correspondiente en el idioma elegido. De esta manera, en mymodule.php ya hemos visto brevemente el uso del método l() : $this->displayName = $this->l('My module'); $this->description = $this->l('Description of my module.'); 37/41 Documentación: documentación técnica de PrestaShop PrestaShop v1.0 – 16 diciembre 2010 En mymodule.tpl : <h4>Welcome!</h4> … Click me! El uso de elementos dinámicos nos da : <h4>{l s=' Welcome!' mod='mymodule'} </h4> … {l s='Click me!' mod='mymodule'} Y en page.tpl : Welcome to my shop! Nos da: {l s='Welcome to my shop!' mod='mymodule'} El parámetro 'mod' es obligatorio en las plantillas del módulo para que la herramienta de traducción pueda hacer la correspondencia entre la cadena de caracteres que deben traducirse y la traducción, para que ésta pueda mostrarse. Sólo deben usarse apóstrofes ‘ para delimitar las cadenas que hay que traducir. Separar los posibles apóstrofes de la cadena con una barra invertida '\'. Esto nos permitirá traducir nuestras cadenas de caracteres en los idiomas instalados en nuestra tienda. Para ello, vaya a la pestaña Panel de administración >> Herramientas >> Traducciones y en el apartado Modificar las traducciones, seleccionar en la lista "Traducción de los módulos", después pulsar en la bandera francesa para traducir dicho módulo al francés. La sección correspondiente a nuestro módulo se despliega ya que contiene cadenas que aún no se han traducido. Basta entonces con rellenar los campos de la parte derecha con los equivalentes en francés de las cadenas situadas a la izquierda y validar pulsando en “guardar cambios” en la parte superior o inferior de la página. En la carpeta mymodule correspondiente a nuestro módulo, se ha creado un archivo es.php con el contenido de las traducciones. Fichier es.php <?php global $_MODULE; $_MODULE = array(); $_MODULE['<{mymodule}prestashop>mymodule_2dddd $_MODULE['<{mymodule}pre stashop>mymodule_2ddddc2a736e4128ce1cdfd22b041e7f'] c2a736e4128ce1cdfd22b041e7f'] = 'Mi módulo'; $_MODULE['<{mymodule}prestashop>mymodule_d6968577f69f $_MODULE['<{mymodule}pre stashop>mymodule_d6968577f69f08c93c209bd8b6b3d4d5'] 08c93c209bd8b6b3d4d5'] = 'Descripción de mi módulo.'; $_MODULE['<{mymodule}prestashop>mymodule_9a843f20677a52ca79af $_MODULE['<{mymodule}pre stashop>mymodule_9a843f20677a52ca79af903123147af0'] 903123147af0'] = 'Bienvenido !'; $_MODULE['<{mymodule}prestashop>mymodule_f42c5e677c97b2167e7e6b1e0028ec6d' $_MODULE['<{mymodule}pre stashop>mymodule_f42c5e677c97b2167e7e6b1e0028ec6d']] = 'Haga clic en mí !'; $_MODULE['<{mymodule}prestashop>page_c0d7cffa0105851272f8 $_MODULE['<{mymodule}pre stashop>page_c0d7cffa0105851272f83d5c1fe63a1c'] 3d5c1fe63a1c'] = 'Bienvenido a mi tienda'; 38/41 PrestaShop Documentación: documentación técnica de PrestaShop v1.0 – 16 diciembre 2010 Estos archivos de idiomas no deben editarse directamente ya que la utilización de un editor poco apropiado para modificarlos, podría originar problemas. Las traducciones deben realizarse a partir de la herramienta de traducción del Back Office. Si elegimos el francés como idioma en el Front Office o en el Back Office, podemos ver el módulo traducido. Langue Back Office Front Office Para que la herramienta de traducción de PrestaShop tenga en cuenta las traducciones, es necesario que los archivos PHP y TPL que contienen las cadenas que van a traducirse se encuentren situados en la raíz del módulo. Crear una pestaña en el Back-office, así como su clase Este apartado le permite crear en unos minutos una nueva pestaña o subpestaña en el Back-office de PrestaShop. Siga las siguientes etapas en orden: Añada una nueva tabla a su base de datos PrestaShop, llamada ps_test, ps_test, y que tenga dos campos: id_test (INT 11), 11), test (VARCHAR 32)  Cree un archivo vacío llamado Test.php en la carpeta clases clases..  En su archivo, añada las siguientes líneas: <?php class Test extends ObjectModel { /** @var string Name */ public $test; protected $fieldsRequired = array('test'); protected $fieldsSize = array('test' => 64); protected $fieldsValidate = array('test' => 'isGenericName'); protected $table = 'test'; protected $identifier = 'id_test'; public function getFields() { parent::validateFields(); $fields['test'] = pSQL($this->test); return $fields; } } ?> 4. Cree un archivo vacío llamado AdminTest.php en la carpeta admin/tabs admin/tabs.. 5. En su archivo añada las siguientes líneas: <?php include_once(PS_ADMIN_DIR.'/../classes/AdminTab.php'); class AdminTest extends AdminTab { public function __construct() { $this->table = 'test'; $this->className = 'Test'; $this->lang = false; $this->edit = true; $this->delete = true; 39/41 Documentación: documentación técnica de PrestaShop PrestaShop v1.0 – 16 diciembre 2010 $this->fieldsDisplay = array( 'id_test' => array('title' => $this->l('ID'), 'align' => 'center', 'width' => 25), 'test' => array('title' => $this->l('Name'), 'width' => 200)); $this->identifier = 'id_test'; parent::__construct(); } public function displayForm() { global $currentIndex; $defaultLanguage = intval(Configuration::get('PS_LAN intval(Configuration::get('PS_LANG_DEFAULT')); G_DEFAULT')); $languages = Language::getLanguages(); Language::getLanguages(); $obj = $ this->loadObject(true); this->loadObject(true); echo ' <script type="text/javascript"> type="text/javascript"> id_language = Number('.$defaultLanguage.'); Number('.$defaultLanguage.'); </script>'; echo ' <form action="'.$currentIndex.'&submitAdd'. action="'.$currentIndex.'&submitAdd'.$this->table.'=1&tok $this->table.'=1&token='.$this->token en='.$this->token.'" .'" method="post" class="width3"> '.($obj->id ? '<input type="hidden" name="id_'.$this->table.'" name="id_'.$this->table.'" value="'.$obj->id.'" value="'.$obj->id.'" />' : '').' <fieldset><legend><img <fieldset><legend><img src="../img/admin/profiles.png" src="../img/admin/profiles.png" />'.$this->l('Profiles').'< />'.$this->l('Profiles').'</legend> /legend> <label>'.$this->l('Name:').' <label>'.$this->l('Name :').' </label> <div class="margin-form">'; class="margin-form">'; foreach ($languages as $language) echo ' <div id="name_'.$language['id_lang'].'" style="display: '.($language['id_lang'] == $defaultLanguage ? 'block' : 'none').'; float: left;"> <input size="33" type="text" type="text" name="name_'.$language['id name="name_'.$language['id_lang'].'" _lang'].'" value="'.htmlentities($this>getFieldValue($obj, 'name', intval($language['id_lang'])), ENT_COMPAT, 'UTF-8').'" /> * </div>'; $this->displayFlags($languages, $this->displayFlags($langu ages, $defaultLanguage, 'name', 'name'); echo ' <div class="clear"></div> class="clear"></div> </div> <div class="margin-form"> class="margin-form"> <input type="submit" value="'.$this->l(' Save ').'" name="submitAdd'.$this->table. name="submitAdd'.$this->table.'" '" class="button" /> </div> <div class="small">* '.$this->l('Required field').'</div> field').'</div> </fieldset> </form>'; } } ?> En caso de problema Si tiene algún problema, le recomendamos que siga si ga las siguientes etapas para encontrar ayuda: Foro oficial PrestaShop Le damos cita en nuestro foro en http://www.prestashop.com/forums donde podrá efectuar una búsqueda a partir de las palabras claves correspondientes. correspondientes. Para afinar su búsqueda, no dude en utilizar el formulario de búsqueda avanzada que se encuentra a su disposición. Algunos foros, también tienen temas "fijos" de manera persistente en la parte superior de los temas que contienen información muy útil. Herramienta de informes de errores: el "Bug Tracker" La mayoría de los problemas a los que se ven confrontados los miembros de nuestra comunidad aparecen en esta herramienta que todo el mundo puede consultar en la siguiente dirección 40/41 Documentación: documentación técnica de PrestaShop PrestaShop v1.0 – 16 diciembre 2010 http://www.prestashop.com/bug_tracker/ . Si no es el caso, las personas que hayan encontrado la solución a un problema presente, pueden darla para que un desarrollador la corrija. Dicha corrección aparecerá en la siguiente versión de PrestaShop, también se puede consultar en tiempo real en nuestro servidor SVN cuyo "trunk" es accesible públicamente en lectura en la siguiente dirección: http://svn.prestashop.com/trunk/ Para utilizar esta versión SVN para hacer test o desarrollos, puede por ejemplo utilizar unos de los siguientes softwares (lista no exhaustiva): Systema de explotación Linux Mac Windows Software KDESvn svnX TortoiseSVN URL http://kdesvn.alwins-world.de/ http://www.lachoseinteractive.net/fr/communaute/subversion/svnx/telecharger/ http://tortoisesvn.net/ Participar en el foro Si a pesar de todo, no ha encontrado ninguna solución, haga su pregunta en el foro, de la manera más detallada posible, en el apartado correspondiente (idioma, tema, …). Para poder participar en nuestro foro es necesario crear una cuenta. Para ello, pulse en Inscribirse en la parte superior derecha del sitio Prestashop.com. Someter un error en el Bug Tracker Si su problema viene de un bug demostrado, por favor, indíquenoslo, en inglés, en nuestro Bug Tracker, utilizando el siguiente formulario: http://www.prestashop.com/bug_tracker/report/bug/ Sitios oficiales PrestaShop A continuación presentamos la lista de los sitios oficiales de PrestaShop que le permitirán ir más allá en su experiencia del comercio en línea: Dirección www.prestashop.fr Descripción Sitio de la empresa PrestaShop (editor). www.prestashop.com Sitio de la comunidad PrestaShop (Foros, Bug Tracker, demostración, blog). www.addons.prestashop.com www.addons.prestashop.com/fr www.addons.prestashop.com/es Marketplace de la solución PrestaShop que propone módulos y temas para su tienda (versiones anglófona, francófona e hispanófona). www.prestabox.com www.prestabox.fr www.prestabox.es Hosting de tiendas PrestaShop sin imposiciones técnicas. 41/41 </div> </div> </div> </div> </div> </div> </div> </div> <div class="modal fade" id="report" tabindex="-1" role="dialog" aria-hidden="true"> <div class="modal-dialog"> <div class="modal-content"> <form role="form" method="post" action="https://idoc.tips/report/prestashop-ecommerce-guia-tecnica-en-espaol-3-pdf-free" style="border: none;"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button> <h4 class="modal-title">Report "PrestaShop Ecommerce - Guia tecnica en español"</h4> </div> <div class="modal-body"> <div class="form-group"> <label>Your name</label> <input type="text" name="name" required="required" class="form-control" /> </div> <div class="form-group"> <label>Email</label> <input type="email" name="email" required="required" class="form-control" /> </div> <div class="form-group"> <label>Reason</label> <select name="reason" required="required" class="form-control"> <option value="">-Select Reason-</option> <option value="pornographic" selected="selected">Pornographic</option> <option value="defamatory">Defamatory</option> <option value="illegal">Illegal/Unlawful</option> <option value="spam">Spam</option> <option value="others">Other Terms Of Service Violation</option> <option value="copyright">File a copyright complaint</option> </select> </div> <div class="form-group"> <label>Description</label> <textarea name="description" required="required" rows="3" class="form-control" style="border: 1px solid #cccccc;"></textarea> </div> <div class="form-group"> <div style="display: inline-block;"> <div class="g-recaptcha" data-sitekey="6LcHT8sZAAAAAPKfs_PZGhwvz-OHbUMuekQzz5xK"></div> </div> </div> <script src='https://www.google.com/recaptcha/api.js'></script> </div> <div class="modal-footer"> <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> <button type="submit" class="btn btn-success">Send</button> </div> </form> </div> </div> </div> <script> $(document).ready(function () { var inner_height = $(window).innerHeight() - 250; $('#pdfviewer').css({"height": inner_height + "px"}); }); </script> <footer class="footer" style="margin-top: 60px;"> <div class="container-fluid"> Copyright © 2024 IDOC.TIPS. All rights reserved. <div class="pull-right"> <a href="https://idoc.tips/about">About Us</a> | <a href="https://idoc.tips/privacy">Privacy Policy</a> | <a href="https://idoc.tips/term">Terms of Service</a> | <a href="https://idoc.tips/copyright">Copyright</a> | <a href="https://idoc.tips/contact">Contact Us</a> | <a href="https://idoc.tips/cookie_policy">Cookie Policy</a> </div> </div> </footer>  <div class="modal fade" id="login" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"> <div class="modal-dialog" role="document"> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-label="Close" on="tap:login.close">×</button> <h4 class="modal-title" id="add-note-label">Sign In</h4> </div> <div class="modal-body"> <form action="https://idoc.tips/login" method="post"> <div class="form-group"> <label class="sr-only" for="email">Email</label> <input class="form-input form-control" type="text" name="email" id="email" value="" placeholder="Email" /> </div> <div class="form-group"> <label class="sr-only" for="password">Password</label> <input class="form-input form-control" type="password" name="password" id="password" value="" placeholder="Password" /> </div> <div class="form-group"> <div class="checkbox"> <label class="form-checkbox"> <input type="checkbox" name="remember" value="1" /> Remember me </label> <label class="pull-right"><a href="https://idoc.tips/forgot">Forgot password?</a></label> </div> </div> <button class="btn btn-primary btn-block" type="submit">Sign In</button> </form> </div> </div> </div> </div>  <script async src="https://www.googletagmanager.com/gtag/js?id=UA-177830117-1"></script> <script> window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} gtag('js', new Date()); gtag('config', 'UA-177830117-1'); </script> <script src="https://idoc.tips/assets/js/jquery-ui.min.js"></script> <link rel="stylesheet" href="https://idoc.tips/assets/css/jquery-ui.css"> <script> $(function () { $("#document_search").autocomplete({ source: function (request, response) { $.ajax({ url: "https://idoc.tips/suggest", dataType: "json", data: { term: request.term }, success: function (data) { response(data); } }); }, autoFill: true, select: function (event, ui) { $(this).val(ui.item.value); $(this).parents("form").submit(); } }); }); </script>  <div id="IDOCTIPS_cookie_box" style="z-index:99999; background: #97c479; width: 100%; position: fixed; padding: 5px 15px; text-align: center; left:0; bottom: 0;"> Our partners will collect data and use cookies for ad personalization and measurement. <a href="https://idoc.tips/cookie_policy" target="_blank">Learn how we and our ad partner Google, collect and use data</a>. <a href="#" class="btn btn-success" onclick="accept_IDOCTIPS_cookie_box();return false;">Agree & close</a> </div> <script> function accept_IDOCTIPS_cookie_box() { document.cookie = "IDOCTIPS_cookie_box_viewed=1;max-age=15768000;path=/"; hide_IDOCTIPS_cookie_box(); } function hide_IDOCTIPS_cookie_box() { var cb = document.getElementById('IDOCTIPS_cookie_box'); if (cb) { cb.parentElement.removeChild(cb); } } (function () { var IDOCTIPS_cookie_box_viewed = (function (name) { var matches = document.cookie.match(new RegExp("(?:^|; )" + name.replace(/([\.$?*|{}\[\]\\\/\+^])/g, '\\$1') + "=([^;]*)")); return matches ? decodeURIComponent(matches[1]) : undefined; })('IDOCTIPS_cookie_box_viewed'); if (IDOCTIPS_cookie_box_viewed) { hide_IDOCTIPS_cookie_box(); } })(); </script>  </body> </html> <script data-cfasync="false" src="/cdn-cgi/scripts/5c5dd728/cloudflare-static/email-decode.min.js"></script>

PrestaShop Ecommerce - Guia tecnica en español

Recommend Documents