Avisos
Vaciar todo

[Resuelto] Distribución texto  

 
ALBERTO
 ALBERTO
Prominent Member

Existe alguna manera de colocar el texto en diferentes columnas tal y cómo se adjunta sin necesidad de crear dos módulos de texto?

Captura de pantalla 2022 01 21 a las 15.44.52

Y palabras dentro de la misma frase en distintos tamaños?

Captura de pantalla 2022 01 21 a las 15.50.04

Contenido solo visible a usuarios registrados

Respondido : 21/01/2022 2:51 pm
Karen Rios
 Karen Rios
Soporte CMS Webempresa Moderator

Hola Alberto, 

En este caso para añadir un texto en dos columnas dentro del mismo módulo de texto de Divi necesitas primero añadir una clase a esto modulo, por ejemplo "Columnas"

Screenshot (83)

Luego dentro del CSS Personalizado puedes usar el siguiente Código CSS

.columna {
-webkit-columns: 2 200px;
-moz-columns: 2 200px;
columns: 2 200px;
}

Como resultado el texto que tienes en este módulo se mostrara en dos columnas

image

Con respecto a los diferentes estilos de un texto 

Respondido por: @marketingiberianpets-com

Y palabras dentro de la misma frase en distintos tamaños?

 

Esto es probable este añadido con diferentes clases que añade un estilo diferente a cada palabra de forma que de acuerdo a cada clase uno puedo asignarle un color, tamaño de fuente diferente a cada palabra

Un Saludo

 

Respondido : 21/01/2022 3:10 pm

