Cómo añadir espacio entre título y resumen en diapositivas

Desde
26 Abr 2013
Mensajes
1.238
Por favor, ten en cuenta 📝 que si deseas hacer un trato 🤝 con este usuario, está baneado 🔒.
Hola amigos,


Me pregunto si es posible dejar un espacio o dos entre el titulo y el resumen del contenido del pase de diapositivas, como podéis ver en esta imagen esta casi pegado y estéticamente no me gusta nada, me gustaría que quedara como las entradas, con un poco mas de espacio entre texto y explicación:


Uso el theme Graphene, por si es de ayuda.
El blog es: notasdehumo.com



Si alguien sabe ayudarme, gracias por adelantado!!
 
Última edición:

Federico Piccoli

Gamma
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
Desde
16 Sep 2012
Mensajes
263
Ciao

Ayudarte con precision és dificil porque has deshabilitado el boton derecho del raton, pero la solucion pasa por añadir un salto de linea o dos debajo del titulo.
 

Josetxo

Dseda
Desde
26 Abr 2013
Mensajes
1.238
Por favor, ten en cuenta 📝 que si deseas hacer un trato 🤝 con este usuario, está baneado 🔒.
Ciao

Ayudarte con precision és dificil porque has deshabilitado el boton derecho del raton, pero la solucion pasa por añadir un salto de linea o dos debajo del titulo.

Gracias Federico,

Soy algo novato con WP y realmente no se donde debo modificar para que aparezca bien, he deshabilitado el pluging de proteccion por lo que el botón derecho ya funciona por si puedes ayudarme con esto.

Las entradas tienen espacios, pero en el general aparece así de mal y es lo que no se corregir
 

Bizware

Gamma
Verificación en dos pasos activada
Verificado por Whatsapp
Desde
6 Nov 2009
Mensajes
160
Hola,


Dentro de tu archivo: style.css puedes modificar el estilo para el H2 del slider.


Busca donde dice:


Insertar CODE, HTML o PHP:
.slider_post h2 {
    border-bottom: none;
}

y añade la siguiente línea:


Insertar CODE, HTML o PHP:
margin: 0 0 1em 0;


Esta línea le da una línea de texto de separación. Puedes jugar un poco con el valor para aumentar o disminuir el espacio. (solo cambia el valor de 1em por el que quieras, ejemplo: 0.5em para la mitad de una línea de texto)


Finalmente te debe quedar así:


Insertar CODE, HTML o PHP:
.slider_post h2 {
    border-bottom: none;
    margin: 0 0 1em 0;
}

Otra opción es modificar (siempre dentro del archivo style.css) el estilo para el texto dentro del slider. Busca la donde dice:

Insertar CODE, HTML o PHP:
.slider_post_entry p{
	margin-bottom: 10px;
}

y añade la línea:

Insertar CODE, HTML o PHP:
	margin-top: 2em;
con lo que finalmente te quedaría así:

Insertar CODE, HTML o PHP:
.slider_post_entry p{
	margin-bottom: 10px;
	margin-top: 1em;
}


(puedes simplificar el estilo del margen en una sola linea: margin: 10 0 1em 0; si lo prefieres)


Espero que te sea de utilidad.


Saludos.
 
Última edición:

Josetxo

Dseda
Desde
26 Abr 2013
Mensajes
1.238
Por favor, ten en cuenta 📝 que si deseas hacer un trato 🤝 con este usuario, está baneado 🔒.
Me ha sido de muchísima ayuda amigo, gracias de corazón :love_heart:

Espero no abusar, pero veo ahora que queda bastante hueco entre la foto y el texto que aparece en el pase de diapositivas y la barra inferior de esta, hay alguna forma de eliminar esos 2 o 3 espacios en blanco que quedan? se que se reduciría el tamaño del pase de diapositivas pero creo que podría quedar bastante mejor.

Bueno, muchas gracias :)
 

Googleriano

1
Pi
Verificación en dos pasos activada
¡Ha verificado su Paypal!
Verificado por Binance
Suscripción a IA
Desde
28 Oct 2010
Mensajes
6.175
En tu theme, busca el archivo llamado: SINGLE.php.

