Cómo instalar XAMPP en un ordenador Mac para trabajar con WordPress

9 de diciembre - 2023

Cuando deseamos trabajar en un nuevo proyecto, o realizar pruebas sobre una página web ya existente, y no queremos que los cambios se publiquen o puedan romper lo que ya está online, lo mejor es convertir nuestro ordenador en un servidor local para trabajar sin riesgos ni contratiempos. Si decides seguir este tutorial hasta el final, aprenderás a instalar XAMPP en un ordenador Mac y tener una plataforma de pruebas gratuita para lo que quieras.

Pero, además, también aprenderás a instalar WordPress en local, corregir los problemas de subida de archivos (actualizaciones, temas, medios o plugins) y configurar una cuenta de email para que funcione de forma real en tu proyecto offline.

Suscríbete:

Antes de empezar, quiero que entiendas que XAMPP fue creado inicialmente para Windows, y más tarde crearon las versiones para Linux y Mac. Al ser sistemas muy diferentes en cuanto a la administración de la seguridad y gestión de los archivos, en macOS nos encontraremos con algún contratiempo que tendremos que solventar cuando aparezca.

Siempre podréis instalar otro paquete diferente para convertir vuestro ordenador en un servidor local con MAMP, es mucho más sencillo, pero con menores posibilidades de configuración.

Qué se necesita para instalar WordPress con XAMPP en un ordenador con Mac

Para empezar nuestro proyecto, o página web basada en WordPress, no necesitamos gastar nada, todo lo que necesitamos podemos conseguirlo de las páginas oficiales de forma gratuita y sin limitaciones. Vamos a descargar en el escritorio, o en una carpeta localizable de nuestro ordenador, los archivos de instalación de XAMPP y de WordPress.

Para hacer funcionar el envío de emails, instalaremos un plugin que permite conectar con un servicio externo. Así que tendremos que crearnos una cuenta gratuita en Brevo (antiguo Sendinblue).

Descargar WordPress en el ordenador

Accediendo a la página oficial de wordpress.org podemos ir a la descarga de los archivos de instalación de WordPress para guardarlos y reservarlos hasta que los necesitemos.

Descargar WordPress para instalar XAMPP en un ordenador Mac
Descargar WordPress en el ordenador

Debéis fijaros en la versión de PHP recomendado que aparece debajo del botón de descarga, en el siguiente punto lo necesitaremos para saber que versión de XAMPP tenemos que descargar.

Qué versión de XAMPP descargar en el ordenador

Abrimos la página oficial de XAMPP en el navegador y comprobamos que versiones son las más recientes para descargar. Si eres desarrollador te interesa disponer de la más nueva, pero para utilizar con WordPress no siempre es lo más aconsejable.

Con WordPress vamos a depender de complementos, temas y plugins de terceros que en muchos casos estarán programados con versiones de PHP más antiguas. Si trabajamos con la versión más nueva, probablemente tengamos problemas a la hora de configurar las opciones o de hacerlo funcionar correctamente.

Actualizar cualquier plugin o tema de WordPress requiere un esfuerzo adicional que los desarrolladores no aplican hasta el último momento, cuando la versión de PHP que han utilizado deja de tener soporte y actualizaciones.

Yo aconsejo elegir una versión por encima de la que recomienda WordPress, ya que las versiones de PHP suelen solaparse y antes de que llegue al final de su vida la versión antigua , convive una temporada con la versión que la sucederá.

Para elegir una versión diferente a la más nueva que aparece en la página principal para instalar XAMPP en un ordenador Mac, debemos acceder a la pestaña "Descargas" del menú superior o picar en el botón donde pone "Pulsa aquí para otras versiones".

Descargar versión apropiada de XAMPP para MacOS en ordenadores Mac
Descargar versión apropiada de XAMPP

Si deseamos una versión aún más antigua, podemos navegar a través de la página de "Más Descargas" desde el enlace que aparece en la parte inferior.

Pasos para instalar XAMPP en Mac

Con el archivo descargado, procedemos a iniciar la instalación picando dos veces sobre él. Se abrirá un disco virtual con el instalador que ejecutaremos y aceptaremos como "app descargada de internet" dando acceso con nuestra clave del ordenador.

Permiso para instalar aplicaciones descargadas de internet en Mac
Permiso para instalar aplicaciones descargadas de internet

