[Solución] ver wordpress en red local

La situación es la siguiente, tenemos un servidor local en nuestra PC y queremos que los demás que estén conectados a nuestra red puedan ver las páginas o blogs que hayamos creado (para saber como hacer esto, puedes visitar la guía que hice al respecto), si instalamos un blog de WordPress posiblemente suframos de un problema muy común y que pocos se toman las molestias de explicarlo.

Se trata de que al ingresar desde otra PC (conectada a la red local) por medio de la IP, el blog pierde todo estilo (css) y las imágenes, quedando sólo texto desordenado como podemos ver acontinuación:

– – –

Ahora, para que esto no suceda, tenemos que crear en nuestro servidor local, lo que se conoce como Virtual Host, es decir vincular la carpeta de un sitio a un nombre de dominio particular. Del mismo modo se pueden vincular distintas carpetas a distintas direcciones, comúnmente esto se conoce como apuntar dominios.

Para hacerlo, tenemos que buscar en nuestro servidor local el archivo “httpd-vhosts.conf” que se encuentra dentro de las carpetas del apache. En este caso particular, tengo instalado como servidor el XAMPP pero es prácticamente lo mismo en todos los demás.

Lo que hay que tener en cuenta es que algunos servidores traen por defecto desactivada la opción de virtual host y para activarla tenemos que ir a la siguiente ruta:

(donde xampp puede ser cualquier servidor que estés usando).

– – –

Le damos click derecho y “Abrir con”, buscamos nuestro editor de texto favorito (ejemplo: notepad) y podremos ver el contenido del archivo, en el cual buscaremos aproximadamente en la línea 501 lo siguiente:

En este apartado, como vemos en la imagen está activado, algunos servidores lo traen desactivado de la siguiente manera:

lo que tenemos que hacer es eliminar el numeral ‘ # ‘, guardar el archivo y listo, estará activado.

– – –

Una vez activado el Virtual Host, tenemos que acceder a la siguiente ruta donde estará el archivo en cuestión:

– – –

Nuevamente editamos con un editor de texto el archivo “httpd-vhost.conf” y nos enfocaremos en lo siguiente (línea 36 aproximadamente):

Aquí lo que tenemos que hacer es copiar esas últimas líneas y pegarlas más abajo para poder editarlas sin problemas.
Recuerden que hay que borrar los numerales para activar la opción:

(Personalmente prefiero sacar “ErrorLog” y “CustomLog”)

Paso a explicar para que sirve cada cosa:

• VirtualHost *:80 => Nos indica el puerto, por defecto es 80
• ServerAdmin => Un correo de contacto con el administrador en caso de error.
• DocumentRoot => Directorio donde se encuentra la página a vincular.
• ServerName => Aquí el nombre de dominio o DNS que registremos.

– – –

De momento dejaremos en suspenso esta parte y continuamos con otra para poder retomarla.

– – –

Lo que haremos ahora es crear una DNS o dominio para el blog (el cual usarán los usuarios de nuestra red para ingresar).
Existen muchas opciones pero vamos a trabajar con la más popular que es No IP, el cual nos permite registrar de manera gratuita hasta 5 dns para vincular.

[success]

Les dejo el enlace:
http://www.noip.com/

[/success]

Deberán registrarse y posteriormente crear su dns, para registrarse deben seguir estos pasos:

Buscan el botón verde “Sign Up” y le dan click:

(enlace): https://www.noip.com/sign-up

– – –

Veremos la sección de registro:

• Username: sería el nombre de usuario.
• Email: nuestro correo electrónico.
• Password: ponemos una contraseña.
• Confirm Password: repetimos la contraseña.

Tenemos que tildar la opción de “Create my hostname later” para registrar la dns luego.

Finalmente le damos al botón de abajo “Free Sign Up” para registro gratuito, sino al otro botón si quieres comprar.

– – –

Volvemos a la página principal de No IP y le damos click al botón “Sign In” para iniciar sesión:

Basta con ingresar el usuario y la contraseña que usamos para registrarnos.

– – –

Una vez dentro de lo que sería nuestro Panel de Control, buscamos el botón o enlace “Add a Host”:

Le damos click y pasamos al siguiente paso.

– – –

Nos concentraremos en esta sección:

• Hostname => ponemos el nombre de dominio o DNS por donde ingresarán nuestros usuarios, en la casilla de al lado (ddns.net) seleccionamos de la lista la extensión que más nos guste.
• Host Type => dejamos la primera opción por defecto.
• IP Address => tenemos que colocar nuestra IP del IPv4.

La IP del IPv4 la podemos encontrar en CMD de windows (pulsamos la tecla Windows más la R y escribimos CMD para que se ejecute la consola, una vez dentro de la consola escribimos el comando “ipconfig“:

– – –

Aquí copiamos el número que nos brinda la dirección IPv4 (por lo general suele ser 10.0.0.3 donde el 3 varía o en su defecto puede llegar a ser 192.168.1.1 donde el 1 varía).

A este número que copiamos, lo ingresamos en IP Address de No IP:

A modo de ejemplo quedaría así:

• wordpresslan.sytes.net
• DNS Host (A)
• 10.0.0.3

Guardamos y cerramos.

– – –

Muy bien, ya tenemos la IP “camuflada”, lo que tenemos que hacer ahora es copiar la dirección que acabamos de registrar y pegarla en el Virtual Host:

Como pueden ver, configuré el directorio a un blog de WordPress que registré (el que se ve mal en la red) y debajo puse el sitio que acabo de registrar.

Por otra parte, podrán notar en la imagen que hice otra línea de códigos donde vinculé el directorio raíz a localhost por comodidad propia, no es necesario que lo hagan, pero es una opción.

* Cabe destacar que cada vez que registremos sitios que se verán en la red de esta manera, tenemos que agregarlos a la lista de virtual host.

– – –

Como paso siguiente tenemos que reiniciar nuestro localhost, en el caso de XAMPP es darle a STOP y luego a START para que inicie y listo.

– – –

Lamentablemente el problema continúa después de tanto, para terminar y que todo quede perfecto, tenemos que ir al panel de control de wordpress, accedemos por medio del localhost como siempre. Una vez dentro nos dirigimos a “Ajustes > Generales” y modificamos lo siguiente:

Tenemos que cambiar esas dos URL (en mi caso dicen “http://localhost/wordpress”, pero en el tuyo puede tener otra url), cualquiera fuera el caso, tenemos que poner la url creada en el No IP: wordpresslan.sytes.net (la que yo hice, tu debes poner la que creaste):

– – –

Efectivamente si seguiste todos estos pasos, deberías poder visualizar tu blog en las PCs, tablet, smarthphone conectados a tu red local.

– – –