Aviso en tienda WooCommerce


Hay muchos casos diferentes en los que puede querer mostrar un aviso en toda la tienda. Es posible que quieras mostrar un mensaje para captar la atención de tus visitantes, para una oferta de envío gratuito o para cuando se cogen vacaciones.

En este artículo, te mostraremos dos maneras de añadir esta notificación: una utilizando un simple fragmento de código, y otra utilizando el aviso de woocommerce.

Ambos métodos implican un simple estilo en línea para mejorar la apariencia de la notificación.

Notificaciones en toda la tienda con código

El siguiente código se añade un banner de notificación en la parte superior de su tienda. Puedes personalizar el texto y el estilo para adaptándolo a tus necesidades y al diseño de su tienda.

Para añadir este código entra al apartado apariencia / editor de temas

Copia el código entro de la página functions.php

¿Necesitas una página web?

Nosotros hacemos realidad la parte online desarrollando una página web que te diferencie de tu competencia, posicione dentro de tu sector y te de visibilidad frente a tu público potencial, a la gente que te necesita pero aún no te conoce.

posicionamiento seo

Código para el aviso de tienda WooCommerce

Tan sencillo como copiar el texto de abajo y darle al botón de guarda. Te saldrá un mensaje diciendo que todo está correcto.


/**
 * Añadir aviso en la tienda.
 */
function ace_store_wide_banner() {
	?><style>
		body { padding-top: 2em; }
		.store-wide-banner {
			position: fixed;
			width: 100%;
			text-align: center;
			top: 0;
			background: #9e97ef;
			color: white;
			height: 2em;
			line-height: 2em;
			font-weight: 600;
			text-shadow: 0 0 1px rgb(115, 112, 150);
			z-index: 999;
		}
		.store-wide-banner strong { font-weight: 900; }
		.store-wide-banner a {
			color: white;
			border-bottom: 3px solid rgba(255,255,255, 0.6);
		}
	</style>
	<div class="store-wide-banner">
		<div class="banner-text"><strong>Super Sale!</strong> 30% off everything, ending July 14th. <a href="/sale">Shop Now</a></div>
	</div><?php
}
add_action( 'wp_footer', 'ace_store_wide_banner' );

Aviso de tienda desde woocommerce

El propio woocommerce tiene una aviso de tienda incorporado. La opción anterior de arriba es para página hechas en WordPress que no tienen el plugin de woocommerce.
Justo aquí abajo te muestro como activar el aviso en tienda.

Entra en el apartado WooCommerce / ajustes

En apariencia entra en el apartado WooCommerce

Una vez dentro de WooCommerce selecciona aviso en la tienda

Cambia los textos y activa el aviso de tienda para que salga el mensaje.

Para cualquier duda pues contactar con nosotros en el siguiente enlace

xufa diseño web
Author avatar
Ayrton Gómez
https://xufa.es
Nos apasiona lo que hacemos ¡desde siempre! y llevamos muchos años de experiencia a las espaldas (y al teclado) en diseño y desarrollo web. Síguenos en línkedin