Ahora procedemos a seguir las indicaciones que vayan apareciendo en las diferentes ventanas de la instalación. Basta con ir dando a "Siguiente" (Next), sin modificar nada, hasta que aparezca una barra de progreso que indica que está copiando los archivos en la ruta de instalación predeterminada.

Inicio de la instalación de XAMPP

Cuando termine la instalación de XAMPP en el ordenador Mac, nos pedirá aceptar las conexiones de red entrantes para los servicios del servidor local. Estos servicios son Apache (httpd), Base de datos (mysqld) y ProFTPD (proftpd).

Si no aparece el aviso al terminar la instalación, deberían aparecer la primera vez que se arranquen los servicios.

Estos permisos son importantes aceptarlos porque serán los que permitirán acceder a los temas y plugins del repositorio de WordPress para poder instalarlos en nuestra página web.

Si no aparecen estas ventanas para dar los permisos necesarios, en el siguiente punto os explico cómo hacerlo de forma manual.

Conexiones de red entrantes

Cuando arranquemos o lancemos el programa para empezar a utilizarlo se abrirá la ventana de configuración de opciones de XAMPP y una ventana del navegador con la página inicial de nuestro ya instalado servidor local.

XAMPP se ejecutará solo la primera vez que lo instalemos, pero luego tendremos que crear un acceso directo en el escritorio o arrancarlo desde "Aplicaciones/XAMPP/manager-osx.app".

Página principal del servidor local y ventana de opciones de XAMPP en MacOS
Página principal del servidor local y ventana de opciones de XAMPP

Dar permisos para aceptar las conexiones de red entrantes en Mac

Una de las razones por las que puede que no se inicien los servicios o no funcionen correctamente es no haber aceptado los permisos de red entrantes. Si durante la instalación no los aceptamos o no salió la opción, tendremos que activarlos de forma manual.

En el escritorio de nuestro ordenador accedemos a la manzana y a la pestaña de "Ajustes del sistema".

Buscamos la opción "Firewall" dentro de las pestaña de "Red" y picamos en el botón "Opciones".

Opciones de Red en MacOS

Ahora picamos en el símbolo "+" y añadimos los servicios que necesitan la conexión para que funcione XAMPP en un ordenador Mac. Para encontrarlos tenéis que seguir las siguientes rutas:

  • httpd: Se encuentra en "Aplicaiones/XAMPP/xamppfiles/bin/httpd"
  • mysqld: Puedes localizarlo en "Aplicaiones/XAMPP/xamppfiles/sbin/mysqld"
  • proftpd: Está en "Aplicaiones/XAMPP/xamppfiles/sbin/proftpd"
Permitir conexiones entrantes en Mac desde Firewall
Permitir conexiones entrantes

Arrancar los servicios de Apache, Base de datos MySQL y ProFTPD

Aunque puede parecer que ya hemos terminado de instalar XAMPP en nuestro ordenador Mac, puede que tengamos algún problema con los puertos si utilizamos algún software o programa que también use los mismos puertos que necesita XAMPP para funcionar.

Son casos puntuales, pero tú puedes ser uno de ellos si, por ejemplo, utilizas Skype o una máquina virtual instalada en tu ordenador.

Antes de cambiar nada intentamos arrancar los servicios de XAMPP, en la pestaña "Manage Servers" picamos en "Start All" y si todo se pone verde no necesitaremos hacer nada más, solo tendremos que empezar a trabajar en el nuevo proyecto que tengamos en mente.

Servicios de XAMPP iniciados correctamente
Servicios de XAMPP iniciados correctamente

Cambiar los puertos de Apache y MySQL en caso de coincidir con otros programas

Si alguno de los servicios no consigue arrancar por culpa de los puertos mal configurados, debemos cambiarlos y poner unos puertos que no estén usados por el sistema operativo ni por otro programa.

Como ejemplo cambiaremos el puerto de Apache, pero de igual modo se cambiaría el de la base de datos MySQL. Marcamos el servicio y picamos en el botón de la derecha "Configure". Se abrirá un ventana con el número de puerto que se utiliza por defecto (80) y que cambiaremos por otro diferente, por ejemplo, con el 8888, 8080, 8081... un puerto que podamos recordar fácilmente.

