Quantcast
Channel: blog – arturogarcia
Viewing all articles
Browse latest Browse all 31

Cómo instalar un certificado SSL en WordPress.Vídeo tutorial

$
0
0

¿Sabes que si vendes productos o infoproductos en tu web necesitas un certificado SSL? También sería recomendable que tuvieras instalado el certificado en tu WordPress para garantizar la seguridad de tus datos y los de tus colaboradores, aunque no vendas nada en tu sitio.

En principio puede parecer algo engorroso y complicado, pero en este tutorial vas a aprender a instalarlo paso a paso en cualquier hosting que utilice cPanel, como pueden ser Webempresa o Raiola Networks entre otros muchos.

Vamos al lío que tenemos 3000 palabras, 50 capturas de pantalla y dos vídeos por delante 😉

SSL-en-tu-wordpress

POST INVITADO.

Hoy tengo el inmenso placer de contar en mi blog con Josu Eizagirre, desarrollador web especializado en WordPress y Genesis Framework. Técnico Superior en Sistemas de Telecomunicaciones e Informática, blogger, padre y comentarista habitual en este blog :)

En esta entrada nos va a hablar en profundidad de los certificados SSL, qué son, dónde y cómo comprar uno y cómo instalarlo en tu WordPress.

El tio se ha currado un MEGA TUTORIAL IMPRESIONANTE con 3000 palabras, ocho millones de captura de pantalla y dos vídeos para que puedas seguirle paso a paso y seas capaz de instalar tú mismo tu certificado.

Que lo disfrutes. Te dejo con él.

Antes de nada quiero decirte que la entra está dividida en dos partes:

  • En la primera te voy a enseñar cómo contratar e instalar el certificado SSL con Webempresa y NameCheap.
  • En la segunda aprenderás a configurar el certificado dentro de WordPress.

Si te apañas mejor con vídeos aquí tienes los dos para que te pongas manos a la obra ya mismo:

Parte 1:

Parte 2:

Si por el contrario eres más de texto y capturas de pantalla sigue leyendo.

Qué es un certificado SSL

El tema de instalar un certificado SSL en tu proyecto ya sea web, blog o tienda Ecommerce está en boca de todos últimamente.

Pero ¿Qué es exactamente este certificado? ¿Lo necesito para mi proyecto?

Básicamente y sin entrar en muchos tecnicismos SSL (“Secure Sockets Layer”) es un protocolo que garantiza la seguridad de los datos que se mandan a través de Internet y aunque originariamente fue creada por Netscape a mediados de 2001, la patente SSL  fue adquirida por IETF (Internet Engineering Task Force) y adoptó el nombre de TLS (Transport Layer Security).

Su funcionamiento es sencillo:

  • Se da la fase de autenticación.
  • Se establece un canal de comunicación seguro (cifrado).

Buff vaya chapada !! :)

¿Cómo sé si lo necesito?

  1. Muy fácil, tienes un blog o web donde solicitas datos personales?
  2. Tienes algún panel de acceso donde metas tus datos como usuario y contraseña?
  3. Tienes un sitio donde vendes productos o infoproductos y les pides a tus clientes que te den su tarjeta y todos sus datos personales?

Está claro que  si usas WordPress tienes que meter tus datos para entrar al panel de administración y si no tienes instalado el certificado tus datos van sin cifrar.  :)

Si la respuesta es un “sí” en las opciones 1 y 2  yo te recomiendo que instales un certificado, ojo solo te lo recomiendo.

Si tu caso es el 3… ¡¡te obligo a que te lo instales!! no, es broma, pero en serio, los datos de tus clientes son muy importantes y por mucho que el pago final se haga en una pasarela externa es un error creer que están 100% seguros. Instálate el certificado, no te arrepentirás compañer@.

¿Cómo se instala?

