En esta serie, analizaremos los aspectos básicos del desarrollo de temas de Magento..
Magento se ha ganado la reputación de ser una de las plataformas de comercio electrónico más flexibles y potentes que existen hoy en día..
La documentación para ello es escasa, lo que deja a los desarrolladores un enigma que resolver. Es decir, es relativamente simple una vez que te enfrentas a lo básico especialmente Si eres alguien que está cómodo con el desarrollo frontal.
Antes de continuar, es importante comprender el propósito de esta serie y hacia dónde nos dirigimos en las próximas semanas..
Esta serie está dirigida al principiante y cubrirá los conceptos básicos del desarrollo de temas front-end. Si eres un desarrollador avanzado de Magento, puede que esta no sea la serie para ti..
En esta serie, cubriremos los siguientes temas:
Al final de la serie, estará bien equipado para tener al menos una comprensión sólida de los principios del tema Magento y podrá crear y modificar sus propios temas como un profesional.!
Dicho esto, estamos listos para empezar.
Primero, debemos entender la Jerarquía de Magento y dónde encaja nuestro tema. Hay cientos de carpetas y miles de archivos, demasiados para enumerarlos, solo me centraré en los que necesitamos para trabajar.
app / design / frontend / base / default / app / design / frontend / default / default / app / design / frontend // / skin / frontend / base / default / skin / frontend / default / default / skin / frontend / / /
Magento, en su núcleo, tiene dos carpetas. aplicación
y piel
que se corresponden entre sí. los aplicación
directorio contiene archivos que controlan cómo se representan las plantillas de página, la estructura. los piel
el directorio contiene archivos que controlan el aspecto del sitio web, como CSS, JavaScript e imágenes.
Dentro de una subcarpeta de aplicación
y piel
es donde se pueden encontrar nuestros paquetes y temas, una instalación típica de Magento viene con dos paquetes base
y defecto
.
Por lo tanto, antes de continuar, es importante que entendamos qué son los paquetes y los temas. Si hacemos esto bien, todo lo demás caerá en su lugar.bien.
UNA paquete es una colección de temas relacionados, no hay limitación sobre cuántos paquetes podemos tener y debemos tener al menos un paquete presente. Magento viene con un especial paquete, si quieres, llamado base
. Es un repositorio para hacer que los archivos principales de Magento estén disponibles para el front-end. Debes Nunca editar el base
paquetes de archivos, hágalo bajo su propio riesgo. Más sobre esto más adelante.!
UNA tema Por otro lado, hay una subcarpeta directa de un paquete que contiene los archivos que conforman su tienda. Una vez más, no hay ninguna limitación sobre la cantidad de temas que podemos tener dentro de un paquete. Un tema solo puede pertenecer a un paquete y, por convención, cada paquete debe contener un tema denominado "predeterminado", que es el tema principal de ese paquete..
los base
el paquete solo contiene un tema llamado defecto
. Viene incluido con cada instalación de Magento y contiene los archivos front-end que hacen funcionar nuestra tienda. Hay un par de reglas que debemos aceptar con el paquete base.
La primera regla es, como mencioné anteriormente, no editar estos archivos, esto significa que tanto en aplicación / diseño / frontend / base /
y piel / frontend / base /
sólo deben ser utilizados como referencia. Los archivos que necesitan ser editados deben ser copiados desde base
para usted paquete / tema
. Hay un par de razones para esto que explicaré.
Estos archivos son los que hacen los archivos principales de Magento en aplicación / código / núcleo /
disponible para la parte delantera. Simplemente no deberíamos estar editando archivos principales, esta teoría no solo se aplica a Magento sino que también se aplica a otras plataformas, incluyendo WordPress.
El segundo es que cuando actualice Magento, es probable que sobrescriba el base
paquete de archivos. Por lo tanto, todo su arduo trabajo y las ediciones para lograr que su sitio web tenga un aspecto excelente serán eliminados. A menos que hayas tomado una copia de seguridad, prácticamente la has tenido.!
La segunda regla es los archivos en el base
El paquete es parte del sistema de retroceso, que explicaré a continuación. En resumen, Magento recurrirá a los archivos principales que se encuentran en base
Después utiliza su paquete y tema. Cuando retroceda, debería ser el archivo intacto original, no una versión editada..
La tercera regla es no crear ningún tema dentro de la base
paquete.
En resumen, solo uso base
para referencia y si necesita editar un archivo, cópielo a su propio paquete / tema
. Si alguna vez necesitas editar base
hazlo bajo tu propio riesgo y realice un seguimiento de sus cambios, ya que puede necesitar restaurarlos manualmente después de las actualizaciones; de lo contrario, déjelo en paz.!
los defecto
el paquete viene incluido con cada instalación de Magento, pero esta vez tiene varios temas asignados. A partir de la edición comunitaria 1.8.1.0 tiene cuatro temas diferentes de los cuales son:
Al igual que el base
paquete exactamente las mismas reglas se aplican aquí. Los temas en el defecto
Los paquetes son esencialmente solo para fines de demostración. Ideal para tiendas de demostración o si desea mostrar lo que Magento es capaz de ofrecer a sus clientes, es una configuración rápida.
Magento se basa en una lógica de respaldo para que los temas sean más fáciles de mantener y más fáciles de actualizar. Nos permite editar y mantener solo los archivos que necesitamos dentro de nuestro tema. Si no necesitamos editar el archivo, no lo necesitamos en nuestro tema, el archivo será recogido de otra parte. Para explicar esto en detalle necesitamos un ejemplo de la vida real..
Supongamos que tenemos nuestro propio sitio web, que está configurado para usar nuestro propio paquete y tema como:
app / design / frontend / our_package / our_theme / skin / frontend / our_package / our_theme /
Nuestro sitio web solicita un archivo de plantilla llamado 1column.phtml
y un archivo CSS llamado estilos.css
pero Magento no puede ubicar estos archivos dentro de nuestro tema. La lógica de respaldo de Magento ahora buscará el siguiente tema en la jerarquía para los archivos y continuará buscando hasta que localice los archivos solicitados.
El siguiente orden demuestra la lógica alternativa que atraviesa Magento cuando busca nuestros archivos:
app / design / frontend / our_package / our_theme / template / page / 1column.phtml app / design / frontend / our_package / default / template / page / 1column.phtml app / design / frontend / base / default / template / page / 1column. phtml skin / frontend / our_package / our_theme / css / styles.css skin / frontend / our_package / default / css / styles.css skin / frontend / base / default / css / styles.css
Con esta lógica de respaldo en su lugar, significa que podemos tener una base de código limpia manteniendo nuestros temas al mínimo. Solo copia los archivos de base que necesitamos hacer modificaciones para, de lo contrario, dejar los archivos fuera de nuestro tema. Si nuestro sitio web solicita el archivo y no lo tenemos en nuestro tema, se ubicará siguiendo la lógica anterior..
Nota:Si después de Magento ha pasado por la lógica de reserva y el archivo todavía no se puede encontrar, o bien arrojará un error de representación si está en el directorio de la aplicación o si está en el directorio de la piel, es probable que arroje un archivo 404 no encontrado.
Bien, basta de hablar, vamos a empezar a configurarlo..
Primero crearemos nuestra propia configuración de nuestro paquete / tema. Comenzaremos creando las siguientes carpetas:
app / design / frontend / jasonalvis / default / skin / frontend / jasonalvis / default /
Ahora tenemos un paquete llamado Jasonalvis
y un tema llamado defecto
, siéntase libre de cambiar el nombre de su paquete para satisfacer sus necesidades. Mantendremos el nombre del tema como defecto
como cada paquete siempre debe tener una defecto
tema, recordando también que defecto
Es automáticamente parte de la lógica alternativa..
Todo lo que queda por hacer ahora es habilitar el paquete a través del área de administración de Magento. Una vez iniciada la sesión en sistema> configuración. Desde aquí haga clic en. diseño en el menú de la izquierda y luego ingrese el nombre de su paquete en el Nombre del paquete actual campo.
Mientras estamos aquí notamos abajo hay una temas sección. Aquí es donde ingresaríamos el nombre de nuestro tema, pero porque solo estamos usando defecto No necesitamos escribir nada aquí ya que Magento busca automáticamente este nombre.
Para fines de demostración, digamos que tuvimos, por ejemplo, un tema que queríamos usar durante una venta, crearíamos el tema así:
app / design / frontend / jasonalvis / sale / skin / frontend / jasonalvis / sale /
Entonces, todo lo que deberíamos hacer es habilitar el tema en el área de administración tal como lo hicimos con nuestro paquete:
Así que ahora ya sabe cómo configurar su paquete / tema, pero ¿cuál es la mejor para qué escenario??
Bueno, hay innumerables escenarios y estoy seguro de que cada uno de ustedes tiene uno diferente. También se vuelve un poco más complicado cuando tiene una instalación de Magento con una configuración de múltiples tiendas. Como regla general, los temas que contiene el paquete deberían ser similares, de lo contrario deberían dividirse en paquetes..
los defecto
el tema debe ser el centro del sitio y los temas adicionales deben ser simplemente ajustes al centro. Si está cambiando drásticamente cada aspecto del sitio en un tema, probablemente se garantiza que esté en un paquete separado por completo..
Nota: Al crear temas adicionales dentro de nuestro paquete, no tenemos que crearlo en los directorios de la aplicación y de la máscara, solo cree el tema donde sea relevante. Tomemos, por ejemplo, nuestro tema de venta, solo habrá cambios de estilo, diferentes esquemas de color, etc. Los archivos de plantillas reales no se cambiarán. Por lo tanto, solo cree el tema en el directorio de la máscara y edite los archivos relevantes según sea necesario.
Dicho esto, llamémoslo un día. Ahora debería tener un sólido conocimiento de la jerarquía de Magento que deberá utilizar a lo largo del resto de la serie. Como siempre, cualquier pregunta deja un mensaje en los comentarios a continuación..
En el próximo artículo, vamos a echar un vistazo a los conceptos básicos del diseño XML. Mientras tanto, no dude en enviarnos sus preguntas, comentarios o comentarios a continuación.!