Un usuario preguntó 👇
¡Hola!
Utilizo el Formulario de contacto 7 para mis formularios en mi página web. Después de actualizar OceanWp, la marca de la casilla de verificación no se muestra correctamente. Agregué el siguiente código a la sección Personalizar> Personalizar CSS y sigue mostrándose extraño
div.wpcf7 input[type="checkbox"] {
-webkit-appearance: checkbox;
}
hay un símbolo extraño detrás de la marca. Te dejo la pagina para que la veas
¡Gracias!
(@mgustavs)
Hace 1 año, 3 meses
Confirmo el mismo problema después de actualizar a 1.7.3 y 1.5.19 en dos sitios usando el formulario Elementor Pro en uno y el formulario WP en el otro.
Safari recuperó el tic después de agregar:
aporte[type=”checkbox”] {-webkit-apariencia: casilla de verificación; -moz-apariencia: casilla de verificación; }
Sin embargo, Chrome todavía muestra un cuadrado y Mozilla tiene un ‘fooc’ …
Gracias, @ momo-fr y @harrisdesigned – ¡ambos hockey lo arreglaron!
(@ tomas-eklund)
Hace 1 año, 3 meses
Creo que la causa principal de este problema es que Font Awesome 5 usa pesos de fuente para distinguir entre sólido, regular y ligero y que la marca de verificación de las casillas de verificación ( f00c) solo está disponible como sólido (negrita) en la versión gratuita. Los cehckmarks regulares y claros solo están disponibles en Font Awesome 5 Pro. Dado que el valor predeterminado es regular y no se especifica el peso de la fuente para las marcas de verificación, no se mostrará ningún icono.
https://fontawesome.com/icons/check?style=solid
El problema debe resolverse agregando el código CSS a continuación:
input[type=radio]:checked:before, input[type=checkbox]:checked:before {
font-weight: bold;
}
(@ tomas-eklund)
Hace 1 año, 3 meses
Ahora veo que @ momo-fr ya ha publicado el mismo puesto de trabajo. Según mi experiencia, cualquier fuente de 600 o superior funcionará.
@Harrisdesigned funciona porque el ícono de círculo de verificación de peso de fuente normal (f058) está disponible en Font Awesome Free.
https://fontawesome.com/icons/check-circle?style=regular
(@badarjamal)
Hace 1 año, 2 meses
Gracias @ momo-fr. Pasé horas buscando una solución y tu solución funcionó a las mil maravillas.
(@phillbarnett)
Hace 1 año, 2 meses
Hola,
Probé todas las áreas de trabajo sugeridas por @ momo-fr, @ tomas-eklund, @ michael-luther y @harrisdesigned con solo un éxito parcial.
La única solución que funciona para mí es la font-weight
a 600+, que soluciona el problema de FireFox en el escritorio, pero no Chrome cuando se usa el modo de incógnito o un navegador en un teléfono móvil. ¿Algunas ideas?
Información del sitio:
https://dannabarnett.com/ (casilla de verificación del formulario de contacto en la parte inferior de la página de inicio) OceanWP 1.7.3 OceanExtra 1.5.19 Formulario de contacto 7 5.1.16
Nota al margen: si @ tomas-eklund tiene razón en que el problema está relacionado con las funciones Pro de FontAwesome, ¿quizás es por eso que @apprimit no ve el problema al final?
Esta respuesta fue modificada hace 1 año, 2 meses. Esta respuesta fue modificada hace 1 año, 2 meses por. Causa: se corrigieron los navegadores que parecen mostrar el problema
(@newoceans)
hace 1 año
¿Alguien bajo las últimas noticias aquí?
(@apprimit)
hace 1 año
@newoceans ¿puedes compartir el enlace de tu sitio para que pueda verlo? ¿Estás usando FontAwesome Pro?
(@newoceans)
hace 1 año
¡Hola @apprimit gracias por la respuesta, amigo!
Aquí está el sitio (desarrollo), está en la página de inicio en el formulario de suscripción por correo electrónico: – https://cicerofoundation.marcbijl.nl
Así es como se ve por mi parte: https://snipboard.io/xY6lqu.jpg
Me las arreglé para solucionarlo, usando este código:
/*https://wordpress.org/support/topic/after-updating-oceanwp-the-checkboxs-tick-doesnt-display/#post-12134277*/
input[type=checkbox]:checked:before {
content: '✓' !important;
}
(@newoceans)
hace 1 año
No estoy seguro de cómo verificar si estoy usando Fontawesome Pro … Comencé este sitio copiando un sitio que hice hace mucho tiempo, y solo cambié el estilo y CSS …
¿Dónde puedo saber si estoy usando Fontawesome Pro?
(@apprimit)
hace 1 año
@newoceans este problema ya está solucionado. Siga el enlace para solucionarlo: https://docs.oceanwp.org/article/637-icons-missing-after-font-awesome-5-upgrade
Revisé su sitio y no está usando Fontawesome Pro.
(@newoceans)
hace 1 año
Genial @apprimit
¡Sigue los pasos y todo está bien ahora! 😉
¿Solucionó tu problema??
0 / 0