Realizar modificaci...
 
Avisos
Vaciar todo

Realizar modificaciones en plantilla de Blog de Wordpress (Pace)

12 Respuestas
5 Usuarios
0 Reactions
897 Visitas
Respuestas: 245
Estimable Member
Topic starter
 

Buenos días,

adjunto una imagen como referente de lo que cómo pretendo que quede este blog de Wordpress.
El punto importante es el siguiente:
• Poder añadir el fondo que quiera (ver ejemplo). Veréis que la plantilla Pace ofrece unos personalizados, pero debo poder añadir el del ejemplo.

Gracias y saludos!

Emigdio

URL del sitio: Contenido solo visible a usuarios registrados


 
Respondido : 09/03/2015 10:01 am
Julen
Respuestas: 2894
Famed Member Admin
 

Hola Emigdio Benavent Payá,

La manera mas sencilla de modificar el fondo es utilizando la extensión Background Manager.

En el siguiente articulo, se explica todas las características y su utilización con el fin de modificar el fondo:
https://www.webempresa.com/blog/item/1497-modifica-el-fondo-de-tu-tema-de-wordpress.html

Saludos


 
Respondido : 09/03/2015 10:44 am
Respuestas: 245
Estimable Member
Topic starter
 

Buenos días de nuevo, Julen,

por favor, hay otrra cuestión importante: los botones de la izquiera donde aparece Inicio, Nosotros, Servicios y Contacto, es necesario también poder modificar ese color, en este caso para negro.

Te agradezco que me informes sobre esto. Muy agradecido,

Emigdio


 
Respondido : 09/03/2015 10:50 am
Rafael
Respuestas: 1975
Noble Member Moderator
 

¡Hola Emigdio!

Tendrás que modificar la plantilla CSS de tu sitio web para conseguir que el recuadro de cada sección sea de color negro.

Para ello, tendrás que acceder a tu cuenta cPanel (midominio.com/cpanel). Allí navegar hasta el bloque Archivos -> Administrador de Archivos.

Una vez dentro, tendrás que ir a la ruta /wp-content/themes/yoo_pace_wp/styles/lilac/css y allí editar el archivo style.css con el botón derecho y editar.

Tendrás que buscar la siguiente línea de código:

.menu-dropdown li.active .level1, .menu-dropdown li.level1.hover .level1 {
  background: #827ac3;
}

Deberás de quitar el atributo #827ac3 y sustituirlo por el siguiente:

background: black;

No obstante, siempre haz copia de seguridad a tus archivos por lo que pudiera pasar antes de modificar o hacer cambios en tu página web. Si no sabes cómo, te recomendamos visitar:

https://www.webempresa.com/blog/copias-de-seguridad-desde-el-panel-de-hosting-cpanel.html

Además, hacer cambios en los CSS es un poco delicado, ya que lo que hay que modificar podría afectar a otras partes de la web, debido a que implica a los anchos de las distintas partes de la web en función de las columnas que se están mostrando. Por lo que te recomendamos siempre colocar código en un css personalizado. Si no sabes cómo crear uno (es posible que el propio tema incluya uno):

https://www.webempresa.com/blog/agregar-archivo-css-personalizado-para-plantillas-gantry.html

Saludos


 
Respondido : 09/03/2015 1:06 pm
Respuestas: 245
Estimable Member
Topic starter
 

Hola Rafael,

también me refiero a, como verás en la imagen adjunta, el fondo blanco donde aparecen las entradas, que pueda estar en transparente para dejar ver el fondo.

Muchas gracias,

Emigdio


 
Respondido : 09/03/2015 2:48 pm
Pablo Velasco
Respuestas: 20382
Illustrious Member
 

Hola,

No te recomiendo dejar el fondo de la parte de contenidos transparente, ya que dificultará la lectura de tu web.

Dicho esto, si quieres hacer esto transparente edita el archivo wp-content/themes/yoo_pace_wp/css/layout.css y, previa copia de seguridad del mismo, añade el siguiente código al final:

#block-main {
background: none !important;
}

#block-main > div {
background: none !important;
}

 
Respondido : 09/03/2015 3:29 pm
Respuestas: 245
Estimable Member
Topic starter
 

Hola de nuevo,

estoy "trasteando" con las intrucciones que me habéis dado y realizando pruebas con la misma plantilla pero otra web. En principio he cambiado algunas cosas según las indicaciones. Pero, por favor, tengo una pregunta, ya que el fondo será gris, ¿cómo hacer que los textos (títulos de las entradas y las mismas entradas aparezcan en color negro puro?

Muchas gracias de nuevo,

Saludos,

Emig


 
Respondido : 09/03/2015 10:10 pm
Jhon
 Jhon
Respuestas: 44989
Illustrious Member Moderator
 

HOla

Ubica el archivo : /wp-content/themes/yoo_pace_wp/css/custom.css

Al final agrega :

#system .title a{
	color : black;
}

Saludos.


 
Respondido : 09/03/2015 11:41 pm
Respuestas: 245
Estimable Member
Topic starter
 

Buenos días,

tu indicación tiene efecto pero no el requerido, es decir, podrás observar que las entradas no aparecen en negro sino en un gris... Muchas gracias.

Saludos,

Emig


 
Respondido : 10/03/2015 9:04 am
Julen
Respuestas: 2894
Famed Member Admin
 

Hola Emigdio Benavent Payá

En caso de que quieras poner los títulos de las entradas de color negro. Tendrás que editar el siguiente archivo: wp-content/themes/yoo_pace_wp/warp/css/system.css

Y añadir las siguientes lineas :

#system .title {
    color: black;
    margin-top: 0;
}

En caso de que quieras poner el texto de las entradas de color negro. Tendrás que editar el siguiente archivo: /wp-content/themes/yoo_pace_wp/css/layout.css

Y añadir las siguientes lineas :

.module, #breadcrumbs, #content {
    margin: 15px;
    color: black;
}

Saludos


 
Respondido : 10/03/2015 9:41 am
Respuestas: 245
Estimable Member
Topic starter
 

Muchas gracias de nuevo!

Por favor, podrás observar que en las entradas, aparece el día de la publicación, pero tanto ahí como en leer más y los comentarios, hay elementos de color naranja que deben ser negros. Agradezco me informes para realizar este cambio.

Saludos,

Emig


 
Respondido : 10/03/2015 9:55 am
Julen
Respuestas: 2894
Famed Member Admin
 

Hola,

Ubica el archivo : wp-content/themes/yoo_pace_wp/styles/orange_red/css/style.css

Para editar los elementos de color naranja que nos indicas, tendrás que cargar una imagen del mismo tamaño y de la misma extensión de la actual, a la siguiente ruta /images/tools

Una vez subida la imagen tendrás que modificar la siguiente linea :

#system .item > .links a {
    background-image: url("../images/tools/system_item_links.png");
}

Deberás cambiar system_item_links.png por el nombre de la imagen que has subido previamente

Saludos


 
Respondido : 10/03/2015 10:19 am