Foro de soporte WordPress en español


Soporte WordPress en español Soporte gratuito para webs alojadas en Webempresa.com
Habilitado para todos los clientes con planes de Hosting Alto Rendimiento a partir de 3GB y planes XL.

No ofrecemos soporte a webs alojadas en servidores externos o localhost, ni soporte css o programación.

Te recomendamos que leas esta información sobre nuestro sistema de soporte en el foro, te ayudará a sacar el máximo partido de nuestro conocimiento: Cómo podemos ayudarte.


Encuentra la solución a tu problema, buscando en nuestro foro:
Bienvenido, Invitado
Nombre de Usuario: Contraseña: Recordarme
Expertos en WordPress resuelven los problemas y dudas con tu Web. Servicio gratuito incluido para clientes de Webempresa. Soporte WordPress en español 24 horas, todos los días del año.

TEMA: Edición de Cabecera StoreFront

Edición de Cabecera StoreFront 3 meses 4 días antes #334200

Hola, acabo de encontrar cómo modificar la cabecera de Storefront, pero sólo el acomodo del logo en el centro y el índice, sin embargo, no he logrado encontrar el tema del tamaño del logo y el acomodo de la caja de búsqueda de productos.

Por lo que mi pregunta son las siguientes:

- Cómo aumentar el tamaño del logotipo
- Quiero acomodar la caja de búsqueda arriba del logo del lado derecho.

URL del sitio: Contenido oculto para usuarios invitados. Por favor, inicie su sesión para poder verlo.
Adjuntos:
  • Francisco
  • Avatar de Francisco
  • DESCONECTADO
  • Navegador Superior
  • Aprendiz de WordPress
  • Mensajes: 41
  • Karma: 0
El administrador ha desactivado la escritura pública.
Mejora la velocidad de tu WordPress

Edición de Cabecera StoreFront 3 meses 4 días antes #334203

Hola Francisco,

¿Ya intentaste hacer esos cambios mediante reglas CSS? Creo que esa sería la manera de hacerlo. Si desconoces CSS no t preocupes, podemos ayudarte con ello.

Saludos.
  • Bulmaro
  • Avatar de Bulmaro
  • DESCONECTADO
  • Administrador
  • Mensajes: 602
  • Gracias recibidas 49
  • Karma: 13
ArellanoB

Si nuestra ayuda te sirve déjanos tu testimonio y mejora así el posicionamiento de tu web:
Enviar mi Testimonio
¡Gracias!.
El administrador ha desactivado la escritura pública.
trasladar web gratis

Edición de Cabecera StoreFront 3 meses 4 días antes #334211

Hola, Bulmaro

Muchas gracias, la verdad, no conozco cómo hacerlo mediante CSS, el movimiento que hice que está visible en donde el logo está centrado fue una regla que encontré.

Así que si me ayudas con la regla para agrandar el sitio y otra regla para poner la búsqueda de productos arriba del logo del lado derecho te lo agradecería muchísimo :)
  • Francisco
  • Avatar de Francisco
  • DESCONECTADO
  • Navegador Superior
  • Aprendiz de WordPress
  • Mensajes: 41
  • Karma: 0
El administrador ha desactivado la escritura pública.
solucionar problemas wordpress

Edición de Cabecera StoreFront 3 meses 4 días antes #334220

Hola Francisco,

Claro, estamos para auxiliarte en estos casos.
  1. Para cambiar el tamaño del logo añade el siguiente CSS:
    @media (min-width: 768px){
    .site-header .site-branding img {
        height: auto;
        max-width: 500px !important;
    }}

    Donde 500px indica el tamaño en píxeles de la imagen.
  2. El buscador ya no lo veo como aparece en la captura que enviaste. Asumo que ya lograste quitarlo, ¿Cierto?
  • Bulmaro
  • Avatar de Bulmaro
  • DESCONECTADO
  • Administrador
  • Mensajes: 602
  • Gracias recibidas 49
  • Karma: 13
