Avisos
Vaciar todo

añadir un top bar mediante código

12 Respuestas
3 Usuarios
0 Reactions
1,266 Visitas
Respuestas: 145
Estimable Member
Topic starter
 

Buenos días
Quisiera añadir un top bar a mi tienda hecha con storefront. Se que hay un plugin que lo hace, pero he encontrado un artículo en un blog en el que da un codigo para añadir a functions php y así no tener que poner el plugin.
Al añadir el códogo a functions php, me genera un error 500
¿Me podéis decir algo de si está mal el código? ó qué puede pasar
El código es el siguiente

Your text here

<?php
}
add_action( 'storefront_before_header', 'storefront_add_topbar' );

URL del sitio: Contenido solo visible a usuarios registrados


 
Respondido : 23/01/2018 10:47 am
Pepe
 Pepe
Respuestas: 41115
Illustrious Member Admin
 

Hola Antonio.

Añade el código pero sin la abertura de php " <?php "

/**
* Adds a top bar to Storefront, before the header.
*/
function storefront_add_topbar() {
?>

Your text here

<?php } add_action( 'storefront_before_header', 'storefront_add_topbar' );

Un saludo


 
Respondido : 23/01/2018 12:20 pm
Respuestas: 145
Estimable Member
Topic starter
 

Me sigue dando error 500. El código nuevo lo pongo al principio (creo que da igual)
Así es cómo tengo el archivo functions php

/**
* Adds a top bar to Storefront, before the header.
*/
function storefront_add_topbar() {
?>

Your text here

<?php
}
add_action( 'storefront_before_header', 'storefront_add_topbar' );

<?php
// Exit if accessed directly
if ( !defined( 'ABSPATH' ) ) exit;

// BEGIN ENQUEUE PARENT ACTION
// AUTO GENERATED - Do not modify or remove comment markers above or below:

// END ENQUEUE PARENT ACTION


 
Respondido : 23/01/2018 4:16 pm
Jhon
 Jhon
Respuestas: 44989
Illustrious Member Moderator
 

Hola

Te sale error porque tienes etiquetas PHP mal cerradas, mejor envía tu archivo functions.php para revisarlo, puedes adjuntarlo como .zip o subirlo a dropbox y enviarnos el enlace.

Saludos.


 
Respondido : 23/01/2018 4:22 pm
Respuestas: 145
Estimable Member
Topic starter
 

Hola
por fin he logrado crear el top bar, pero no consigo lo que yo esperaba, pues me empuja el encabezado hacia abajo y no me gusta. A lo mejor me he equivocado de planteamiento.
Lo que yo quiero es poner visible teléfono, e mail y watssap en la web y que también se vea en la versión móvil y pensé que en el encabezado sería imposible (por eso lo del topbar) pero no pregunte si se podría añadir al encabezado
¿ dónde y cóm lo puedo poner, qué me aconsejais?
Gracias por la ayuda


 
Respondido : 24/01/2018 12:23 pm
Pepe
 Pepe
Respuestas: 41115
Illustrious Member Admin
 

Hola Antonio.

poner visible teléfono, e mail y watssap en la web

Puedes añadir un widget de texto con esa información.
.- Accede a Widgets y añade un widget de texto por ejemplo en la posición TOP ( No se la estructura de tu web ya que es de pago y puedo revisarlo )

.- Añade lo siguiente a ese widget:

Teléfono: (123) 456-7890   Mail: cambiame@cambiame.123

Tienes que modificar el correo y el tel para que lo muestre con tus datos.

Un saludo


 
Respondido : 24/01/2018 1:17 pm
Respuestas: 145
Estimable Member
Topic starter
 

El problema es que el tema storefront no viene creada con zona top bar para widgets
¿Cómo lo hago?


 
Respondido : 24/01/2018 4:37 pm
Jhon
 Jhon
Respuestas: 44989
Illustrious Member Moderator
 

Hola

Veo que store front tiene posiciones limiatadas, sin embargo tienes dos opciones

Evaluar agregar una nueva posición o usar hooks, en el caso de hooks puedes revisar:
https://docs.woocommerce.com/document/add-static-content-to-the-storefront-header/

En el caso de nuevas posiciones podrías evaluar:
https://decodecms.com/anadir-una-nueva-zona-de-widgets-a-un-theme-wordpress/

En tu caso prueba primero con el código de hook y verifica en donde te aparece, allí podrías poner directamente todo tu código.

Saludos.


 
Respondido : 24/01/2018 5:40 pm
Respuestas: 145
Estimable Member
Topic starter
 

Al final he conseguido poner el telefono, mail y whatsapp encima del header;

utilizando el código que aporté primero y agregandolo a functions php; y el resultado es el que adjunto, pero quería saber si podría sustitiur las palabras teléfono, mail y whatsapp, por unos iconos para que fuese más corto el texto y así quedase mejor en la versión de móvil


 
Respondido : 26/01/2018 12:10 pm
Jhon
 Jhon
Respuestas: 44989
Illustrious Member Moderator
 

Hola

Store Front al parecer ya usa FontAwesome, que es un tipo de letra de íconos, por lo que puedes probar agregar los íconos con código HTML

Para el telefono:

Siempre se agrega fa como parte de la clase, por ejemplo:

class="fa .fa-whatsapp" para el whatsapp

Revisa todas las clases en:
Contenido solo visible a usuarios registrados

Saludos.


 
Respondido : 26/01/2018 5:45 pm
Respuestas: 145
Estimable Member
Topic starter
 

Muchas gracias
Ya he conseguido ponerlo y me gusta mucho como queda
¿Se podría además conseguir que enlazase, es decir cuando se pincha en el wahsap, teléfono ó mail, hiciese esa función


 
Respondido : 29/01/2018 1:26 pm
Pepe
 Pepe
Respuestas: 41115
Illustrious Member Admin
 

Hola Antonio.

Puede utilizar lo siguiente:

 

Para el correo:

 

la etiqueta " a href " es la que le indica la URL de destino que tendrá el enlace.

Un saludo


 
Respondido : 29/01/2018 1:40 pm