Como utilizar los hooks de la plantilla Astra Wordpress

Cómo utilizar los hooks de la plantilla Astra de WordPress

Este va a ser el primero de una serie de articulos en los que trataremos en profundidad el theme de WordPress Astra.

Para iniciar esta serie de artículos vamos a empezar con una de las características que nos va a ahorrar mucho tiempo, especialmente a la hora de trabajar en partes comunes en toda la web. Hoy os explicaremos como utilizar los hooks de la plantilla Astra de WordPress.

Qué son los hooks de astra

A grandes rasgos y de una forma un poco simplificada podríamos decir que los hooks son unos «contenedores» o «ubicaciones» que están repartidos por toda la plantilla y que nos permiten crear un contenido adicional ya sea en forma de código, texto plano, shortcodes o con editores visuales tales como Elementor o Beaver Builder.

A continuación os dejamos una imagen del mapa de hooks de la plantilla.

Mapa de hooks de la plantilla Astra pro

Creamos nuestro primer hook en astra pro

Una vez instalado el plugin que añade las opciones de pago a nuestra versión gratuita de Astra seguiremos la ruta Apariencia / opciones de Astra y activaremos el módulo diseños personalizados (recuadro rojo de la imagen).

Podremos observar que debajo de opciones de Astra nos aparece una nueva opción, diseños personalizados (recuadro azul de la imagen). Clicamos y seguimos a la siguiente pantalla.

Activando el modulo de archivos personalizados de astra pro

Para añadir nuestro diseño personalizado bastará con clicar en el botón añadir. Ahora simplemente tendremos que crear y personalizar el contenido de nuestro hook:

  1. Añadimos el titulo del diseño personalizado.
  2. En el caso de que vayamos a general en contenido a través de código clicaremos el botón de activar código. Un ejemplo claro de para qué podriamos utilizar esta opción es para insertar el código de seguimiento de Google Analitycs. Al agregar el código, debes tener en cuenta incluir declaraciones de apertura del código que pegues, es decir, definir si es php, css o javascript.
  3. Este botón nos ayudará a crear el contenido desde un editor visual. Puede variar dependiendo de que editor utilicemos. Si no tenemos ninguno instalado esta opción no estará disponible, obligandonos a crear el contenido en el punto de la imagen marcado con el numero 4.
  4. Para crear el contenido con el editor clásico de WordPress.
  5. En este desplegable definiremos que tipo de diseño vamos ha crear. Astra pro nos permite personalizar las secciones de cabecera, pie de página y la página de error 404 que son temas que tocaremos en posteriores artículos. Nosotros seleccionaremos hooks.
  6. En el aparatado acción definiremos en que hook queremos que se aplique nuestra personalización. Para saber que hook nos interesa consultaremos el mapa de hooks que os dejamos unas lineas mas arriba. Puntualizar que en dicha imagen solo aparecen los hooks estandar, dependiendo de que plugins tengamos instalados en este selector nos aparecerán más. Un ejemplo claro de este es si tenemos Woocomerce.
  7. Pongamos el caso de que queremos personalizar 2 secciones y que dichas secciones se deben insertar en el mismo hook. La sección prioridad es para definir cual se ejecutará antes. A prioridad más baja se ejecutará antes.
  8. La sección espaciado es para definir margenes en el hook.
  9. En mostrar en definiremos donde queremos que se aplique nuestro hook añadiendo una regla de visualización o donde no queremos que se vea agregando una regla de exclusión.
  10. En perfiles de usuarios definiremos que rol de usuario podrán ver la personalización del hook.

Pongamos un par de ejemplos que es quizás como mejor se entiende como funcionan los hooks:

Ejemplo 1: Añadir botones para compartir en redes sociales en el pie del contenido de todas las páginas de nuestra web excluyendo la página de contacto y para todos los usuarios.

Elemplo de como crear hooks con astra pro

Ejemplo 2: Añadir botones para compartir en redes sociales y artículos relacionados en el pie de las entradas del blog después de los comentarios y para todos los usuarios.

Alternativa gratuita a astra pro

astra hooks plugin
Si no necesitáis una personalización muy elaborada exite una opción gratuita para trabajar con los hooks de Astra, esa opción es el plugin Astra hooks, aunque es una opción muy reducida de lo que os hemos contado en este post, ya que no permite crear reglas de visualización y exclusión, definir que tipo de usuarios pueden ver los diseños ni editar a través de editores visuales.

Trabajar con los hooks de Astra Pro ofrece una gran versatilidad en cuanto a opciones de diseño y personalización, es muy intuitiva y fácil de usar.

Bien, pues hasta aquí el primero de un número de artículos en los que entraremos en profundidad a explicar las múltiples opciones que tiene este fantástico theme. Recuerda que si tienes alguna duda respecto al tema de este post puedes hacerlo dejando un comentario. Saludos

Compártenos en tu red social favorita
Share on facebook
Share on google
Share on twitter
Share on linkedin
Share on whatsapp
¿Te ha resultado útil? ¡Puntúalo!
[Total: 2 Media: 5]

Dejar un comentario

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

He leido y acepto nuestra política de privacidad. *

Responsable:Carlos Jiménez Mendez
Finalidad:Atender solicitudes de información, ejecución de la contratación de servicios y remisión de comunicaciones comerciales.
Legitimación:Consentimiento del interesado y contratación de productos y/o servicios del Responsable
Destinatarios:No se ceden datos a terceros, salvo obligación legal.
Personas físicas o jurídicas directamente relacionadas con el Responsable
Encargados de Tratamiento adheridos al Privacy Shield
Derechos:Acceder, rectificar y suprimir los datos, portabilidad de los datos, limitación u oposición a su tratamiento, derecho a no ser objeto de decisiones automatizadas, así como a obtener información clara y transparente sobre el tratamiento de sus datos.
Información adicional:Se puede consultar la política de privacidad de forma más detallada aquí.

Últimos post del blog

Como crear una web para inmobiliaria con wordpress

Cómo crear una web para inmobiliarias con WordPress

Si estas buscando cómo crear una web para inmobiliarias con WordPress en este post te vamos a explicar como llevarlo a cabo con el plugin Estatik. ¿Por qué con un plugin cuando hay plantillas diseñadas especialmente para esta función? Pues por tres motivos: 1º- Por

Crear paginas web gratis con Wordpress

Crear tu web gratis con WordPress y Demoswp

Quizás la forma más práctica y barata de desarrollar un proyecto web es instalando xampp o wamp, programas que te permite trabajar desde tu ordenador con un servidor apache y bases de datos. Sin embargo el gran inconveniente que tiene trabajar de esta forma es

Ir arriba

Esta web utiliza cookies para que tengas la mejor experiencia. Si continúas navegando estás dando su consentimiento para la aceptación de las mencionadas cookies y de sus políticas.