Cómo crear un nuevo tema de Magento

Introducción

Magento es una plataforma de comercio electrónico ampliamente utilizada que ofrece capacidades extraordinarias para admitir la personalización de la tienda. Sin embargo, aunque este paquete está dotado de muchas características impresionantes, hay un inconveniente; Magento ofrece solo dos temas predeterminados: Blank y Luma. Al instalar Magento, Luma se manifiesta como el tema front-end predeterminado.


Si desea implementar un tema con clase, no es aconsejable editar los temas predeterminados directamente, ya que esto afectaría el rendimiento y el mantenimiento de su tienda. La mejor opción es crear un nuevo tema que atraiga a los clientes y los incline a volver.

Este tutorial lo ayudará a crear e instalar un nuevo tema personalizado en Magento 2.

Prerrequisitos

Asumiré que has instalado Magento 2. para instalar con éxito la aplicación.

Si se cumple la condición anterior, puede continuar con la instalación.

Paso 1- Crear un directorio de temas

El primer paso al diseñar un tema personalizado en Magento 2 es crear el directorio de temas. Los directorios de temas en Magento 2 se encuentran en aplicación / diseño / interfaz. Ve a la Cpanel > Administrador de archivos > Public_html >Magento

Abre el App carpeta y busque el Diseño carpeta.

Abre el Carpeta de diseño y crear un nuevo directorio en el carpeta de front-end. Nombra el directorio HostAdvice.

A continuación, cree un directorio de temas titulado Mi tema en esta carpeta.

¡Eso es! El directorio de temas se creó correctamente..

Paso 2 – Declarando el tema

Una vez que cree el directorio de temas requerido, luego cree un theme.xml archivo en el directorio aplicación / diseño / interfaz / HostAdvice / Mytheme. Copie y pegue el siguiente código en el archivo:

Mi tema
Magento / blanco

media / preview.jpg

Paso 3 – Registro del tema

En el directorio aplicación / diseño / interfaz / HostAdvice / Mytheme, crear un registro.php archivo. Copie y pegue el siguiente código en el archivo.

<?php
\ Magento \ Framework \ Component \ ComponentRegistrar :: register (
\ Magento \ Framework \ Component \ ComponentRegistrar :: THEME, ‘frontend / HostAdvice / Mytheme’, __DIR__
);

Paso 4: subir la imagen de vista previa

Por ahora, el tema está registrado. A continuación, suba la imagen de vista previa. Ir a este directorio aplicación / diseño / interfaz / HostAdvice / Mytheme / media y suba la imagen de vista previa en formato .jpg.

Paso 5: declarar el logotipo del tema

Para declarar el logotipo del tema, vaya a app / design / frontend / HostAdvice / Mytheme / Magento_Theme / layout y crear un default.xml archivo.

Copie el código a continuación y péguelo en el default.xml.

Paso 6: subir el logotipo del tema

Ir aplicación / diseño / interfaz / HostAdvice / Mytheme / web / images y suba su imagen de logotipo preferida en formato .png.

¡Eso es todo! Ahora podemos subir el nuevo tema personalizado.

Paso 7 – Aplicando el tema

Antes de configurar el tema, debe actualizar y vaciar el caché para eliminar cualquier problema potencial.

Para actualizar su caché, ejecute el siguiente comando:

# php bin / magento setup: actualización

Luego ejecute el siguiente comando para vaciar el caché:

# php bin / magento cache: flush

Inicie sesión en el área de administración de su tienda Magento 2. Hacer clic Contenido y seleccione Temas.

Hacer clic Editar,

Seleccione Mi tema de las opciones disponibles y haga clic Guardar configuración.

A continuación, abra su terminal SSH y acceda al directorio raíz de su Magento 2. Ejecute los comandos a continuación uno por uno

# rmr -rf var / di / * var / generation / * var / cache / * var / log / * var / page_cache / * var / session / * var / view_preprocessed / * pub / static / *

# php bin / magento setup: actualización
1
# php bin / magento setup: actualización

# php bin / magento setup: db-schema: upgrade
1
# php bin / magento setup: db-schema: upgrade

# php bin / magento setup: di: compile
1
# php bin / magento setup: di: compile

# php bin / magento setup: static-content: deploy
1
# php bin / magento setup: static-content: deploy

# indexador php bin / magento: reindex
1
# indexador php bin / magento: reindex

# php bin / magento cache: clean
1
# php bin / magento cache: clean

# php bin / magento cache: flush
1
# php bin / magento cache: flush

Una vez que haya terminado, abra la página de inicio de la tienda Magento. La página debe mostrar el nuevo tema personalizado..

Conclusión

¡Eso es! Ha creado con éxito un nuevo tema personalizado y lo ha aplicado en su tienda Magento. Esto evitará que edite los temas predeterminados de Magento, evitando así cualquier problema que pueda ser causado por la modificación de los archivos principales.

Echa un vistazo a estos 3 principales servicios de alojamiento de Magento:

FastComet

Precio inicial:
$ 2.95


Fiabilidad
9,7


Precios
9.5


Fácil de usar
9,7


Apoyo
9,7


Caracteristicas
9.6

Leer comentarios

Visita FastComet

Alojamiento A2

Precio inicial:
$ 3.92


Fiabilidad
9.3


Precios
9.0


Fácil de usar
9.3


Apoyo
9.3


Caracteristicas
9.3

Leer comentarios

Visita A2 Hosting

ScalaHosting

Precio inicial:
$ 4.95


Fiabilidad
9.4


Precios
9.5


Fácil de usar
9.5


Apoyo
9.5


Caracteristicas
9.4

Leer comentarios

Visita ScalaHosting

Artículos de procedimientos relacionados

  • Cómo enviar correos electrónicos en Magento 2?
    intermedio
  • Cómo crear un widget personalizado en Magento 2
    intermedio
  • Cómo integrar Google Adwords y Google Analytics con Magento?
    intermedio
  • Cómo crear productos de paquete en Magento 2
    intermedio
  • Cómo configurar un mapa del sitio en Magento 2
    intermedio
Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me