Pregunta sobre Contact Form 7 de Wordpress:

驴Estilo de las casillas de verificaci贸n para que parezcan botones?

Un usuario pregunt贸 馃憞

隆Hola! 驴Hay alguna forma de dise帽ar las casillas de verificaci贸n de CF7 para que parezcan botones? Logr茅 limitar mis casillas de verificaci贸n, pero no puedo cambiar la etiqueta y el borde circundante cuando la casilla de verificaci贸n est谩 seleccionada (oculta o mostrada: ninguna en este momento).

El c贸digo actualmente se ve as铆:

span.wpcf7-list-item {
    display: inline-block;
    margin: 0 0 15px 0;
}

.wpcf7-list-item {
    margin: 0 0 20px 1em;
    border: 1px solid #f26922;
    border-radius: 40px;
    text-transform: uppercase;
    font-size: 16px;
    padding: 10px;
    width: 100%;
}

Pens茅 que el siguiente c贸digo har铆a lo que estaba buscando, pero no hizo nada:

input[type=checkbox]:checked + label {
    background-color: #f26922;
    color: #333333;
    border-color: #333333;
}

隆隆Agradecer铆amos cualquier ayuda con esto !!

(@khrycak)

Hace 2 a帽os, 2 meses

Si desea que las casillas de verificaci贸n se vean como botones, es m谩s probable que las utilice de manera incorrecta. Las casillas de verificaci贸n, los botones de opci贸n y los botones del sitio web tienen funciones independientes y deben seguir est谩ndares visuales.

Las casillas de verificaci贸n se utilizan cuando tiene una lista de opciones y el usuario puede seleccionar varias opciones. Los botones de opci贸n se utilizan cuando hay una lista de dos o m谩s opciones y el usuario debe seleccionar una opci贸n directamente. Los botones indican visualmente la capacidad de hacer clic en una opci贸n y vincularla a otro lugar.

En lugar de cambiar la casilla de verificaci贸n de CSS, le recomiendo volver a consultar si debe usar una casilla de verificaci贸n, un bot贸n de opci贸n o un texto con un hiperv铆nculo (en lugar de un bot贸n) en su formulario espec铆fico. Luego, dise帽e su calidad visual normal para que coincida con su sitio.

Para m谩s informaci贸n:
Formulario de contacto 7 – Casillas de verificaci贸n, botones de opci贸n /
Formulario de contacto 7 – Bot贸n Enviar /
C贸mo dise帽ar mejores botones

Esta respuesta fue modificada hace 2 a帽os, 2 meses por. Causa: errores gramaticales

(@ arodriguez92)

Hace 2 a帽os, 2 meses

Gracias por la respuesta. Conozco la diferencia entre casillas de verificaci贸n, botones de opci贸n y botones normales. Todav铆a quiero dise帽ar las casillas de verificaci贸n para 芦mirar禄 botones sin dejar de llevar una casilla de verificaci贸n.

(@aroundkw)

Hace 2 a帽os

Quiero saber lo mismo, usar botones grandes y agradables para opciones como autom贸vil, SUV o cami贸n, etc.

Quiero grabar y enviar los datos / opci贸n en el correo electr贸nico, el bot贸n no acepta los datos.

(@floortjahh)

Hace 1 a帽o, 9 meses

Tengo la misma pregunta, pero para botones de opci贸n. 驴Encontraste una soluci贸n?

(@ arodriguez92)

Hace 1 a帽o, 9 meses

Desafortunadamente, nunca obtuve una respuesta ni entend铆 c贸mo hacer esto. Eventualmente tuve que dise帽ar mis casillas de verificaci贸n sin dejar de mirarlas como casillas de verificaci贸n. Muy desafortunado, nadie pudo ofrecer ayuda aqu铆 馃檨 Si estas fueran casillas de verificaci贸n codificadas manualmente, ser铆a posible, 隆pero debido a que su CF7 lo hace mucho m谩s dif铆cil! Si hay una manera de hacerlo, no lo s茅, 隆ay!

(@floortjahh)

Hace 1 a帽o, 9 meses

隆Te tengo! Gracias por la actualizaci贸n 馃檪

驴Solucion贸 tu problema??

0 / 0

Deja una respuesta 0

Tu direcci贸n de correo electr贸nico no ser谩 publicada. Los campos obligatorios est谩n marcados con *