Antes de entrar a saco con todo lo que necesitamos para instalarlo y posteriormente configurarlo os voy a dar unos consejos que van muy unidos a este artículo:

  • Evita todo lo posible el conectarte a wifis públicos y si es algo muy importante y lo has tenido que hacer intenta no entrar en sitios donde no tengan el certificado instalado y tengas que introducir tus datos personales (usuario, contraseña).
  • Los atacantes entre otras técnicas utilizan algo llamado ingeniería social, te sonará lo que les pasó a las famosas con sus “iPhones”… el engaño consistía en mandar un correo falso en el cual se pedía que introdujeran sus credenciales, con eso daban acceso a toda su vida, fotos, vídeos… (sentido común por favor!!).
  • Desconectar el WPS (wifi-protected setup) de vuestro router. Sí,  esa cosa maravillosa que te permite conectar todos tus dispositivos con solo un pin (hace mucho que existe un ataque llamado Reaver) que lo que hace básicamente es probar todos los pins posibles uno por uno y consigue llevar a cabo el hackeo de tu conexión wifi. Desactívalo y si no sabes cómo hacerlo llama a tu operadora y que un agente te ayude.

¿Y por qué me dices esto?

Porque aunque tengas configurada una pedazo contraseña en tu wifi de ocho caracteres, símbolos, mayúsculas, etc… si tienes activado el wps igualmente te pueden robar tu conexión y si te lo roban también te pueden interceptar tus datos, avisado estás!!

Hace poco mi novia me enseñaba un whatsapp que le habían pasado, ¿te suena?

ikea

Sí, en esa trampa cayó muchísima gente, era un “fake” (mensaje falso) para recoger tus datos personales.

Ante ese tipo de ataques no hay certificado que valga, lo que necesitamos es una profunda educación de nuestra sociedad de cara a Internet y las nuevas tecnologías. :)

infografia

¿Empezamos? Cómo instalar un certificado SSL paso a paso

Bien lo primero de todo necesitamos contratar un certificado y para ello yo utilizo NameCheap.

Si no los conoces y quieres saber si son de fiar o no, te puedo decir que es una empresa muy conocida a la hora de registrar dominios pero ofrecen más servicios, tales como de hosting y el que nos interesa a nosotros es el tema de los certificados.

Si quieres saber más sobre ellos aquí tienes un estupendo tutorial creado por Franck Scipion donde explica como contratar un dominio con ellos.

En mi caso el hosting + los dominios los tengo contratados a través de Webempresa y solo utilizo NameCheap para propocionarme el certificado. Vamos a ir a su página y clickamos en el menú donde pone Security-SSL Certificates:

ssl certificates

En esta nueva página que se nos abre, bajamos un poco y vemos estas tres opciones:

ssl namecheap

Opción 1:

Estos certificados te ofrecen cifrado básico, necesitan de una sencilla comprobación para verificar la propiedad del dominio.
Los precios van desde los 8,12 eu  hasta 134,32 eu/año.

Opción 2:

Incluyen autenticación de la empresa u organización detrás del dominio y cifrado más robusto.

Precios desde 35,19 eu hasta 609,78 eu/año.

Opción 3:

Este tipo de SSL proporciona el más alto grado de confianza y  seguridad para tu proyecto.
Precios desde 130,82 eu hasta 867,81/año.

Mi opinión personal:

Si tienes un blog, web en las que no haces cobros con tarjeta con las opciones más baratas te sobra.

Es el caso de mi blog  ahora mismo no vendo productos ni infoproductos entonces con cualquiera de estas opciones del plan básico que os incluyo a continuación me vale, porque con ese certificado consigo que todos los datos viajen lo suficientemente cifrados.

ssl barato ssl economico

Otro caso distinto es, si tienes creada una tienda Ecommerce (incluyo venta de infoproductos)  en ese caso te recomiendo mínimo el 2 plan y a partir de este certificado te vale:

ssl tiendas

Ok, después de esta breve aclaración yo voy a escoger este certificado para explicaros todo el proceso:

certificado de ejemplo

Clickamos en “Add to Cart” y confirmamos la compra de esta forma:

añadir al carro

