[Sergio Iglesias](https://sergioiglesias.net) · Blog sobre Joomla

# Migración de mi web a Joomla 4 y rediseño en Bootstrap 5

[ Añadir a fuentes preferidas ](https://www.google.com/preferences/source?q=sergioiglesias.net)   01 Septiembre 2021    [Recomendaciones](https://sergioiglesias.net/blog/recomendaciones)   3 - 5 minutos    Visitas: 3921  -
- [ Desarrollo Joomla ](https://sergioiglesias.net/etiquetas/desarrollo-joomla)
- [ Proyectos Joomla ](https://sergioiglesias.net/etiquetas/proyectos-joomla)
- [ Plantillas Joomla ](https://sergioiglesias.net/etiquetas/plantillas-joomla)
- [ Portfolio Joomla ](https://sergioiglesias.net/etiquetas/portfolio-joomla)
- [ Migración Joomla ](https://sergioiglesias.net/etiquetas/migracion-joomla)

  ![](https://sergioiglesias.net/images/blog/recomendaciones/sergioiglesiasnet-joomla4.webp) Hoy tengo el placer de presentarte mi nueva página web. SergioIglesiasNET se renueva: ya está **migrada a Joomla 4** y cuenta con un rediseño en Bootstrap 5.

Migración de mi página web a #Joomla4 - Pasos a seguir para actualizar #Joomla a su nueva versión - #MejorConJoomla

  [  Compártelo ](https://www.linkedin.com/sharing/share-offsite/?url=https://sergioiglesias.net/blog/recomendaciones/migracion-de-mi-web-a-joomla-4-y-rediseno-en-bootstrap-5?highlight=WyJtaWdyYWNpXHUwMGYzbiIsIm1pZ3JhY2lvbiIsIm1pZ3JhY2lvbmVzIl0= "Compártelo")   [  Postéalo ](https://twitter.com/intent/tweet?url=https%3A%2F%2Fsergioiglesias.net%2Fblog%2Frecomendaciones%2Fmigracion-de-mi-web-a-joomla-4-y-rediseno-en-bootstrap-5%3Fhighlight%3DWyJtaWdyYWNpXHUwMGYzbiIsIm1pZ3JhY2lvbiIsIm1pZ3JhY2lvbmVzIl0%3D&text=Migraci%C3%B3n%20de%20mi%20p%C3%A1gina%20web%20a%20%23Joomla4%20-%20Pasos%20a%20seguir%20para%20actualizar%20%23Joomla%20a%20su%20nueva%20versi%C3%B3n%20-%20%23MejorConJoomla "Postéalo")   [  Envíalo ](https://api.whatsapp.com/send?text=Migraci%C3%B3n%20de%20mi%20p%C3%A1gina%20web%20a%20%23Joomla4%20-%20Pasos%20a%20seguir%20para%20actualizar%20%23Joomla%20a%20su%20nueva%20versi%C3%B3n%20-%20%23MejorConJoomla%20-%20https%3A%2F%2Fsergioiglesias.net%2Fblog%2Frecomendaciones%2Fmigracion-de-mi-web-a-joomla-4-y-rediseno-en-bootstrap-5%3Fhighlight%3DWyJtaWdyYWNpXHUwMGYzbiIsIm1pZ3JhY2lvbiIsIm1pZ3JhY2lvbmVzIl0%3D "Envíalo")

Te voy a contar cómo ha sido todo el proceso de **migración a Joomla 4** y cómo me he ido planificando.

## Proceso de migración a Joomla 4

Este proceso de migración a Joomla 4 comienza con una buena planificación.

Este paso quizá sea el más complicado ya que muchas cosas no dependen de ti. Pero hay que planificar para garantizar tu éxito.

Como sabes, a comienzos de año siempre me marco unos [objetivos para esa página web](https://sergioiglesias.net/blog/general/resumen-del-2020-y-objetivos-para-el-2021) y, entre ellos, estaba este que te estoy contando: **migrar mi página web a Joomla 4** y **desarrollar una nueva plantilla para Joomla 4**.

Ya por entonces había estado analizando lo que necesitaba para el rediseño y comencé con el template.

Al final opté por un diseño de Xiaoying Riley (que es una diseñadora que me gusta mucho y que sigo desde hace tiempo).

### Necesidades para el nuevo template

Los requisitos que me había marcado para el rediseño son los siguientes:

- **Basada en Bootstrap 5**: aquí tengo que decir que Xiaoying trabaja muy bien este framework y el HTML que entrega en sus proyectos es muy limpio.
- **Diseño centro en el contenido**: es decir, que el contenido tenga más protagonismo y elimine distracciones al usuario (como puedes ver, la lectura de los artículos ahora es mucho más sencilla que en la versión anterior).
- **Modo oscuro**: cada vez se está imponiendo más este estilo y quería tener el mío (aunque algunas cositas tengo que mejorarlas en cuanto a temas de accesibilidad se refiere).
- **Buenos resultados en Lighthouse**: solo con tener buenos datos ya vas a posicionar mejor en los motores de búsqueda y, este template, tenía buenos resultados (pero te garantizo que iré mejorándolos poco a poco).

Una vez definidos los requisitos y tener la plantilla candidata ya todo era ponerse con el **desarrollo del template para Joomla 4**.

### Joomla 4: qué mejoras trae

Con plantilla elegida, el siguiente paso era comenzar a "trastear" con la nueva versión de Joomla que tanta expectación a levantado.

Entre sus nuevas funcionalidades y mejoras tenemos las siguientes:

- Mejoras en el código PHP que permite integraciones con lenguajes modernos.
- API para poder conectar con otros servicios.
- Gestor multimedia avanzado (el que teníamos debaja mucho que desear, la verdad).
- Accesibilidad y usabilidad.
- Mayor seguridad.
- Y otras muchas más que puedes ver en la [landing oficial del proyecto](https://www.joomla.org/4/en/).

El comienzo fue con versiones muy iniciales (Alpha 1 y 2).

Después, por temas de carga de trabajo, lo dejé aparcado.

Ya a finales de julio, con la salida de Joomla 4 RC5 y, sobre todo, Joomla 3.10 RC1, es cuando realicé la migración de mi web.

Primero hice una [copia completa con Akeeba Backup](https://sergioiglesias.net/blog/joomla/como-configurar-akeeba-backup-gestiona-copias-de-seguridad-en-joomla) y la instalé en un entorno de desarrollo.

El primer intento que hice fue "a lo bruto"; es decir, actualicé a 3.10 y de ahí directamente a Joomla 4.

Te podrás imaginar qué ocurrió... Error 500.

Era lo más probable que pudiera pasar.

En el segundo intento ya seguí los [pasos que hay en la documentación oficial](https://docs.joomla.org/Joomla_3.x_to_4.x_Step_by_Step_Migration/es) (muy bien explicados, la verdad) y no tuve ningún problema.

**Básicamente los pasos que seguí para la migración a Joomla 4 fueron los siguientes**:

1. Actualización a Joomla 3.10
2. Copia de seguridad
3. Analizar la información del Pre-Update Checker: te indica extensiones con las que podrás tener problemas a la hora de migrar a Joomla 4
4. Desinstalar extensiones de terceros que tenía (en mi caso no me hacían falta en la nueva ya que ahora hago todo con el Core)
5. Desinstalar el template que tenía a media y poner el que viene de forma nativa en Joomla 3 (protostar)
6. Migrar a Joomla 4

Como puedes ver, el proceso es bastante sencillo.

También es verdad que mi web no tiene funcionalidades complejas ni desarrollos a medida que impliquen complicaciones.

 El grado de complejidad de la migración de tu página web a Joomla 4 dependerá del tipo de proyecto que tengas (comercio electrónico, desarrollos a medida...) y las extensiones que hayas utilizado.

El resultado final

Pues bien, el resultado final es el que estás viendo.

Espero que te guste este nuevo formato de web que he preparado pensando en ti.

 En los próximos artículos te desvelaré algunos trucos que he utilizado para completar la migración y las extensiones de terceros que he utilizado en esta nueva etapa y por qué las he elegido.

Ahora te invito a escribir en los comentarios qué te ha parecido el rediseño y que mejorarías tu.

 También te invito a [escuchar el podcast de MastermindJoomla](https://mastermindjoomla.com/112-primeras-migraciones-a-joomla-4) en el que hablo sobre todo esto (gracias Carlos y Andrea por dejarme participar en vuestro programa una vez más).

Y, por supuesto, a compartir el artículo en twitter con tus amigos, seguro que a alguien le viene bien ;-)

Migración de mi página web a #Joomla4 - Pasos a seguir para actualizar #Joomla a su nueva versión - #MejorConJoomla

  [  Compártelo ](https://www.linkedin.com/sharing/share-offsite/?url=https://sergioiglesias.net/blog/recomendaciones/migracion-de-mi-web-a-joomla-4-y-rediseno-en-bootstrap-5?highlight=WyJtaWdyYWNpXHUwMGYzbiIsIm1pZ3JhY2lvbiIsIm1pZ3JhY2lvbmVzIl0= "Compártelo")   [  Postéalo ](https://twitter.com/intent/tweet?url=https%3A%2F%2Fsergioiglesias.net%2Fblog%2Frecomendaciones%2Fmigracion-de-mi-web-a-joomla-4-y-rediseno-en-bootstrap-5%3Fhighlight%3DWyJtaWdyYWNpXHUwMGYzbiIsIm1pZ3JhY2lvbiIsIm1pZ3JhY2lvbmVzIl0%3D&text=Migraci%C3%B3n%20de%20mi%20p%C3%A1gina%20web%20a%20%23Joomla4%20-%20Pasos%20a%20seguir%20para%20actualizar%20%23Joomla%20a%20su%20nueva%20versi%C3%B3n%20-%20%23MejorConJoomla "Postéalo")   [  Envíalo ](https://api.whatsapp.com/send?text=Migraci%C3%B3n%20de%20mi%20p%C3%A1gina%20web%20a%20%23Joomla4%20-%20Pasos%20a%20seguir%20para%20actualizar%20%23Joomla%20a%20su%20nueva%20versi%C3%B3n%20-%20%23MejorConJoomla%20-%20https%3A%2F%2Fsergioiglesias.net%2Fblog%2Frecomendaciones%2Fmigracion-de-mi-web-a-joomla-4-y-rediseno-en-bootstrap-5%3Fhighlight%3DWyJtaWdyYWNpXHUwMGYzbiIsIm1pZ3JhY2lvbiIsIm1pZ3JhY2lvbmVzIl0%3D "Envíalo")

---

**Artículos sobre la migración de mi web a Joomla 4:**

- [ Migración de mi web a Joomla 4 y rediseño en Bootstrap 5](https://sergioiglesias.net/blog/recomendaciones/migracion-de-mi-web-a-joomla-4-y-rediseno-en-bootstrap-5)
- [ Extensiones utilizadas en mi nueva web con Joomla 4](https://sergioiglesias.net/blog/extensiones/extensiones-utilizadas-en-mi-nueva-web-con-joomla-4)
- [ Tips para ayudarte con tu migración a Joomla 4](https://sergioiglesias.net/blog/joomla/tips-para-ayudarte-con-tu-migracion-a-joomla-4)

[ Añadir a fuentes preferidas ](https://www.google.com/preferences/source?q=sergioiglesias.net)Gratuito · Primer paso recomendado

### ¿No sabes bien en qué estado

está tu web Joomla?

Antes de decidir si hay que arreglar, migrar o mantener, conviene saber qué está pasando. Reviso el estado de tu web — versión de Joomla, extensiones y lo que se pueda ver — y te digo qué conviene hacer y en qué orden.

Versión de Joomla y ruta de actualización Estado de extensiones Plan de acción con recomendaciones Informe por email + HTML

[ Solicitar revisión gratuita sin compromiso ](https://sergioiglesias.net/revision-joomla-gratis)Respuesta en 24–48 h laborables

[![Sergio Iglesias](https://sergioiglesias.net/images/sergiois-joomla-web.png)](https://sergioiglesias.net/sobre-mi)##### Consultor Web Joomla Senior

Soy [Sergio Iglesias](https://sergioiglesias.net/sobre-mi). Ayudo a empresas, instituciones y profesionales a convertir su web en una herramienta real de negocio: segura, escalable y fácil de gestionar. Soy especialista en migraciones complejas de Joomla sin pérdida de datos, desarrollo de extensiones y plantillas a medida y ofrezco mantenimiento y evolución de tu CMS.

[](https://x.com/sergiois "Sergio Iglesias en X") [](https://www.linkedin.com/in/sergiois "Sergio Iglesias en Linkedin") [](https://github.com/sergiois "Sergio Iglesias en Github") [](https://sergiois.github.io/ "Extensiones Joomla de Sergio Iglesias")

### Suscríbete a mi newsletter

¿Te ha gustado el artículo? Suscríbete a mi newsletter y recibe contenido exclusivo.
Podrás hacer gratis un **Curso de desarrollo de plantillas Joomla**.

[Quiero apuntarme!](https://sergioiglesias.net/newsletter)

###  2 comentarios

- [ ![](https://www.gravatar.com/avatar/94cff7c789d7e631efdca0814fadde87fdba7d8e17f8f6e47009d196e7894b89?s=48&r=G&d=mp) ](https://www.gravatar.com/94cff7c789d7e631efdca0814fadde87fdba7d8e17f8f6e47009d196e7894b89)

     Marcos

     [ Lunes, 07 Febrero 2022 22:51 ](https://sergioiglesias.net/blog/recomendaciones/migracion-de-mi-web-a-joomla-4-y-rediseno-en-bootstrap-5?highlight=WyJtaWdyYWNpXHUwMGYzbiIsIm1pZ3JhY2lvbiIsIm1pZ3JhY2lvbmVzIl0=&akengage_cid=482#akengage-comment-482)

      Gracias por este artículo Sergio, me servirá de mucho.
    El rediseño me parece excelente, me gusta mucho el Template que desarrollaste.

    Sobre el Template, comentas que "teniendo la plantilla candidata ya todo era ponerse con el desarrollo del template para Joomla 4", puedes dar detalles o indicios de como hacer ello.

    Saludos y felicitaciones por el nuevo sitio en Joomla 4.
    Marcos.

    - [ ![](https://www.gravatar.com/avatar/b66fba1a78a3ea7b41e98a8e43ec390a0f33e7df0759e8a53879ec6be4be9d0f?s=48&r=G&d=mp) ](https://www.gravatar.com/b66fba1a78a3ea7b41e98a8e43ec390a0f33e7df0759e8a53879ec6be4be9d0f)

         sergiois

         [ Martes, 08 Febrero 2022 07:38 ](https://sergioiglesias.net/blog/recomendaciones/migracion-de-mi-web-a-joomla-4-y-rediseno-en-bootstrap-5?highlight=WyJtaWdyYWNpXHUwMGYzbiIsIm1pZ3JhY2lvbiIsIm1pZ3JhY2lvbmVzIl0=&akengage_cid=483#akengage-comment-483)

         Hola Marcos,

        Te recomiendo que te registres a mi newsletter para poder hacer el [curso de desarrollo de plantillas](https://sergioiglesias.net/curso-desarrollo-plantillas-joomla). Aunque el curso es para Joomla 3, si tienes los conceptos, adaptarla a Joomla 4 no te llevará apenas tiempo.

###  Deja tu comentario

 En respuesta a Some User

 Nombre \*

 Dirección de email \*

 Texto del comentario \*

 Doy mi consentimiento para que mi información personal sea recopilada y procesada por este sitio para aceptar y mostrar mi comentario, así como para notificarme sobre las respuestas a él según la [Declaración de privacidad](https://sergioiglesias.net/politica-privacidad) del sitio. \*