Tecnología

Inicio

Cómo cambiar el color de la barra lateral de fondo con un tema de WordPress

Cómo cambiar el color de la barra lateral de fondo con un tema de WordPress


En WordPress, barras laterales a menudo incluyen los widgets - pequeños programas que muestren el contenido como los menús o calendarios - y otra información para el lado de su contenido principal del blog. Existen barras laterales en sus propios archivos, el principal es sidebar.php. Puede abrir estos archivos desde el panel de WordPress e inspeccionar su HTML para obtener la información que necesita para cambiar el color de fondo de una barra lateral en la hoja de estilo. El archivo style.css contiene código de estilo Cascading Style Sheet (CSS) que controla el aspecto de todo el blog.

Instrucciones

1 Iniciar sesión en el panel de WordPress desde el directorio wp-admin de su sitio web. Navegar a la pantalla "Apariencia" y haga clic en el enlace "Editor" en "Apariencia" en el menú de la izquierda. Haga clic en el enlace a su archivo de la barra lateral en la sección "Plantillas".

2 Encuentra las div o sección de etiquetas que se colocan alrededor de la barra lateral en el código. Añadir un par de envolver etiquetas div si ves ninguno, y darles un nombre de identificación. Este es un ejemplo de código de barra lateral:

<Div id = clase "principal" = "barra lateral">

<? Php if (function_exists ( 'dynamic_sidebar') || dynamic_sidebar ( 'barra lateral primaria')!!):?>

<? Php endif; ?>

</ Div>

En el ejemplo anterior, podría necesitar el nombre de ID "primaria" de la primera etiqueta div. Guarde el archivo si la cambió.

3 Abra el archivo style.css en su editor de temas haciendo clic en el enlace debajo de "plantillas". Busque un selector como "#idname", donde "idName" es el nombre de ID de su div envolver o etiquetas de sección. Si no ve este selector, añadirlo a la parte inferior del archivo. Editar el código CSS por lo que se ve así:

idName {

background-color: #cecece;

}

El código anterior muestra cómo el color de fondo se establece para el div o sección con un nombre de identificación de "idName." Su selector puede incluir otros pares propiedad-valor.

4 Cambiar el valor de "background-color" al código para el color que desea utilizar. Puede utilizar colores como el "rojo" o llamado "púrpura", los códigos de color hexadecimal como "# ff0000" o RGBA códigos como (Rojo, Verde, Azul y Alfa) "RGBA (255, 255, 0, 0,5)" para especificar semi -Transparente colores. Guarde el archivo después de haber terminado.

Consejos y advertencias

  • Siempre una copia de seguridad de sus archivos de temas de WordPress antes de editarlos.