Saltar al contenido
José Marin de la Fuente
José Marin de la Fuente
  • Inicio
  • jmdf
    • Consultor Tecnológico
    • En los medios
    • CodePen
    • ebooks
  • Secciones
    • Blog Personal
    • Drones
    • Marketing Digital
    • Mundo 360
    • Redes Sociales
    • Seguridad informática
    • SEO
    • Tecnología y Mundo Digital
    • WebDesigners, WebMasters & Developers
  • My Tools
    • Calendar Link Generator Online
    • WhatsApp Link Generator Online
    • HTML Obfuscator Online
    • JavaScript Obfuscator Online
    • JWT Decoder
    • QR Online Generator
    • WordPress Password Hash Generator
    • String art generator
    • Editor HTML
    • Test – Tabla Schulte
    • Word Counter
    • Generador de mapeo de imagenes
    • Yellow Dots Decoder
  • Proyectos
    • Lectura Veloz | Chrome Extension
    • FocusTasks | Chrome Extension
  • hangar18
  • Contacto
José Marin de la Fuente José Marin de la Fuente
  • Inicio
  • jmdf
    • Consultor Tecnológico
    • En los medios
    • CodePen
    • ebooks
  • Secciones
    • Blog Personal
    • Drones
    • Marketing Digital
    • Mundo 360
    • Redes Sociales
    • Seguridad informática
    • SEO
    • Tecnología y Mundo Digital
    • WebDesigners, WebMasters & Developers
  • My Tools
    • Calendar Link Generator Online
    • WhatsApp Link Generator Online
    • HTML Obfuscator Online
    • JavaScript Obfuscator Online
    • JWT Decoder
    • QR Online Generator
    • WordPress Password Hash Generator
    • String art generator
    • Editor HTML
    • Test – Tabla Schulte
    • Word Counter
    • Generador de mapeo de imagenes
    • Yellow Dots Decoder
  • Proyectos
    • Lectura Veloz | Chrome Extension
    • FocusTasks | Chrome Extension
  • hangar18
  • Contacto
Modo Visual
Redes Sociales

Buscar en el blog

WebDesigners, WebMasters & Developers • 4 min de lectura

Crear sidebars en WordPress

19 abril 2013
wordpress

Creando manualmente nuestras sidebars nos permitirá añadir o quitar widgets desde el panel de administración y ordenarlos según queramos. Aparte también hace que podamos establecer qué id’s o clases de CSS queremos para la sidebar y así poder darle estilos. Para ello hay que realizar dos pasos: registrarla en el functions.php y crear un archivo sidebar.php o sidebar-id.php.

Registrar la sidebar en el functions.php

Abriremos nuestro fichero de funciones del template que estemos usando y añadimos el siguiente código:

if(function_exists('register_sidebar')) {
    register_sidebar(array(
        'name'          => 'Sidebar general',
        'id'            => 'general',
        'before_widget' => '<aside id="%1$s">',
        'after_widget'  => '</aside>',
        'before_title'  => '<h3>',
        'after_title'   => '</h3>',
    ));
}

Básicamente lo que hacemos es registrar una sidebar con el nombre Sidebar general (es el que saldrá en el panel de administración) y con un id (que también se usa como id de CSS) “general”.

Los dos siguientes parámetros que le pasamos a la función sirven para determinar que tipo de tag html queremos que contenga cada uno de los widgets. En este caso usamos

que es el que se usa en HTML5. Si no estás seguro de usarlo recomiendo como alternativa usar la etiqueta

. Si no le especificamos ningún inicio ni cierre del widget WordPress usará las etiquetas

Los dos últimos parámetros indican con qué etiquetas queremos que se usen en los títulos de los widgets. Por defecto WordPress pone etiquetas

Crear un fichero sidebar.php o sidebar-id.php

Al definir una nueva sidebar en nuestro template WordPress irá a buscar un fichero sidebar.php que es el que llamará a la sidebar dinámica. La documentación de WordPress dice que si no encuentra este fichero cargará el que está en wp-includes/theme-compat/sidebar.php. Pues el caso es que cuando no encuentra el fichero nos sale el siguiente Notice en la web: Notice: Tema sin sidebar.php está obsoleto desde la versión 3.0 y no hay alternativas disponibles. Por favor, incluye la plantilla sidebar.php en tu tema. Mirándome el fichero que WordPress incluye cuando no encuentra el sidebar.php aparece la siguiente info en la cabecera:

