Warning: Declaration of TCB_Menu_Walker::walk($elements, $max_depth) should be compatible with Walker::walk($elements, $max_depth, ...$args) in /home/wpavanza/public_html/wp-content/plugins/thrive-visual-editor/inc/classes/class-tcb-menu-walker.php on line 0
Configuración de Plugins Archives - WP Avanzado

10 Trucos para Optimizar WordPress y aumentar la Velocidad de tu web

10 Trucos para Optimizar WordPress y aumentar la Velocidad de tu web

Hola a todos y todas.

Mi nombre es Danyel Perales ( de TutorialWP.online ), soy diseñador web especializado en WordPress y he preparado un artículo con los que en mi experiencia, son las 10 mejores acciones de fácil implementación para optimizar y aumentar la velocidad de WordPress.

Eso sí, antes de comenzar, me gustaría agradecer tanto a Jaime como a Jorge la oportunidad de poder publicar mis conocimientos en este magnífico blog al que tanto le debo y que tantas veces me a ayudado.

Ahora sí, no me enrollo más… ¡Vamos a acerlerar esas webs!

Hoy en día, crear un blog o web con WordPress es realmente sencillo y casi cualquiera puede hacerlo.

Contratas un hosting baratillo, descargas cualquier theme, te lías a instalar plugins para añadir cualquier detalle y en tan sólo unas horas, tendrás lista y funcionando tu flamante página web.

El problema viene, cuando pasa el tiempo, y ves que apenas recibes visitas.

Esto puede ser debido a varios problemas, por ejemplo que debas hacer algunas mejoras en SEO o posicionamiento web, pero casi con total seguridad, otra de las cosas que debes mejorar para que tu web despegue, es la velocidad de carga.

Cada vez más, es un factor determinante no sólo en la visibilidad si no también en la usabilidad de tu web así que en este artículo vamos a ver 10 consejos para acelerar WordPress:

01  Elegir un buen alojamiento web

Casi con total seguridad, uno de los factores que más impacto tienen en la velocidad de cualquier página web es el servidor o hosting donde esté alojada.

Es normal que cuando empezamos un proyecto, busquemos el hosting más barato que podamos pagar, pero a la larga, sin duda merece la pena invertir un poco más de dinero en este apartado y contratar un hosting de calidad que te de garantías no sólo en velocidad si no también en seguridad y soporte.

Cada vez más empresas ofrecen paquetes de hosting optimizados para este CMS, los cuales por unos pocos euros/dólares al mes, te dejan el servidor con todo listo para comenzar tu web.

Esto es especialmente útil, sobre todo si no sabes cómo instalar WordPress automáticamente paso a paso con un par de clics, hacer copias de seguridad automáticamente y otras muchas cosas.

Para empezar un proyecto web, sin ponernos demasiado técnicos, deberíamos tener en cuenta dos aspectos importantes:

  • a –  El espacio en el disco que vayamos a necesitar + el ancho de banda de la memoria RAM.
  • b –  Hosting preparado especialmente para WordPress y configurado para ello.

Personalmente, he probado tanto Site Ground como WebEmpresa y ambos son unas fantásticas opciones, prefiriendo el primero en caso de tener que elegir.

Artículo recomendado: Como Hacer una Página Web con WordPress. Guía Definitiva de como conectar tu dominio y hosting de Site Ground.

02  Utilizar un tema ligero para WordPress

Sin lugar a duda, cuando comenzamos a crear una página web o blog, lo que más nos llama la atención y a lo que más tiempo se le dedica es a elegir y modificar la plantilla o theme de WordPress que vamos a utilizar.

El diseño es sin duda algo importante, ya que tiene un impacto fundamental en la experiencia de usuario, pero por desgracia, como norma general, solemos basarnos únicamente en el aspecto visual y en todo caso, que tenga las funcionalidades que buscamos para nuestro proyecto a la hora de elegir la plantilla.

Hay muchísimos temas WordPress gratuitos y muchos de ellos bastante optimizados.

Sin embargo no dejamos de meterles mano para adaptarlos a nuestro gusto usando decenas de plugins, constructores o snippets de código que encontramos por cualquier sitio.

Lo más recomendable es utilizar un theme simple de diseño minimalista, lo que ayudará a que sea nuestro contenido y productos lo que destaque, ayudando además a mejorar la velocidad de nuestra web.