Gestor de Contraseñas - VPN Conexión Segura - Gestor 2FA (Segundo Factor de Autenticación

ALBERTO
 ALBERTO
Prominent Member

@karen

Ok...las columnas ya está hecho...

en cuanto a la segunda cuestión...dónde colocar el css?...en el propio módulo de texto como te adjunto? o en el css general...te adjunto el enlace a la página que estoy trabajando: https://humus-spain.com/portada-1/

Captura de pantalla 2022 01 21 a las 18.09.18
Respondido : 21/01/2022 5:10 pm
Karen Rios
 Karen Rios
Soporte CMS Webempresa Moderator

Hola Alberto, 

Si  te refieres al código CSS que te compartí este debes añadir en las opciones del CSS Personalizado que se encuentren en Divi -> Opciones del tema -> General

De esta forma el código se aplica al módulo de texto de acuerdo añadas la clase CSS en los ajustes avanvados

Un Saludo

Respondido : 21/01/2022 5:24 pm

optimiza-automaticamente-todas-las-imagenes-de-tu-wordpress

ALBERTO
 ALBERTO
Prominent Member

Es que no se ve el código...

Captura de pantalla 2022 01 21 a las 18.26.01
Respondido : 21/01/2022 5:26 pm
Karen Rios
 Karen Rios
Soporte CMS Webempresa Moderator

Hola Alberto, 

En esta sección no envíe un código especifico, solo es un espacio que se añadió al citar el comentario. Para esto punto de tomanba que

Respondido por: @karen

Esto es probable este añadido con diferentes clases que añade un estilo diferente a cada palabra de forma que de acuerdo a cada clase uno puedo asignarle un color, tamaño de fuente diferente a cada palabra

En este caso cuál es el texto al que deseas añadirle ese efecto?, de esta forma podemos verificar con detalle

Saludos

Respondido : 21/01/2022 5:39 pm

wpdoctor-revisa-la-salud-de-tu-wordpress

ALBERTO
 ALBERTO
Prominent Member

@karen

Pues por ejemplo el texto que te indico en el adjunto....busco saber como hacerlo para aplicarlo varias veces en la página...

 

Captura de pantalla 2022 01 21 a las 19.35.43
Respondido : 21/01/2022 6:36 pm
Karen Rios
 Karen Rios
Soporte CMS Webempresa Moderator

Hola Alberto, 

Entiendo que lo que deseas es añadir estilos específicos a estos textos?, si es así en este caso necesitas añadir clases para qué puedes ajustar estilos a cada uno como deseas, ya que al todos tener una clase global asignada por el tema se modificaría todo el texto, por ejemplo 

<p class="text-agricultura">agricultura</p>

Con esto podrías asignarle estilos específicos a este texto, por ejemplo

p.text-agricultura {
margin-left: 20px;
font-size: 20px;
font-weight: 800;
color: #cf3917;
}

Y se mostraría de la siguiente forma

image

Ten en cuenta que si cada texto tendrá un estilo diferente entonces debes añadir una clase para cada uno de ellos y luego añadir los estilos que deseas tengan

Un Saludo

Respondido : 21/01/2022 7:06 pm

Cursos Gratuitos WordPress

ALBERTO
 ALBERTO
Prominent Member

SI, el concepto está claro...pero creo que lo estoy haciendo mal...

 

Captura de pantalla 2022 01 24 a las 19.53.00
Captura de pantalla 2022 01 24 a las 19.50.32
Respondido : 24/01/2022 6:59 pm
Karen Rios
 Karen Rios
Soporte CMS Webempresa Moderator

Hola Alberto, 

En este caso veo que los códigos se está añadiendo en los sitios incorrectos, te muestro un poco. Lo primero es que el contenido con tus textos y clases debes añadirlos en la sección de contenido del módulo de texto, por ejemplo

Screenshot (89)

Luego los códigos CSS que aplicaran los diferentes estilos a cada texto debes añadirlos en el apartado de Divi -> Opciones del tema -> General -> CSS Personalizado

Screenshot (90)

De esta forma si añado una regla para mi otro texto puedo añadir estilos diferentes

Screenshot (91)

Por lo que de esta forma mis textos irán tomando estos estilos de acuerdo a la clase que le asigne

image

Revisa añadirlos de esta forma y comprueba si con ello se muestran como deseas, ten en cuenta no añadir acentos a las clases que asignes a los textos

Un Saludo 

 

 

Esta publicación ha sido modificada el hace 4 meses por Karen Rios
Respondido : 24/01/2022 7:15 pm

Gestor de Contraseñas - VPN Conexión Segura - Gestor 2FA (Segundo Factor de Autenticación

ALBERTO
 ALBERTO
Prominent Member

@karen

Si...esto me cuadra más...efectivamente así funciona...entonces lo que no tengo claro es para que sirve ID y clases css...puedes enviarme un ejemplo de como utilizar esto?...así podré distinguir entre un uso u otro...

Respondido : 25/01/2022 10:17 am
Pepe
 Pepe
Soporte CMS Webempresa Admin

Hola Alberto.

La diferencia entre una ID y una clase es que una ID se puede usar para identificar un solo elemento, mientras que una clase se puede usar para agrupar más de uno.

Por ejemplo, si tienes una página con un menú de navegación que aparece una única vez, podrías asignarle un id a la capa donde está la barra de navegación. Ese ID sería único, porque no hay otra barra de navegación igual a esa en la página. Ahora bien, si esa misma barra de navegación la quieres repetir varias veces a lo largo de la página tendrías que crear una clase (class de CSS) y asignarla a cada una de esas barras. De ese modo definirías el estilo una única vez y lo reutilizarías un número indefinido de veces.

Para entenderlo, el ID se aplica a un solo elemento y las Clases las puedes aplicar a varios elementos como puede ser un texto, imagen, botones

Tienes un curso de CSS que te ayudaría a entender las diferencias:

 -> https://www.webempresa.com/university/curso-css-wordpress/

 

Un saludo

Respondido : 25/01/2022 11:08 am

optimiza-automaticamente-todas-las-imagenes-de-tu-wordpress

ALBERTO
 ALBERTO
Prominent Member

Ok...lo tengo pero no se si empleo bien el identificador ID: interpreto que doy un ID a ese módulo para identificarlo y posteriormente le doy un style en css options tal y como adjunto....pero no funciona...

 

Captura de pantalla 2022 01 25 a las 16.29.58
Captura de pantalla 2022 01 25 a las 16.26.00
Respondido : 25/01/2022 3:33 pm
ALBERTO
 ALBERTO
Prominent Member

vale si exacto...he cambiado el punto por almohadilla y ahora funciona...

Captura de pantalla 2022 01 25 a las 16.35.17
Respondido : 25/01/2022 3:36 pm

wpdoctor-revisa-la-salud-de-tu-wordpress

Pepe
 Pepe
Soporte CMS Webempresa Admin

Hola Alberto.

Genial, me alegar que los solucionaras.

La almohadilla de utiliza para identificar los ID y los puntos para las Clases.

 

Cualquier consulta que tengas no dudes en comunicarlo.

 

Cerramos el tema.

 

Respondido : 25/01/2022 3:43 pm