Cómo usar las imágenes en diseños temáticos niño wordpress

Muchos temas de WordPress utilizan imágenes para añadir toques agradables al diseño. Por lo general, estas imágenes se añaden a un directorio llamado imágenes dentro del tema. Del mismo modo que un tema padre puede hacer referencia a las imágenes en su style.css archivo, su hijo temas tienen su propio directorio de imágenes.

El Veinte Catorce tema por defecto en realidad no utilizar imágenes en absoluto, por lo que para este ejemplo, verá otro tema de WordPress llamado veinte once (que viene empaquetado en cada instalación de WordPress). Se siguen los mismos pasos para crear un tema menor para el tema veinte once.

El uso de la imagen de un tema niño en una hoja de estilo temático infantil

La inclusión de una imagen Tema del niño en una hoja de estilo temático infantil es común. Para ello, sólo tiene que añadir la nueva imagen para el niño el tema de imágenes directorio y se refieren a ella en el tema de los niños style.css archivo. Para tener una idea de la mecánica de este proceso, siga estos pasos:

1. Crear un imágenes directorio dentro del directorio del tema de los niños: / wp-content / themes / TwentyEleven-hijo / images.

2. Añadir una imagen para usar en el directorio.

   Para este ejemplo, añadir una imagen llamada cuerpo-bg.jpg.

3. Añadir el estilo necesario para el niño el tema de style.css presentar, de la siguiente manera:

/ * Nombre del Tema: TwentyEleven ChildDescription: Mi niño fabulosa themeAuthor: Lisa Sabin-WilsonVersion: 1.0Template: TwentyEleven url * / @ import (` ../ TwentyEleven / style.css `) - body {background: url #ffffff (` imágenes /body-bg.jpg `) repetir-x-}

Con una actualización rápida del sitio, ver que el sitio cuenta ahora con un nuevo fondo. Se puede ver cómo el fondo ha cambiado de blanco liso imagen de fondo gradiente de un bonito color negro a gris vertical, con el color de fondo cambiado para que coincida con el color gris en la imagen (indicado por el #bfbfbf código).

El uso de la imagen de un tema principal en una hoja de estilo temático infantil

imágenes del tema del niño son aceptables para la mayoría de los propósitos. A veces, sin embargo, es mejor usar imágenes suministradas por el tema de los padres. Se podía copiar la carpeta de la imagen el tema de los padres, con todas sus imágenes, con el tema de los niños, pero que evitaría el tema niño de que coincida con el tema de los padres si la imagen el tema de los padres cambia nunca, como por ejemplo después de una actualización.

Afortunadamente, puede hacer referencia a una imagen en el tema de los padres con el @importar gobernar la misma manera se puede hacer referencia al tema de los padres style.css archivo.

En el pie de página del diseño veinte once, una línea de texto aparece que indica “Con la tecnología de WordPress.” En este ejemplo, desea agregar la imagen del logotipo en la parte delantera del texto de crédito en el pie de página. Debido a que la imagen del logotipo ya existe dentro del tema de los padres, simplemente puede añadir una personalización a la de niños del tema de style.css presentar para realizar este cambio, de la siguiente manera:

/ * Nombre del Tema: veinte once ChildDescription: Mi hijo fabulosa themeAuthor: Lisa Sabin-WilsonVersion: 1.0Template: TwentyEleven url * / @ import (` ../ TwentyEleven / style.css`) - pie de página # sitio generador de un {background: url ( `../ TwentyEleven / images / wordpress.jpg`) sin repeatpadding: 2px 25px;}

Guarde el archivo y actualizar su sitio web.

El uso de la imagen de un tema niño en una hoja de estilo tema de los padres

En cuanto a los ejemplos anteriores, puede que se pregunte si la sustitución de una imagen utilizada en hoja de estilo de los padres con los que se encuentra en el directorio del tema de los niños es posible. Para ello sería necesario un cambio de hoja de estilo del tema de los padres, y la idea detrás de un tema de los niños es evitar cambios en la matriz, lo que no, eso no es posible.

Sin embargo, puede anular la regla del tema de los padres para hacer referencia a la nueva imagen del tema de los niños por la simple creación de una regla primordial en la hoja de estilo del tema de los niños que apunta a la nueva imagen.

Usted puede tomar un paso más allá. Por ejemplo, el logotipo de WordPress en el pie de página es demasiado pequeña. Un logotipo más grande sería mejor. Utilice el Medio PNG: 100 x 100 (gris-m.jpg) WordPress botón que aparece en la WordPress.org Logos y la página de gráficos.

Después de cargar el logotipo deseado en el directorio de imágenes de su tema de niño (por ir a / wp-content / themes / TwentyEleven-hijo / images) como gris-m.jpg, el seguimiento style.css archivo reemplaza el logotipo de WordPress en el pie de página del tema de los padres con el nuevo botón de WordPress:

/ * Nombre del Tema: TwentyEleven ChildDescription: Mi hijo fabulosa themeAuthor: Lisa Sabin-WilsonVersion: 1.0Template: TwentyEleven url * / @ import (` ../ TwentyEleven / style.css`) - pie de página # sitio generador de un {background: url (imágenes / wp-logo.jpg) de centro izquierda no-repeat-padding: 2px 110px;}

Ahora su tema de WordPress niño muestra su orgullo fuerte y claro con el nuevo logotipo más grande desde la página oficial WordPress.org.

No se puede reemplazar directamente imágenes del tema de los padres. Más bien, debe proporcionar una nueva imagen en el tema de los niños y anular el estilo del padre para referirse a esta nueva imagen.