Entre las mejores opciones gratuitas, se encuentran los themes OceanWP y Astra, dos opciones freemium que cuentan con una versión básica gratuita y la posibilidad de ampliar funcionalidades con la versión premium o de pago.

Si quieres algo más avanzado, tienes a tu disposición el framework Genesis, conocido por su minimalismo, o por supuesto, contratar un profesional.

03  Reducir el tamaño de las imágenes

Las imágenes son una parte fundamental para cualquier proyecto web. Ahora mismo es casi imposible visitar un sitio de éxito que no tenga imágenes.

Está claro que añadir imágenes es imprescindible, pero por este motivo, también lo es reducir el tamaño (en pixels) y el peso (en bytes) de las mismas a uno que sea adecuado para el usuario y para no ralentizar nuestro servidor y poder así acelerar WordPress.

Personalmente, prefiero crear las imágenes al tamaño exacto para mis webs y reducir su tamaño con las diferentes herramientas online disponibles, pero si lo prefieres, debes saber que tienes a tu disposición varios plugins para optimizar las imágenes de WordPress listos para descargar en el repositorio oficial.

Por ejemplo, el Plugin EWWW Image Optimizer  es uno de los más utilizados para esta tarea.

04  Eliminar o desactivar Plugins que no usemos

Sobre todo al principio, cuando todavía somos principiantes, nos sentimos fascinados por los plugins y cargamos el sitio con montones de ellos.

Lo ideal, es que cada cierto tiempo, valoremos si realmente todos los plugins son imprescindibles o podemos desinstalar alguno, eliminando esa funcionalidad o sustituirla por otra más optimizada.

Por supuesto, también es importante que desactives todos los plugins que sólo utilizas cada cierto tiempo, como por ejemplo, envío de newsletters, limpieza de base de datos etc.

05  Comprimir los archivos CSS y JS

La compresión de los archivos CSS y JS es de vital importancia, ya que puede mejorar mucho la velocidad de carga del sitio en los navegadores tal y como nos indican la mayoría de herramientas para comprobar la velocidad de WordPress como por ejemplo Google Page Speed Insights.

Lo ideal es reducirlo de forma manual, accediendo al código mediante FTP y subiendo una versión reducida y comprimida de nuestros archivos, no obstante, una vez más, tenemos un plugin disponible para facilitarnos la tarea en caso de no tener el tiempo o los conocimientos técnicos necesarios.

En este caso, me refiero al plugin Autoptimize, capaz de comprimir los archivos CSS, JS y HTML.

06  Utiliza un plugin de caché para acelerar WordPress

Una de las formas más utilizadas para aligerar la carga de nuestra web al servidor, es aprovechar el almacenamiento en caché de nuestro navegador.

Una vez más, tienes varios plugins disponibles, WP Rocket si no te importe gastar algo de dinero, o si prefieres una opción gratuita, te recomiendo WP Super Cache, creado por Automattic (la empresa del creador de WordPress) que ya cuenta con más de 2 millones de instalaciones activas a día de hoy.

07  Habilitar la compresión GZIP

Otra de las maneras que podemos aprovechar para aumentar la velocidad de WordPress, es implementar la compresión GZIP en nuestra web, descomprimiendo así los archivos en el navegador del usuario cada vez que visita nuestra web.

En esta ocasión, mi recomendación es que implementes esta solución directamente con código ya que es algo muy fácil y rápido.

 

Tan sólo tienes que añadir el siguiente código en el archivo .htaccess de tu web:

<IfModule mod_deflate.c>

    <IfModule mod_headers.c>

        Header append Vary User-Agent env=!dont-vary

    </IfModule>

    AddOutputFilterByType DEFLATE text/css

    AddOutputFilterByType DEFLATE text/x-component

    AddOutputFilterByType DEFLATE application/x-javascript

    AddOutputFilterByType DEFLATE application/javascript

    AddOutputFilterByType DEFLATE text/javascript

    AddOutputFilterByType DEFLATE text/x-js

    AddOutputFilterByType DEFLATE text/html

    AddOutputFilterByType DEFLATE text/richtext

    AddOutputFilterByType DEFLATE image/svg+xml

    AddOutputFilterByType DEFLATE text/plain

    AddOutputFilterByType DEFLATE text/xsd

    AddOutputFilterByType DEFLATE text/xsl

    AddOutputFilterByType DEFLATE text/xml

    AddOutputFilterByType DEFLATE image/bmp

    AddOutputFilterByType DEFLATE application/java

    AddOutputFilterByType DEFLATE application/msword

    AddOutputFilterByType DEFLATE application/vnd.ms-fontobject

    AddOutputFilterByType DEFLATE application/x-msdownload

    AddOutputFilterByType DEFLATE image/x-icon

    AddOutputFilterByType DEFLATE application/json

    AddOutputFilterByType DEFLATE application/vnd.ms-access

    AddOutputFilterByType DEFLATE application/vnd.ms-project

    AddOutputFilterByType DEFLATE application/x-font-otf

    AddOutputFilterByType DEFLATE application/vnd.ms-opentype

    AddOutputFilterByType DEFLATE application/vnd.oasis.opendocument.database

    AddOutputFilterByType DEFLATE application/vnd.oasis.opendocument.chart

    AddOutputFilterByType DEFLATE application/vnd.oasis.opendocument.formula

    AddOutputFilterByType DEFLATE application/vnd.oasis.opendocument.graphics

    AddOutputFilterByType DEFLATE application/vnd.oasis.opendocument.presentation

    AddOutputFilterByType DEFLATE application/vnd.oasis.opendocument.spreadsheet

    AddOutputFilterByType DEFLATE application/vnd.oasis.opendocument.text

    AddOutputFilterByType DEFLATE audio/ogg

    AddOutputFilterByType DEFLATE application/pdf

    AddOutputFilterByType DEFLATE application/vnd.ms-powerpoint

    AddOutputFilterByType DEFLATE application/x-shockwave-flash

    AddOutputFilterByType DEFLATE image/tiff

    AddOutputFilterByType DEFLATE application/x-font-ttf

    AddOutputFilterByType DEFLATE application/vnd.ms-opentype

    AddOutputFilterByType DEFLATE audio/wav

    AddOutputFilterByType DEFLATE application/vnd.ms-write

    AddOutputFilterByType DEFLATE application/font-woff

    AddOutputFilterByType DEFLATE application/font-woff2

    AddOutputFilterByType DEFLATE application/vnd.ms-excel

    <IfModule mod_mime.c>

        # DEFLATE by extension

        AddOutputFilter DEFLATE js css htm html xml

    </IfModule>

</IfModule>

 

08  Limpiar la base de datos

Limpiar la base de datos de WordPress cada cierto tiempo, también es muy importante para evitar que pese más de lo necesario.

Y es que tras cada nuevo artículo, comentario o acción, se van guardando automáticamente revisiones, borradores y opciones transitorias, que no son necesarias, pero que van aumentando el tamaño de nuestra base de datos y por lo tanto, ralentizando la velocidad de nuestro WordPress.

Para solucionarlo, te recomiendo el plugin WP-Optimize, que como comentábamos antes, no es necesario que tengas activado en todo momento si no que una vez utilizado, puedes desactivarlo hasta la próxima ocasión.

09  Desactivar los Pingbacks y los Trackbacks

Hoy en día las desventajas de los Pinbacks y los Trackbacks son muy superiores a sus beneficios por lo que lo ideal es desactivarlos.

En su momento, servían para avisar de los enlaces entrantes que vayan teniendo las entradas. Sin embargo hay servicios de terceros donde consultar esto y más, sin pagar un duro y además te ahorras que terceros exploten esto en su beneficio.

Para desactivar los Pingback y los Trackbacks, debes ir al escritorio de administración de WordPress y en el apartado Ajustes, pulsar en Comentarios.

Una vez allí, hay que desmarcar la opción de  “Permitir notificaciones de enlace desde otros sitios (pingbacks y trackbacks)”

10 ➤ Reducir los Scripts y funcionalidades de terceros al mínimo

Para terminar, como último consejo para optimizar la velocidad y acelerar WordPress, te recomiendo que evitar llenar tu web con código de terceros que puedan sobrecargar y ralentizar tu hosting con infinidad de llamadas al servidor o innumerables redirecciónes.

Algunos de estos servicios son los anuncios de AdSense, sistema de gestión de comentarios como Disqus, botones de redes sociales y funcionalidades similares.