Para acceder en el navegador al servidor local escribiremos "localhost" si el puerto es el que está configurado por defecto. Si lo hemos tenido que cambiar accederemos escribiendo "localhost: + nº de puerto elegido", por ejemplo, "localhost:8080".

Cambiar el puerto de Apache en XAMPP para Mac
Cambiar puerto de Apache

Si el servicio que no arranca es el de la base de datos, podemos cambiar el número de puerto por defecto (3306), por otro diferente como el 33060, 33066, 33061...

Cambiar el puerto de MySQL en XAMPP para Mac
Cambiar puerto de MySQL de la base de datos

Instalando WordPress en un servidor local con XAMPP en Mac

WordPress necesita un lugar donde almacenar los archivos y una base de datos que gestiona el contenido. Para que funcione correctamente tenemos que crear primero la base de datos y después conectarla con los archivos. Gracias al auto instalador de WordPress este proceso es muy sencillo.

Crear una base de datos en XAMPP

Para acceder al gestor de las bases de datos picamos en el botón "Go to Application" para acceder a la página principal de nuestro servidor local. También podemos hacerlo escribiendo directamente en el ordenador "localhost" (+ el puerto si lo hemos cambiado)

Ir a la página principal del servidor local

En el menú superior picamos en la pestaña "phpMyAdmin" para acceder a la aplicación encargada de las bases de datos de nuestro servidor local con XAMPP en Mac.

Abrir phpMyAdmin para instalar XAMPP en ordenador Mac
Acceder a phpMyAdmin

Una vez dentro, seleccionamos la pestaña "Bases de datos" y en el apartado de "Crear base de datos" rellenamos la casilla con el nombre que queramos asignar a la base de datos para nuestro primer proyecto, yo elegiré por ejemplo "proyectouno", todo seguido y sin espacios.

La codificación debe ser utf8 (estándar unicode), podemos dejar la que está seleccionada por defecto "utf8mb4_general_ci" o elegir "utf8_general_ci".

Picamos en "Crear" y se añadirá al listado de Bases de datos que tenemos en la columna de la izquierda. Esta base de datos estará vacía a la hora de crearla, pero se rellenará con las tablas necesarias automáticamente cuando empecemos la instalación de WordPress.

Crear una nueva base de datos en phpMyAdmin de XAMPP
Crear una nueva base de datos en phpMyAdmin de XAMPP

Una vez creada la base de datos podemos cerrar phpMyAdmin recordando el nombre que hemos elegido.

Colocar los archivos de WordPress en la carpeta "htdocs" del servidor local XAMPP

Ahora es el momento de realizar algunos cambios en el sistema para evitar problemas de permisos con los archivos y carpetas y organizar un poco las cosas para no confundirnos o borrar algo que no deseamos.

Modificar los permisos de lectura y escritura de "htdocs" en XAMPP

Para evitar problemas de acceso en esta carpeta "htdocs", vamos a modificar los permisos y conceder acceso total de lectura y escritura.

Seleccionamos la carpeta "htdocs" en la ruta "Aplicaciones/XAMPP/xamppfiles" y presionamos "cmdo.+i" para acceder a la información. También podemos picar con el botón derecho del ratón y seleccionar "Obtener información" o desde el menú superior buscar "Archivo > Obtener información". Todos los caminos llevan a Roma.

Abrimos el candado de la esquina inferior derecha y cambiamos los permisos de todos los usuarios que aparezcan en el listado para que puedan leer y escribir.

Antes de cerrar la ventana, picamos en el círculo con tres puntitos y aplicamos los cambios a todos los ítems que contenga la carpeta.

Modificar permisos de "htdocs"

Organizar el contenido de la carpeta raíz "htdocs"

Es fácil eliminar algún archivo o contenido de esta carpeta una vez que empezamos a tener cierto volumen de proyectos acumulados. Para evitar perder la página principal de XAMPP, desde donde accedemos a la gestión de las bases de datos a través de phpMyAdmin, creamos una carpeta llamada "xampp" y colocamos todos los archivos dentro.

Organizar carpeta "htdocs" en XAMPP
Organizar carpeta "htdocs"

Luego accedemos a la carpeta y editamos "index.php" y "applications.html" para cambiar la ruta de acceso a la página principal de XAMPP para que se abra sin problemas. Donde ponga "/dasboard/" lo reemplazamos por "/xampp/dasboard/".