Abrelo. Localiza esta linea de código: <?php the_content(''); ?>

Luego, justo antes, coloca lo siguiente: <br>

Debería quedar así:

<br>
<?php the_content(''); ?>


O si quieres mas espacio, colocas dos:

<br><br>
<?php the_content(''); ?>

Con esto, añades el espacio que quieras entre el titulo y el contenido sin tener que poner mas pesado el css...
 

Bizware

Gamma
Verificación en dos pasos activada
Verificado por Whatsapp
Desde
6 Nov 2009
Mensajes
160
Hola,

Para hacer el cambio que quieres, dentro del style.css busca la línea donde dice:
Insertar CODE, HTML o PHP:
.sliderpost_featured_image {
	margin: 20px 1em 1em 20px;
}

y modifica el primer "1em" que está en la fila y ponle el espacio que quieras; por ejemplo: 0.5em para la mitad de espacio, 0.33em para un tercio de espacio.

Acá un ejemplo, para tener la mitad del espacio a la derecha:

.sliderpost_featured_image {
margin: 20px 0.5em 1em 20px;
}


Juega un poco con los valores hasta tener el espacio que quieres.

Saludos.
 

Josetxo

Dseda
Desde
26 Abr 2013
Mensajes
1.238
Por favor, ten en cuenta 📝 que si deseas hacer un trato 🤝 con este usuario, está baneado 🔒.
Hola,

Para hacer el cambio que quieres, dentro del style.css busca la línea donde dice:
Insertar CODE, HTML o PHP:
.sliderpost_featured_image {
	margin: 20px 1em 1em 20px;
}

y modifica el primer "1em" que está en la fila y ponle el espacio que quieras; por ejemplo: 0.5em para la mitad de espacio, 0.33em para un tercio de espacio.

Acá un ejemplo, para tener la mitad del espacio a la derecha:

.sliderpost_featured_image {
margin: 20px 0.5em 1em 20px;
}


Juega un poco con los valores hasta tener el espacio que quieres.

Saludos.

Localicé y modifique el valor en varias ocasiones, pero no veo cambios (o por lo menos no los que yo busco).

Ahora no se si estoy haciendo algo mal o si me he explicado mal, por si acaso hice una nueva captura de pantalla indicando con flechas el espacio que quiero reducir (espero que no te moleste)




Salud
 
Última edición:

Bizware

Gamma
Verificación en dos pasos activada
Verificado por Whatsapp
Desde
6 Nov 2009
Mensajes
160
Hola,

Lo siento... no te había entendido bien (fui mi error), ahora que veo la imagen con las flechitas entendí bien.

Lo que tienes que hacer es modificar en style.css lo siguiente:

Donde dice:

Insertar CODE, HTML o PHP:
.featured_slider [B]Enlace eliminado[/B]  {	background: [B]Enlace eliminado[/B] ;
	margin: 0 auto;
	overflow: hidden;
	position: relative;
	height: 240px;
	width: 100%;
}

modifica el valor de height y ponle el valor que tú quieras para el espacio.

Por ejemplo, con height: 180px; te deja el texto pegado con un pequeño espacio con la linea verde. Aquí puedes ver como queda el código:

Insertar CODE, HTML o PHP:
.featured_slider [B]Enlace eliminado[/B]  {	background: [B]Enlace eliminado[/B] ;
	margin: 0 auto;
	overflow: hidden;
	position: relative;
	height: 180px;
	width: 100%;
}

Repito: juega un poco con los valores de height para conseguir el espacio que quieras. Y ten en cuenta que en lo posible siempre es mejor hacer los cambios en style.css y no tocar otros archivos (siempre en lo posible) porque es más fácil corregir los cambios y no afectar la distribución original del theme.

Saludos.
 

Josetxo

Dseda
Desde
26 Abr 2013
Mensajes
1.238
Por favor, ten en cuenta 📝 que si deseas hacer un trato 🤝 con este usuario, está baneado 🔒.
Bizware, mil gracias por tu ayuda :)

Aquí tienes un amigo (algo novato pero tiempo al tiempo)
 
Arriba