/**
 * @package WordPress
 * @subpackage Theme_Compat
 * @deprecated 3.0
 *
 * This file is here for Backwards compatibility with old themes and will be removed in a future version
 *
 */

Esto quiere decir que en futuras versiones de WordPress este fichero dejará de existir. Por lo tanto si no tenemos este fichero nos quedaremos sin sidebar. Así que habrá que crearlo:

<div id="sidebar" role="complementary">
  <?php if (!dynamic_sidebar('general')); ?>
</div>

Con estas tres líneas ya estamos llamando al contenido (los widgets) de nuestra sidebar dinámica general. Lo que hace esta función es llamar a cada uno de los widgets que contiene la sidebar y los printa allí donde la habremos llamado. Devolverá TRUE si la función se ha ejecutado correctamente (si tiene widgets) y FALSE si no.

Si da FALSE lógicamente se ejecutará el código que haya dentro del if, así que para asegurarnos que siempre se mostrará algo estaría bien poner un par de widgets “estáticos”. Veréis que en la documentación de la función dynamic_sidebar() se recomienda crear estos tipos de widgets.

Si necesitáis dos o más plantillas de sidebars, por lo que sea, habría que crear el fichero sidebar-general.php. Así cuando llaméis a la sidebar “general” WordPress usará este fichero. En caso contrario usará la plantilla normal sidebar.php

Mostrar la sidebar

Para mostrar la sidebar solo tendremos que llamar a la función get_sidebar($nombre) allí donde queramos que la sidebar se muestre. El parámetro $nombre indica el “id” de la sidebar que queremos mostrar (en nuestro caso “general”). Si no se especifica se muestra los widgets “estáticos” que he explicado más arriba.

Fuente: http://joanartes.com/blog/sidebar-wordpress/

Comentarios
Compartir este artículo:

Navegación de entradas

Artículo anterior ← [Account Killer] Elimina tu perfil de diversos Redes Sociales de forma Rápida y Sencilla
Siguiente artículo ¿Cómo crear un gran hashtag? →

Artículos Relacionados

competencia
WebDesigners, WebMasters & Developers

4 herramientas gratuitas imprescindibles para analizar a tu competencia

31 agosto 2012 • 4 min de lectura
WebDesigners, WebMasters & Developers

Role Manager para WordPress

28 julio 2009 • 3 min de lectura
vmware-workstation-12
WebDesigners, WebMasters & Developers

El encendido de una máquina virtual falla y aparece el error: El Servicio de autorización VMware no se está ejecutando (2016857)

17 octubre 2016 • 3 min de lectura
advertise width me
Baitdom Domótica para el hogar en Tucumán
Google Street View Trusted Photographer | Tucumán
grupo de desarrolladores tucumanos en Facebook

Entradas recientes

  • JEV AI: El Modelo ‘Sistema 1’ | 193x Más Rápido que los LLM | Análisis Completo
  • Cómo buscar archivos públicos de Google Drive con Google Dorks y proteger tu información
  • Cómo vender productos digitales con Landing Pages, Tiendanube y Meta Ads
  • Métricas de Meta Ads: guía completa para entender CPM, CTR, CPC, CPA, ROAS y optimizar campañas
  • Framework 3Qs en Meta Ads: Diagnóstico de Campañas y Optimización
advertise width me
DEVELOPER TOOLBOX

Mis Herramientas & Utilidades

Colección de utilidades web interactivas para desarrolladores y profesionales.

JWT Decoder POPULAR

Decodifica y verifica tokens JWT

JSON Formatter

Embellece y valida JSON

Base64 Encoder

Codifica y decodifica Base64

Hash Generator

MD5, SHA-256 y más

Regex Tester

Prueba expresiones regulares

CSS Gradients NUEVO

Generador de degradados CSS

© 2026 José Marin de la Fuente. Todos los derechos reservados.