El siguiente paso es crear nuestra cuenta:

crear cuenta

En la siguiente pantalla rellenamos algunas datos más:

mas datos

mas datos 2

Nos dirigimos a la derecha  y click en “Continue“:

carrito

A continuación efectuamos el pago de nuestro flamante certificado ssl:

elegir forma de pago

Introducimos nuestro datos de paypal y ya lo tenemos:

pagar con paypal

Perfecto, ya he pagado el certificado y he creado una cuenta en NameCheap ¿y ahora qué?

Muy fácil, ahora nos dirigimos a nuestra cuenta de NameCheap y entramos al panel de administración de esta forma: Menu=>Account=>Dashboard

menu account dashboard

 

Una vez dentro escogemos la opción “Product List” y damos click en “Activate” :

product list

Ahora podemos observar  que nos pide una cosa muy rara llamada CSR… ¿y qué leches es esto?

Un CSR (Certificate Signing Request) es un bloque de texto cifrado que contiene información que será incluida en el certificado SSL, por ejemplo tu nombre o el de tu empresa, la dirección, el país de residencia o el “common name” (dominio para el que es generado el SSL), además también llevará una clave pública que será incluida en tu certificado.

Qué marrón ¿Cómo consigo yo ahora ese dichoso CSR?

Es muy fácil, a través de tu hosting donde tienes alojado tu proyecto, en mi caso tengo que ir al Cpanel de WebEmpresa.

No te apures!! Lo más normal es que tu tengas un cpanel como el mio, aunque tengas contratado otro hosting entonces estos pasos te van a servir de igual forma :)

Vamos a nuestro querido Cpanel:

cpanel

Y una vez dentro seguimos estos pasos:

3 pasos 1

3 pasos 2

3 pasos 3

Después de  ingresar al cPanel vamos a buscar   Seguridad-SSL/TLS Administrador :

cpanel 1

Entramos dentro y vemos esto:

cpanel 2

Clickamos en esa opción “Solicitudes de firma de certificado” (CRS) y rellenamos de esta forma:

cpanel 3

cpanel 4 cpanel 5 cpanel 6

Y vemos que hemos generado nuestro código:

cpanel 7

Ahora copiamos todo eso empezando desde —–BEGIN CERTIFICATE REQUEST—– hasta —–END CERTIFICATE REQUEST—– incluyendo esos dos textos. :)

¿Y dónde lo pegamos?

Vaya, que mala memoria tenemos!!!  :)

Te acuerdas que en el panel de NameCheap nos pedían ese famoso CRS?

pues es ahí donde lo pegaremos y rellenamos las demás opciones de esta forma:

crs 1 crs 2 crs 3

Llegados a este punto tenemos tres opciones para verificar nuestro certificado:

Email: Este es a mi parecer el método más sencillo y el que uso yo.

Http-based: Te toca descargarte un archivo y subirlo a tu hosting.

Dns-based: Tendrás que crear un registro CNAME a través del cPanel o proveedor de DNS.

El método que os voy a enseñar es el primero al ser el más facil, “Email” y nos da estas posibilidades según el nombre de tu dominio, admin@tudominio.com, admin@www.tudominio.com.

Ahora nos toca  crear un correo de ese estilo con nuestro dominio incluido y eso donde lo creamos?

Muy sencillo en tu cPanel, Correo=>Cuentas de correo electrónico:

cpanel correo cpanel correo 2

Una vez creada la cuenta de correo, escogemos la nuestra de la lista y en la siguiente pantalla rellenamos estos datos:

cpanel correo 3cpanel correo 4cpanel correo 5

cpanel correo 6
En este punto nos han enviado un email al correo indicado y tenemos que verificarlo:

email confirmacion

email confirmacion 2

Y una vez verificado vemos esto:

email confirmacion 3

Ahora si vamos al panel de NameCheap observamos esto:

ssl verificado

Enhorabuena!! hemos activado el certificado!!!… Pero nos falta un paso más… noooooooooooooooo!!!