Modificar url de la página principal de XAMPP
Modificar url de la página principal de XAMPP

Preparar los archivos de WordPress en XAMPP

Es el momento de recuperar el archivo que descargamos con la instalación de WordPress. Primero lo movemos o copiamos dentro de "htdocs", lo descomprimimos y renombramos la carpeta descomprimida con el nombre de nuestro proyecto.

La ruta original de la carpeta principal es "Aplicaciones/XAMPP/xamppfiles/htdocs". También podemos crear un acceso directo en el escritorio si queremos tener esta carpeta más a mano.

Colocar los archivos de WordPress en la carpeta raíz  "htdocs" del servidor local en XAMPP
Colocar los archivos de WordPress en la carpeta raíz "htdocs" del servidor local

Iniciar la instalación de WordPress

Abrimos la página principal de XAMPP en el navegador como ya hemos aprendido en los apartados anteriores, escribiendo "localhost" o desde el botón "Go to Application" de la ventana de XAMPP.

En la barra de navegación escribimos detrás de "localhost" el nombre de la carpeta de nuestro proyecto. En mi caso sería "localhost/minuevoproyecto". Y damos al Enter para iniciar los pasos de creación de nuestra primera página web con WordPress en XAMPP.

Inicio del auto instalador de WordPress en localhost con XAMPP en Mac
Inicio de la instalación de WordPress en XAMPP

Iniciados los pasos de la instalación de WordPress solo tenemos que seguir las indicaciones, en la primera pantalla solo hay que picar en "¡Vamos a ello!".

En la siguiente pantalla configuramos la conexión con la base de datos que hemos creado en uno de los pasos anteriores, y rellenamos los campos de la siguiente manera:

  • Nombre de la base de datos: La que escogiste en el momento de crearla (en mi caso "proyectouno").
  • Nombre de usuario: XAMPP establece por defecto el usuario "root".
  • Contraseña: No se requiere.
  • Servidor de la base de datos: Es el mismo que el servidor de archivos, "localhost".
  • Prefijo de tabla: Por defecto viene "wp_", pero recomiendo cambiarlo o modificarlo para mayor seguridad.
Información de conexión con la base de datos
Información de conexión con la base de datos

Rellenamos todos los campos y picamos en "Enviar". Si todo fue bien aparecerá un aviso dándonos la enhorabuena.

Confirmación de conexión con la base de datos de WordPress en XAMPP
Confirmación de conexión con la base de datos

Lo siguiente a configurar son los datos de WordPress y el acceso a la administración de la web. Son unos datos iniciales que luego podremos modificar en cualquier momento desde la misma web si lo consideramos necesario.

  • Título del sitio: El título de la página web
  • Nombre de usuario: Tu nombre como usuario del sitio
  • Contraseña: Para acceder a la administración
  • Tu correo electrónico: para recibir alertas de WordPress (los envíos de correo en XAMPP hay que configurarlos aparte)
  • Visibilidad en los motores de búsqueda: Da igual marcarla que no marcarla ya que trabajamos offline y los buscadores no tienen acceso.
Datos para configurar página web en WordPress en localhost con XAMPP
Información inicial para WordPress

Terminamos con una página final que nos indica que ya está instalado WordPress, pero para que podemos empezar a configurar y personalizar el sitio necesitamos configurar la conexión FTP del servidor local.

Pagina final de la instalación de WordPress en XAMPP
Pagina final de la instalación de WordPress en XAMPP

Solución al problema de acceso FTP de WordPress para instalar Temas y Plugins en XAMPP

Aunque XAMPP ya funciona y podemos ver nuestra nueva página web creada con WordPress, cuando intentamos cargar una imagen, actualizar, instalar un nuevo tema o un plugin, nos piden una conexión FTP (Protocolo de Transferencia de Ficheros - File Transfer Protocol) para poder instalar los nuevos archivos.

Es absurdo que trabajando offline tengamos este tipo de prevención con los archivos, así que vamos a saltarnos este protocolo para que podamos trabajar sin preocupaciones.

En la carpeta del proyecto localizamos el archivo "wp-config.php" y lo abrimos para editarlo. Al final del todo añadimos la siguiente línea y lo guardamos:

Asegúrate de escribir todo bien, con los espacios y las comillas correspondientes para que el código no entre en conflicto. Revísalo dos o tres veces antes de guardar.

Configurar el envío de emails en macOS con XAMPP

He probado de todo, buscado mil y una forma de hacer funcionar los correos electrónicos al instalar XAMPP en ordenadores Mac, pero las recomendaciones de instalar cosas a través del "Terminal" del sistema siempre han acabado fallando o dejado de funcionar por culpa de las actualizaciones del sistema.

La solución más sencilla y práctica es conectar con un servicio de mails como "Brevo", que dispone de una opción gratuita de registro, para activar los emails y poder realizar pruebas de envíos de formularios, o recibir avisos del sistema de administración de WordPress.

En la administración de WordPress accedemos a "Añadir nuevo plugin" y buscamos el correspondiente a Brevo. Cuando lo localicemos lo instalamos y activamos.

Instalación del plugin "Brevo" en WordPress al instalar xampp con mac
Instalación del plugin "Brevo"

En la nueva pestaña del menú de la izquierda del plugin accedemos a la configuración desde el apartado "Home". Desde ahí seguiremos todo el proceso para crear una cuenta en Brevo.

Una vez creada la cuenta, volvemos a las opciones del plugin y picamos en el segundo punto "Get your API key from your account". De esta forma generamos una clave única que conecta nuestro sitio con los servicios de Brevo. La pegamos en la casilla y aceptamos.

Pasos para configurar una cuenta en Brevo y vincularla con WordPress
Pasos para configurar una cuenta en Brevo y vincularla con WordPress

Si todo ha ido bien, veremos nuestros datos y una ventana nueva con un apartado llamado "Transactional emails", que activaremos marcando la opción "Yes".

Tendremos dos únicas casillas a configurar, la primera es donde elegimos el correo que utilizaremos como remitente en los emails. En la plataforma de Brevo se pueden configurar varios remitentes, pero si es la primera vez que te registras solo tendrás uno.

En la segunda casilla puedes colocar cualquier dirección de correo para realizar una prueba de envío y comprobar que todo funciona.

Configurar la cuenta de Brevo junto con la instalación de XAMPP en Mac para usarla como remitente de los emails en WordPress
Configurar la cuenta de Brevo para usarla como remitente de los emails en WordPress

Con esta última configuración estamos preparados para poder sacar el máximo partido a la instalación de XAMPP en Mac. Espero que te haya sido de ayuda y si tienes alguna duda déjamela en los comentarios.

En Windows no existen tantos problemas a la hora de instalar XAMPP, ya que no requiere de tantos permisos de archivos o carpetas como exige Mac.

Una vez que tengas tu web lista en el servidor local, te toca subirla a un servidor online. Mira aquí cómo se hace.

VISITA MI CANAL DE YOUTUBE

Juan

Juan

Juan Martín es el autor del blog Ingresos Vía Web, una persona como tú que intenta ganarse la vida en internet. Trabajo en mi blog para convertir mi sueño de generar autoempleo en realidad y poder ayudar a quien quiera, a conseguir su sueño a través de mis contenidos. Si te parece interesante apúntate a mi newsletter.

0 comentarios

Enviar un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.

Al dejar un comentario se solicitan datos como tu email y nombre que se almacenan en una cookie para que no tengas que volver a completarlos en próximas visitas. Para enviar un comentario debes aceptar nuestra política de privacidad. Responsable de los datos: Juan Martín Pascual. | Finalidad: Controlar spam, gestión y moderación de comentarios. | Legitimación: Tu consentimiento expreso. |Comunicación de los datos: No se comunicarán a terceros salvo por obligación legal. | Destinatario: Base de datos alojada en SiteGround Spain S.L. dentro de la UE. Ver política de privacidad de Siteground. | Derechos: Acceso, rectificación, supresión, limitación, portabilidad y olvido de sus datos.

Mi canal de Youtube

Categorías

Recomendado para Afiliados de Amazon

AAWP Amazon Affiliate for WordPress
Azon Press

Esta web funciona gracias a:

Anuncio - WordPress Gestionado de SiteGround - Potente pero simple de usar. Haz clic para aprender más. Descuento directo DIVI -  10 por ciento