Por supuesto, debes añadir los servicios que mejor le funcionen a tu web o te ayuden a monetizarla, pero debes hacerlo con cabeza y evitar sobrecargar tu servidor de manera innecesaria.

Por ejemplo, además de elegir la opción más ligera del plugin o código para redes sociales, lo ideal es que no añadas la opción de compartir en redes sociales menos importantes o que no utilices.

Del mismo modo, si tu web apenas recibe comentarios, deberías plantearte sustituir Disqus por el sistema de comentarios nativo de WordPress, ayudándote así a acelerar tu web.

Conclusión

No sólo del contenido vive un sitio web, ya que si nadie lo lee, ¿qué sentido tiene?

Para que nuestra web tenga una buena experiencia de usuario es necesario un mantenimiento constante y cumplir las reglas de optimización que hemos visto para conseguir mejorar la velocidad de WordPress.

Me despido, no sin antes agradecer de nuevo la oportunidad de poder aportar mi pequeño granito de arena a este mítico blog que tanto aporta a la comunidad WordPress.

Por supuesto, estoy a vuestra disposición en las redes sociales y en la zona de comentarios para responder cualquier duda sobre el artículo.

¡Gracias y hasta pronto!

Cómo Crear un Formulario de Contacto en WordPress con Contact Form 7 y WP Forms

Aprende Cómo Crear un Formulario de Contacto en WordPress con el plugin Contact Form 7 y WpForms.

Un formulario de contacto sirve para que tus clientes o lectores de tu blog te contacten, por diferentes razones. Para contratar tu servicios, comprar tu producto o preguntarte algo, dar soporte técnico.

En este video tutorial te muestro cómo crear un formulario de contacto en tu instalación de WordPress en tu dominio .com .net .org y más.

Después de instalar Contact Form 7 y WpForms pegas un “short code” en una de tus páginas estáticas en WordPress y inmediatamente puedes publicar tu formulario de contacto para que tus lectores de tu blog o clientes te contacten fácilmente. Aprende paso por paso como se consigue este short code con estos dos plugins gratuitos.

Comenta aquí abajo si tienes alguna duda sobre como instalar tu formulario de contacto en WordPress.

Theme Authenticity Checker – Revisa vulnerabilidades en tu plantilla de WordPress

La seguridad es sin duda uno de los temas más importantes de los cuales tenemos que ocuparnos en WordPress. Sin embargo, muchos Webmasters y bloggers lo ignoran hasta que llega el momento en que su sitio es hackeado o con algún virus que pone en peligro la integridad del sitio.

Existen muchos plugins de seguridad que pueden ayudar a reforzar la seguridad de cualquier instalación de WordPress. En artículos anteriores he recomendado iThemes Security, un excelente plugin que cubre muchas necesidades de seguridad y protege la plataforma de muchos posibles ataques o problemas.

Si aún no has instalado iThemes Security, puedes descargarlo aquí.

Theme Authenticity Checker – Para usar temas de Calidad

En este breve artículo vamos a hablar de un plugin llamado Theme Authenticity Checker.

Uno de los problemas de seguridad que muchos bloggers tienen con WordPress y no lo saben es que usan un tema con código maligno, con vulnerabilidades o con enlaces a otros sitios de SPAM o de cualquier otro tipo.

Esto sucede principalmente en los siguientes escenarios:

  • Se está usando un tema de pobre calidad
  • Se está usando un tema gratuito mal desarrollado o con problemas
  • Se está usando un tema premium descargado de forma ilegal en donde el proveedor le metió código maligno o con algún otro malware
  • Algún otro caso similar

No importa cuál tema estés utiliazando, es importante revisar que todos estén en buenas condiciones y no presenten vulnerabilidades que pongan en peligro tu blog o sitio Web. Incluso los temas que están instalados pero no activos pueden provocar muchos dolores de cabeza.

Con Theme Authenticity Checker puedes revisar en un par de clics en qué condiciones se encuentran los temas que tienes instalados en WordPress. Si hay algun problema con cualquiera, el plugin te lo notifica para que se puedan tomar medidas al respecto.

Cuando todo esta de forma correcta, podrás ver un menú similar a este:

theme-authenticity-checker

Descarga el plugin aquí: Theme Authenticity Checker

Recuerda que en cuanto a seguridad WordPress se refiere, lo mejor es estar siempre prevenidos para no tener que actuar ya que nuestro sitio está en peligro.