ArellanoB

Si nuestra ayuda te sirve déjanos tu testimonio y mejora así el posicionamiento de tu web:
Enviar mi Testimonio
¡Gracias!.
El administrador ha desactivado la escritura pública.

Edición de Cabecera StoreFront 3 meses 4 días antes #334221

Muchas gracias, ha quedado excelente lo del logo.

Sì, había quitado el buscador de productos mientras esperaba la respuesta, pero ya lo he activado nuevamente,

Me podrías ayudar con eso, para colocarlo arriba del logo pero dejarlo del lado izquierdo o derecho.

Gracias.
  • Francisco
  • Avatar de Francisco
  • DESCONECTADO
  • Navegador Superior
  • Aprendiz de WordPress
  • Mensajes: 41
  • Karma: 0
El administrador ha desactivado la escritura pública.

Edición de Cabecera StoreFront 3 meses 4 días antes #334226

Hola Francisco.

Para ello podemos crear un widget y asignarle un área:
  1. En Apariencia -> Editar tema -> functions.php, al final del contenido agrega:
    function wpb_widgets_init() {
     
        register_sidebar( array(
            'name'          => 'Search Before Header',
            'id'            => 'custom-header-widget',
            'before_widget' => '<div class="chw-widget">',
            'after_widget'  => '</div>',
            'before_title'  => '<h2 class="chw-title">',
            'after_title'   => '</h2>',
        ) );
     
    }
    add_action( 'widgets_init', 'wpb_widgets_init' );
  2. En Apariencia -> Editar tema ->header.php, justo debajo de la etiqueta <body>:

    <?php

    if ( is_active_sidebar( 'custom-header-widget' ) ) : ?>
    <div id="header-widget-area" class="chw-widget-area widget-area" role="complementary">
    <?php dynamic_sidebar( 'custom-header-widget' ); ?>
    </div>

    <?php endif; ?>
  3. En Apariencia -> Widtgets, verás que aparece un área llamada "Search Before Header", agrégale el widtget llamado "Search products"

  4. En Apariencia -> CSS Adicional agrega:
    #header-widget-area{
    margin-top: 3%;
    }
     
    #header-widget-area div.chw-widget .woocommerce-product-search button[type='submit']{
    	display: none; 
    }

Nota: Recuerda crear un respaldo del archivo functions.php y header.php antes de agregar lo anterior.

Si no te funciona por favor indícame cómo agregaste el logo, si solo usaste CSS no debería haber problema con lo que te he pedido agregar.

Saludos.
  • Bulmaro
  • Avatar de Bulmaro
  • DESCONECTADO
  • Administrador
  • Mensajes: 602
  • Gracias recibidas 49
  • Karma: 13
ArellanoB

Si nuestra ayuda te sirve déjanos tu testimonio y mejora así el posicionamiento de tu web:
Enviar mi Testimonio
¡Gracias!.
Última Edición: 3 meses 4 días antes por Bulmaro.
El administrador ha desactivado la escritura pública.

¿Te ha resultado interesante esta entrada del foro?

Suscríbete para recibir consejos y trucos útiles para tu Web.

Edición de Cabecera StoreFront 3 meses 2 días antes #334327

No me funcionó, de hecho mi tema no me permite hacer los cambios directamente en el área de apariencia, así que me fui al CPanel, al área de Theme y ahí me metí tanto en functions como en Header,
Anexo archivos para que veas lo que hice.
Adjuntos:
  • Francisco
  • Avatar de Francisco
  • DESCONECTADO
  • Navegador Superior
  • Aprendiz de WordPress
  • Mensajes: 41
  • Karma: 0
El administrador ha desactivado la escritura pública.

Edición de Cabecera StoreFront 3 meses 2 días antes #334328

Hola Francisco,

¿Podrías enviarme una captura de tu functions.php y header.php, tambien una vista de la pagína de widgets? Por favor.