Tranquilo es sencillo, nos quedamos en la misma página que estábamos antes, donde veíamos activado el certificado y nos dirigimos a donde pone “MANAGE“:

manage

Y en la siguiente pantalla hacemos click en SEE DETAILS- DownloadCertificate:

manage 2

Al descomprimir tuarchivo.zip vemos que dentro hay tres archivos, el que necesitamos es:

www_tudominio_com.crt

Ahora nos volvemos otra vez al cPanel de Webempresa o en tu caso el de tu hosting, SEGURIDAD-SSL/Administrador:

administrador ssl

Cargamos el archivo.crt que nos hemos descargado antes:

elegir certificado

Y ahora nos dirigimos a la última opción:

ultima opcion

Escogemos nuestro dominio en el menu desplegable y hacemos click en Autorrellenar:

autorellenar

Ahora nos vamos abajo del todo y hacemos click en “instalar certificado”:

instalar certificado

Lo hemos conseguido, tengo un maravilloso candado en mi WordPress!!

me has timado

Pero ¿Qué pasa aquí? si yo no veo ningún candado, ¡¡¡qué me cuentas!!!

No te asustes :)

Nos falta hacer algunos cambios en nuestro WordPress para cambiar los url http a https y de esa forma nos saldrá un maravilloso candado arriba, prometido.

Segunda parte: Ajustes necesarios dentro de tu WordPress

¿Cómo puedo hacer esos cambios en mi WordPress?

Hay tres maneras de hacerlo pero os aconsejo llevarlo a cabo con la primera opción por ser la más sencilla.

  1. Cambiar la dirección http a https desde las opciones generales de WordPress. La más fácil.
  2. Modificando el archivo wp-config.php de tu instalación añadiendo unas nuevas lineas.
  3. Realizar una redirección de http:// a https:// forzando todas las páginas de tu dominio a cargar usando dicho protocolo seguro desde .htaccess añadiendo un código.

El método que yo os voy a enseñar es el primero. Vamos a Ajustes-Generales y donde antes teníamos http ahora ponemos https así de sencillo:

ajustes generales

Y hacemos click en Guardar los cambios.

WARNING!!!!!!!!!!!!!!!!!!!!!!!!!! ME SALE ESTO!!!

conexion no privada

Nos sale ese aviso porque hemos puesto “https” en nuestro dominio y, aunque las urls principales las tenemos cambiadas, ahora toca cambiar el resto. Pero no te aconsejo que hagas ese proceso a mano porque seguramente tendrás muchas urls. :)

Lo vamos a solucionar de una forma muy sencilla, para ellos nos vamos a descargar este plugin:

plugin

Una vez instalado nos dirigimos a Herramientas-Better Search Replace:

herramientas

herramientas 2

  1. Buscar: Ponemos como teníamos antes nuestras url=> http://tudominio.com
  2. Sustituir con: Cambiamos con la “ese” al final => https://tudominio.com
  3. Seleccionar tablas: Seleccionamos todas.
  4. Quieres ejecutar en seco: Es un modo como de prueba, tiene que estar desactivada.
  5. Para acabar hacemos click en Run Search/Replace.

Y ahora si lo hemos hecho bien, arriba nos sale esto:

resultado

Hacemos click y vemos los cambios efectuados:

cambios

Y con esto y un bizcocho tenemos nuestro proyecto cifrado con un bonito candado:

candado

Posibles problemas que te pueden surgir

Para acabar este artículo os voy a incluir un último apartado donde voy a exponer los problemas que te podrán surgir al instalar el certificado y sus posibles soluciones:

No he podido efectuar el pago del certificado

  1. Hay algún problema con tu tarjeta, lo ha rechazado el banco por algún motivo o no has introducido bien los datos.
  2. No me deja pagarlo via paypal tampoco, estamos en las mismas, tienes que tener sí o sí una tarjeta vinculada a tu cuenta de Paypalverifica todos los datos.

