Tutorial de configuración de la barra lateral de WordPress: desde los primeros pasos hasta los diseños personalizados

WordPress Las barras laterales desempeñan un papel muy práctico a la hora de mejorar la experiencia de navegación, enriquecer la funcionalidad de la página y orientar el comportamiento del usuario. Tanto para los principiantes que acaban de empezar a crear un sitio web como para los usuarios avanzados que pretenden optimizar la estructura de la página, dominar el uso de las barras laterales de WordPress y las técnicas de personalización es una habilidad básica para mejorar la profesionalidad del sitio web.

En este artículo se describen las principales funciones de la barra lateral: cómo activar, añadir y gestionar widgets, configurar reglas de visualización para distintas páginas y crear un diseño de barra lateral totalmente personalizado.

Imagen [1]- WordPress Sidebar Ajustes y Diseños Personalizados Guía Completa

I. ¿Qué es WordPress Sidebar?

La barra lateral (Sidebar) es Temas de WordPressEl área de una entrada de blog que se utiliza para mostrar contenido adicional, que normalmente se encuentra en la secciónDerecha o izquierda. se le puede añadir:

  • Cuadro de búsqueda, categorías, etiquetas
  • Últimos artículos, Artículos populares
  • Botones de redes sociales, anuncios, formularios de suscripción
  • Contenido HTML o shortcode personalizado

El hecho de mostrar o no la barra lateral, en qué página se muestra y qué contenido se pone en ella, depende totalmente de lo que esté utilizando la aplicacióntemáticaresponder cantandoMétodo de ajuste.

Imagen [2]- WordPress Sidebar Ajustes y Diseños Personalizados Guía Completa

II. Cómo activar y gestionar la barra lateral

1. Acceso a la pantalla de configuración del widget

Senda:Backend de WordPress → Apariencia → Widgets

Verá las áreas de la barra lateral proporcionadas por el tema (por ejemplo, Sidebar, Footer, Header Widgets, etc.), cada una de las cuales es libre de añadir diferentes widgets (Widgets).

Imagen [3]- WordPress Sidebar Ajustes y Diseños Personalizados Guía Completa

2. Añadir y gestionar widgets

  • Arrastre y suelte los gadgets en el área designada de la barra lateral.
  • Configurar la correspondencia (por ejemplo, introducir un título, seleccionar una categoría, etc.)
  • Texto de apoyo,imágenesA continuación figuran algunos ejemplos de los tipos de servicios que puede prestar la empresa
  • Arrastre el orden para ajustar el orden de visualización
Imagen [4]- WordPress Sidebar Ajustes y Diseños Personalizados Guía Completa

En tercer lugar, configura diferentes páginas para que muestren diferentes barras laterales

Algunos temas y plugins tienen la capacidad de establecer diferentes barras laterales en función del tipo de página o categoría. Las principales formas de implementar esto son las siguientes:

Método 1: Utiliza un tema que admita varias barras laterales

por ejemplo AstrayGenerarPrensayKadence etc. permite asignar diferentes áreas de widgets a diferentes plantillas de página.

Método 2: Utilizar plug-ins para conseguir una visualización condicional

Plugin recomendado:

Imagen [5]- WordPress Sidebar Ajustes y Diseños Personalizados Guía Completa
  • Opciones de widgetsEstablecer las condiciones de visualización de cada gadget (por ejemplo, mostrarlo sólo en la página de inicio o en la página de categorías).
Imagen [6] - WordPress Sidebar Settings and Custom Layouts Guía Completa

De esta forma, puede conseguir mostrar artículos relacionados en las entradas del blog y filtros de productos en las páginas de la tienda.

IV. Diseño personalizado y páginas sin barras laterales

1. Selección del modelo de página

Muchos temas ofrecen funciones de selección de plantilla de página a las que puedes cambiar al editar una página:

  • Ancho completo (sin barra lateral)
  • Plantilla por defecto
Imagen [7] - Guía completa de configuración de la barra lateral y diseños personalizados de WordPress

2. Uso del constructor de páginas para implementar diseños personalizados

Si utiliza ElementoryCastor Constructor o Editor de bloques, se puede implementar un diseño personalizado de la siguiente manera:

  • Reutilice los estilos personalizados de la barra lateral mediante la función "Widget de plantilla".
  • Configurar la visualización adaptativa: mostrar la barra lateral sólo en escritorio, ocultarla en móvil

V. Preguntas frecuentes y sugerencias de optimización

Imagen [8]- WordPress Sidebar Ajustes y Diseños Personalizados Guía Completa
  • ¿Barras laterales colapsadas o desordenadas en el móvil?
    La comprobación del tema para la adaptación responsiva puede optimizarse manualmente con una consulta de medios CSS.
  • ¿Los widgets añadidos no tienen un estilo uniforme?
    Utilice los estilos de widget proporcionados por el tema o el paisajismo CSS personalizado.
  • ¿La barra lateral carga demasiado contenido y afecta a la velocidad?
    Reduzca las llamadas a demasiados widgets dinámicos y evite cargar demasiados scripts externos (por ejemplo, anuncios de terceros, botones para compartir en redes sociales).

VI. Conclusión

La barra lateral parece que es sólo una pequeña parte de la página, pero en el WordPress El diseño del sitio y el uso de la experiencia juega un papel importante. A través del tema viene con la configuración, extensiones de plugins, o el uso de constructor de páginas para crear un diseño personalizado, dominar el uso de barras laterales, puede hacer que la estructura del sitio es más clara, la visualización de contenido más jerárquico.


Contacte con nosotros
¿No puede leer el tutorial? Póngase en contacto con nosotros para obtener una respuesta gratuita. Ayuda gratuita para sitios personales y de pequeñas empresas
Servicio de atención al cliente WeChat
Servicio de atención al cliente WeChat
Tel: 020-2206-9892
QQ咨询:1025174874
(iii) Correo electrónico: info@361sale.com
Horario de trabajo: de lunes a viernes, de 9:30 a 18:30, días festivos libres
© Declaración de reproducción
Este artículo ha sido escrito por Toast
EL FIN
Si le gusta, apóyela.
felicitaciones583 compartir (alegrías, beneficios, privilegios, etc.) con los demás
comentarios compra de sofás

Por favor, inicie sesión para enviar un comentario

    Sin comentarios