Si estás usando Storefront no entiendo por qué no te dejaría editar los archivos anteriores desde Apariencia -> Editor de temas, yo utilicé ese tema para crear el widget y no tuve ningún problema.

Saludos.
  • Bulmaro
  • Avatar de Bulmaro
  • DESCONECTADO
  • Administrador
  • Mensajes: 602
  • Gracias recibidas 49
  • Karma: 13
ArellanoB

Si nuestra ayuda te sirve déjanos tu testimonio y mejora así el posicionamiento de tu web:
Enviar mi Testimonio
¡Gracias!.
Última Edición: 3 meses 1 día antes por Bulmaro.
El administrador ha desactivado la escritura pública.

Edición de Cabecera StoreFront 3 meses 1 día antes #334369

Sí te los mandé, a lo mejor se te pasó ver los archivos anexos, pero esta ves los voy a insertar para mayor facilidad.
Muestra1.png


Muestra2.png


Muestra3.png


Muestra4.png



Muchas gracias,
  • Francisco
  • Avatar de Francisco
  • DESCONECTADO
  • Navegador Superior
  • Aprendiz de WordPress
  • Mensajes: 41
  • Karma: 0
El administrador ha desactivado la escritura pública.

Edición de Cabecera StoreFront 3 meses 1 día antes #334371

Hola

Para mostrar la búsqueda en la parte superior derecha, usa el siguiente código CSS:
header.site-header{
    position:relative;
}
 
header.site-header .site-search{
    display:block;
    position:absolute;
    right:20px;
}    

Si quieres que la búsqueda igual se muestre en movil agrega adicionalmente:
@media(max-width:768px){
    header.site-header .site-search{
        position:static;
    }   
}

Saludos.
Si nuestra ayuda te sirve déjanos tu testimonio y mejora así el posicionamiento de tu web:
Enviar mi Testimonio
¡Gracias!.
El administrador ha desactivado la escritura pública.

Edición de Cabecera StoreFront 2 meses 4 semanas antes #334505

Funcionó excelente, gracias.
  • Francisco
  • Avatar de Francisco
  • DESCONECTADO
  • Navegador Superior
  • Aprendiz de WordPress
  • Mensajes: 41
  • Karma: 0
El administrador ha desactivado la escritura pública.

Edición de Cabecera StoreFront 2 meses 4 semanas antes #334506

Hola

Que bien que lo solucionaste.

Saludos.
Si nuestra ayuda te sirve déjanos tu testimonio y mejora así el posicionamiento de tu web:
Enviar mi Testimonio
¡Gracias!.
El administrador ha desactivado la escritura pública.

Temas Relacionados

5 Respuestas emo
Categoría: Pack Tienda WordPress
Tema iniciado 2 años 3 meses antes por Antonio
1634 Visitas
8 Respuestas emo
Tema iniciado 3 meses 2 semanas antes por Carmen
72 Visitas
4 Respuestas emo
Tema iniciado 5 años 3 semanas antes por Xavier
925 Visitas
8 Respuestas emo
Tema iniciado 1 año 3 meses antes por Adolfo
294 Visitas
2 Respuestas emo
Tema iniciado 4 años 7 meses antes por eduardo
3185 Visitas
1 Respuestas emo
Tema iniciado 4 años 8 meses antes por Adolfo
1422 Visitas
7 Respuestas emo
Tema iniciado 4 años 8 meses antes por Adolfo
4290 Visitas
11 Respuestas emo
Tema iniciado 4 meses 2 días antes por Jose Carlos
137 Visitas
1 Respuestas emo
Tema iniciado 1 año 4 meses antes por Mercedes
617 Visitas
1 Respuestas emo
Categoría: Pack Tienda WordPress
Tema iniciado 2 años 4 meses antes por PERE
507 Visitas

Tiempo de carga de la página: 0.587 segundos