He creado la cuenta y he comprado el certificado en NameCheap, el pago ha sido realizado correctamente y no me mandan el código de activación al correo admin@midominio.com

  1. ¿Has creado correctamente ese correo en Cpanel? ¿Has puesto en Namecheap que manden a ese correo? si la respuesta es , vuelve al panel de NameCheap y pide que te lo reenvíen otra vez.
  2. Si todavía no llega lo más seguro que esté en Correo no deseado o spam, verifícalo.

He creado el CRS en el cPanel, lo he copiado y ahora cuando lo pego en el recuadro de NameCheap me dice que no es correcto

  1. ¿Estás seguro que lo has copiado como te he dicho yo? incluyendo  desde —–BEGIN CERTIFICATE REQUEST—– hasta —–END CERTIFICATE REQUEST—– ¿Incluyendo esos dos textos? cuando te he dicho copiar entero es entero!! :)
  2. ¿Estás seguro que has copiado la parte que te he dicho yo y no el key de más abajo? Vuelve a revisar mi captura para estar segur@.

He descargado e intentado cargar el certificado CRT en cPanel pero no me reconoce como válido

  1. ¿Estás seguro que has cargado el archivo con la extensión .CRT? Dentro hay tres archivos.
  2. ¿Le has dado a cargar una vez subido el archivo?

He cambiado las url en Ajustes-Generales para cambiar de http https y ahora ¡¡¡no puedo entrar al panel de administración!!!

  1. Estás seguro que has hecho el último paso para instalar el certificado desde cPanel? Vuelve a hacerlo y dale a instalar.
  2. Si no le das a instalar los cambios no se efectuan y no podrás entrar a tudominio.com/wp-admin hasta que lo hagas.

He hecho todo como tú me dices desde el principio hasta el final y no me sale el candado. Bueno, miento, en algunas páginas me sale el candado y en otras no

  1. Este problema puede ser habitual porque todavía quedan sitios enlazados en los posts que no tienen https, sino el antiguo http y al detectarlo no sale el candado.
  2. Revisa todos los posts y fíjate en cuáles sí sale el candado arriba y en cuáles no, te toca hacer unos pequeños cambios hasta que te salga el candado.
  3. A veces pueden dar problemas las imágenes de afiliación estilo .gif y imágenes destacados, te toca hacer pruebas.

Cómo encontrar las urls que impiden que se muestre el candado

Para acabar te enseño una utilidad que te va a dar muchas alegrías a la hora de hacer la búsqueda de los url http que se te están resistiendo y no te están dejando ver el candado.

Abrimos el navegador firefox y vamos a ir a nuestro blog:

encontrar url

Vamos con el cursor a cualquier sitio de nuestro Blog que no sea clickable y en esa zona pulsamos botón derecho del ratón y escogemos la opción “inspeccionar elemento” y en la ventana que se abre escogemos “Red” y luego damos click en “Recargue”:

recargue

También hacemos lo mismo si le damos a f5 en el teclado, refrescamos el navegador.

candados

Y revisa uno por uno que todo lo que se ha cargado tiene un candado al principio. Si no tiene candado algo está fallando, vamos, que hay algún url todavía que no está con https.

Es una herramienta fantástica y gratuita, utilízala!! :)

Vamos acabando

Y nada más, espero que le saquéis provecho a este post y darle las gracias a Arturo por dejarme entrar en su casa.

Nos vemos en los comentarios.

IMPORTANTE: se me olvidaba decirte que una vez que lucimos un pedazo de candado en nuestro sitio, a ojos de Google tenemos otro dominio diferente.

Vaya ¡¡qué me cuentas!!

Pues nada, nos toca ir a Google Search Console (sí, a Google le gusta cambiar lo nombres) y decirle que nuestro dominio https://tudominio.com ha sido creado.

Si no sabéis cómo hacerlo os dejo este fabuloso tutorial.

:)

La entrada Cómo instalar un certificado SSL en WordPress.Vídeo tutorial aparece primero en Arturo Garcia.


Viewing all articles
Browse latest Browse all 31