Cómo Crear un Widget Fijo en la Sidebar de WordPress

Una de las tendencias más usadas recientemente en los blogs y en el marketing es el uso de un Widget fijo cuando un usuario está navegando y consumiendo contenido. En este mismo blog he estado probando con esta estrategia y he notado buenos resultados en cuanto a clics y conversiones.

Un Widget fijo se nota y atrae mucho más la atención de los usuarios, lo cual ayuda a tener más clics, conversiones y ayuda a que se cumplan los objetivos de email marketing o de ventas.

¿Cómo crear un Widget Fijo en WordPress?

Existe un forma muy sencilla de agregar un widget fijo en tu blog de WordPress para usarlo en diferentes sidebars. Consiste en un plugin llamado Q2W3 Fixed Widget, el cual al instalarlo añade la opción la configuración de los widgets de seleccionar si se quiere que sea fijo o no.

fixedwidget

Una vez instalado, ingresa a Apariencia > Widgets. Selecciona y expande el widget que quieres que sea fijo; en la parte de abajo podrás ver una casilla que dice Fixed Widget.

fixed-widget

Te recomiendo que el widget que selecciones como fijo sea el último en tu sidebar, de lo contrario al hacer scroll down se va a encimar con los otros por unos momentos.

El Widget también incluye un panel de opciones de configuración para modificar algunos aspectos del plugin, el cual es muy sencillo y funciona excelente en cualquier plantilla de WordPress.

opciones-widget-fijo

También puedes tener 2 o más widgets fijos (recuerda que sean los últimos).

Ahora que ya sabes cómo usar los widgets fijos, instala el plugin y haz pruebas. Notarás más clics y mejores resultados en tus campañas 🙂

Sigue visitando el blog para aprender más tips y trucos de WordPress.

Digg Digg – Plugin para Hacer Viral tu Contenido

Las redes sociales son siempre una herramienta importante para hacer marketing en un blog, compartir contenido y generar tráfico a cualquier blog.

En un tutorial anterior vimos como instalar y configurar Sharebar, un plugin que permite insertar una barra en la parte lateral de las entradas de un blog para que los usuarios y lectores lo puedan compartir en las diferentes redes sociales de forma fácil y rápida.

La configuración de Sharebar es un poco tediosa e involucra insertar algunos códigos para que se muestren las redes sociales actuales y de mejor uso para SEO y tráfico.

Es por eso que me puse a buscar alternativas…¡y encontré un excelente plugin que hace lo mismo y que no requiere de tantos pasos para se pueda usar con las mejores redes sociales!

Se trata de Digg Digg.

Digg Digg – El Mejor Plugin para Insertar Botones de Redes Sociales y Hacer Marketing Viral.

diggdigg1

Vamos a ver paso a paso cómo configurar este excelente plugin.

Ingresa a tu Escritorio principal de WordPress y haz clic en Plugins > Añadir Nuevo.

Busca Digg Digg, instálalo y actívalo.

dd2

Ya que está instalado, podrás ver una sección llamada “Digg Digg” en la parte izquierda del escritorio. Ingresa a la opción de Global Config.

En la parte de Twitter, agrega tu usuario para que seas mencionado cada vez que alguien comparte una entrada de tu blog. Revisa también las demás opciones si necesitas cambiar algo.

dd3

Ahora ingresa a la sección de Floating Display. Aquí es donde podrás activar o desactivar las diferentes redes sociales que aparecen en la barra lateral.

dd5

También puedes configurar si quieres que salga sólo en entradas o también en páginas, excluir categorías y otras cosas más.

dd6

Si necesitas resetear las opciones, haz clic en la parte de hasta bajo en el botón azul que dice Reset Floating Display Settings.

dd7

Ahora podrás ver una barra en la parte izquierda de tus entradas para que tus lectores puedan compartir en Twitter, Facebook y otras redes sociales ☺

dd4

Tiene un diseño muy limpio y atractivo.

[stextbox id=”info”]Te recomiendo Digg Digg sobre Sharebar ya que es más fácil de configurar, modificar e incluye diferentes redes sociales por defecto y sin tener que agregarlas con código u otros métodos.[/stextbox]

Sigue visitando WpAvanzado.com para más tutoriales e información sobre WordPress 🙂