Share
Las opciones de casilla de verificación, radio y tipo de selección permiten a los usuarios elegir entre un conjunto de opciones predefinidas. ¿Qué tal cuando necesita proporcionar a un usuario final la capacidad de hacer más de una elección??
Eso es exactamente lo que el verificación múltiple La opción de tipo lo hace en Titan Framework. Hoy, tengo la intención de mostrar cómo puede agregar una opción de tipo de comprobación múltiple a través de Titan Framework en un panel de administración personalizado, una caja meta o dentro del personalizador de temas..
UNA verificación múltiple La opción de tipo en Titan Framework le permite crear múltiples casillas de verificación que se pueden activar o desactivar al mismo tiempo. Así es como se ve:
Los parámetros de configuración que admite esta opción son:
Accentsconagua
verificación múltiple opción de tipo.Los dos últimos parámetros., defecto y opciones, son formación, mientras que el resto son cuerda por tipo.
Los contenedores en los que puedes agregar esta opción son:
los verificación múltiple La opción de tipo se agrega siguiendo un formato general:
obtener Instancia() función.createOption () función.getOption () función. ¿Quieres saber cómo se crean estos contenedores con Titan Framework? Lee los artículos anteriores de esta serie..
Vamos a crear esta opción dentro de un panel de administración primero.
createOption (array ('id' => 'aa_multicheck_opt', // El ID que se usará para obtener el valor de esta opción 'type' => 'multicheck', // Tipo de opción que estamos creando 'name' => 'Mi opción de comprobación múltiple', // Nombre de la opción que se mostrará en el panel de administración 'desc' => 'Esta es nuestra opción', // Descripción de la opción que se mostrará en el panel de administración 'opciones' = > array (// Matriz asociativa de pares de valores y etiquetas que contienen las opciones 'aa_hdr_logo' => 'Show Header Logo', 'aa_hdr_bg_img' => 'Show Header Background Image', 'aa_hdr_clr_overlay' => 'Allow Header Color Overlay'), 'default' => array ('aa_hdr_logo', 'aa_hdr_bg_img')));Usé el createOption () Funciona en la línea # 8 para agregar una verificación múltiple opción de tipo en un panel de administración personalizado $ aa_panel. Hay una lista de parámetros que he mencionado, es decir,. nombre, id, tipo, opciones, desc y defecto. El ID de mi opción es aa_multicheck_opt; Asegúrate de que cada ID que agregues sea única.
Los 'opciones ' El parámetro en la línea # 14 toma una matriz asociativa. Contiene etiqueta de valor pares Cada par indica una opción separada que aparece como una casilla de verificación. Entonces, he definido tres pares de etiquetas de valor, lo que significa tres opciones.
La etiqueta de cada opción es única. Por lo tanto, las etiquetas aa_hdr_logo, aa_hdr_bg_img y aa_hdr_clr_overlay crear opciones denominadas 'Mostrar logotipo de encabezado','Mostrar encabezado de imagen de fondo'y'Permitir superposición de color de encabezado'respectivamente.
En la captura de pantalla anterior, hay un panel de administración. Opciones aseadas que contiene un verificación múltiple opción nombrada Mi opción multicheck. Tenga en cuenta que las dos primeras opciones están habilitadas debido a la configuración predeterminada (que establecí en la línea # 16).
Vamos a obtener los valores de las opciones guardadas..
getOption ('aa_multicheck_opt'); / ** * * Impresión de valores guardados para un Panel de administración * * / var_dump ($ aa_multicheck_opt_val); En la línea # 3, agregué una instancia única a través de obtener Instancia() función. Se recomienda usar el nombre de tu tema como parámetro aquí. Luego en la línea # 6, usé el getOption () función que recupera los valores guardados al registrar la ID de opción aa_multicheck_opt como parámetro Después de eso, guardé su resultado en una variable. $ aa_multicheck_opt_val. Hasta este punto, la configuración de entrada del usuario se guarda en esta variable.
Ahora imprimiremos los resultados guardados en el front-end. Como esta opción ocupa una matriz asociativa, usaré el método más básico para imprimir el contenido de la matriz, es decir, el var_dump () comando (línea # 15).
Si previsualiza el front-end, se ve así:
Los ajustes por defecto fueron impresos absolutamente correctamente. Tienes la idea de lo que puedes hacer con esta opción.
Agreguemos algunas líneas de código que imprimen una salida si las configuraciones se cambian dinámicamente. Reemplazé la línea # 15 del código anterior con estas líneas.
"; else echo" El logotipo del encabezado de la demostración no estaba habilitado."; if (in_array ('aa_hdr_bg_img', $ aa_multicheck_opt_val)) echo" Mostrar imagen de fondo del encabezado fue habilitado."; else else echo" Mostrar imagen de fondo del encabezado no estaba habilitado."; if (in_array ('aa_hdr_clr_overlay', $ aa_multicheck_opt_val)) echo" Permitir la superposición de color del encabezado fue habilitado."; else else echo" Permitir superposición de color de encabezado no estaba habilitado.";?> Aquí estoy usando el in_array () función dentro si-si no comprobar estados de cuenta. Se están realizando tres verificaciones diferentes aquí para la salida.
aa_hdr_logo existe dentro de la matriz $ aa_multicheck_opt_val, impresión 'Mostrar el logotipo de encabezado fue habilitado.'aa_hdr_bg_img existe dentro de la matriz $ aa_multicheck_opt_val, impresión 'Permitir superposición de color de encabezado fue habilitado.'aa_hdr_clr_overlay existe dentro de la matriz $ aa_multicheck_opt_val, impresión 'Mostrar la imagen de fondo del encabezado fue habilitado.'Vamos con la configuración predeterminada primero, es decir, las dos primeras casillas de verificación están habilitadas.
El front-end debe imprimir las siguientes líneas como esta:
A continuación añadiré esta opción en una pestaña de administrador..
createOption (array ('id' => 'aa_multicheck_opt_in_tab', // El ID que se usará para obtener el valor de esta opción 'type' => 'multicheck', // Tipo de opción que estamos creando 'name' => 'Mi opción de comprobación múltiple', // Nombre de la opción que se mostrará en el panel de administración 'desc' => 'Esta es nuestra opción', // Descripción de la opción que se mostrará en el panel de administración 'opciones' = > array (// Matriz asociativa de pares de valores y etiquetas que contienen las opciones 'aa_hdr_logo' => 'Show Header Logo', 'aa_hdr_bg_img' => 'Show Header Background Image', 'aa_hdr_clr_overlay' => 'Allow Header Color Overlay'), 'default' => array ('aa_hdr_logo', 'aa_hdr_bg_img')));Aquí agregué lo mismo. verificación múltiple opción de tipo dentro de una pestaña de administrador $ aa_tab1. El ID único de la opción es aa_multicheck_opt_in_tab. El resto de ajustes de parámetros son los mismos..
UNA verificación múltiple existe una opción de tipo dentro Pestaña 1 del panel de administración Opciones aseadas 2.
Ahora obtendré los valores guardados desde una pestaña de administrador.
getOption ('aa_multicheck_opt_in_tab'); / ** * * Impresión de valores guardados para una pestaña de administrador * * / if (in_array ('aa_hdr_logo', $ aa_multicheck_opt_in_tab_val)) echo "Mostrar el logotipo del encabezado fue habilitado."; else echo" El logotipo del encabezado de la demostración no estaba habilitado."; if (in_array ('aa_hdr_bg_img', $ aa_multicheck_opt_in_tab_val)) echo" Mostrar imagen de fondo del encabezado fue habilitado."; else else echo" Mostrar imagen de fondo del encabezado no estaba habilitado."; if (in_array ('aa_hdr_clr_overlay', $ aa_multicheck_opt_in_tab_val)) echo" Permitir la superposición de color del encabezado fue habilitado."; else else echo" Permitir superposición de color de encabezado no estaba habilitado."; Este código es bastante similar a lo que escribí en el caso de un panel de administración. Puedes probarlo por tu cuenta. Permítanme resumir los pasos:
obtener Instancia() función.getOption () Función para obtener los valores guardados en la línea # 6..$ aa_multicheck_opt_in_tab_val.in_array () Función (líneas 15 a 30) para imprimir los resultados deseados..Vamos a habilitar todas las casillas de verificación como mi configuración de demostración. El front-end se ve así:
Ahora voy a crear un verificación múltiple opción de tipo en un metabox.
createOption (array ('id' => 'aa_multicheck_opt_in_metabox', // El ID que se usará para obtener el valor de esta opción 'type' => 'multicheck', // Tipo de opción que estamos creando 'name' => 'Mi opción de comprobación múltiple', // Nombre de la opción que se mostrará 'desc' => 'Esta es nuestra opción', // Descripción de la opción que se mostrará 'opciones' => matriz (// matriz asociativa de pares de etiquetas de valor que contienen las opciones 'aa_hdr_logo' => 'Mostrar logotipo de encabezado', 'aa_hdr_bg_img' => 'Mostrar imagen de fondo del encabezado', 'aa_hdr_clr_overlay' => 'Permitir superposición de color de encabezado'), 'predeterminado' => matriz (' aa_hdr_logo ',' aa_hdr_bg_img ')));Agregué esta opción con una identificación única aa_multicheck_opt_in_metabox dentro de un metabox $ aa_metbox.
En la imagen de arriba, hay una pantalla de edición de página y justo al final puede ver un verificación múltiple opción nombrada Mi opción multichecken un metabox.
Usa el siguiente código para recuperar los valores guardados.
getOption ('aa_multicheck_opt_in_metabox', get_the_ID ()); / ** * * Impresión de los valores guardados para un Metabox * * / if (in_array ('aa_hdr_logo', $ aa_multicheck_opt_in_metabox_val)) echo "Mostrar el logotipo del encabezado fue habilitado."; else echo" El logotipo del encabezado de la demostración no estaba habilitado."; if (in_array ('aa_hdr_bg_img', $ aa_multicheck_opt_in_metabox_val)) echo" Mostrar imagen de fondo del encabezado fue habilitado."; else else echo" Mostrar imagen de fondo del encabezado no estaba habilitado."; if (in_array ('aa_hdr_clr_overlay', $ aa_multicheck_opt_in_metabox_val)) echo" Permitir la superposición de color del encabezado fue habilitado."; else else echo" Permitir superposición de color de encabezado no estaba habilitado.";?>El código nuevamente usa las funciones para obtener una instancia y valores guardados. Pero en la línea # 6, hay un parámetro adicional, el get_the_ID () Función, que obtiene valores de cualquier página o ID de publicación. Al final, utilicé la misma. si-si no comprobar estados de cuenta.
Esta vez, vamos a habilitar la primera y la última opción. Aquí está la captura de pantalla del front-end.
Finalmente, voy a agregar esta opción en una sección del personalizador de temas..
createOption (array ('id' => 'aa_multicheck_opt_in_sec', // El ID que se usará para obtener el valor de esta opción 'type' => 'multicheck', // Tipo de opción que estamos creando 'name' => 'Mi opción de comprobación múltiple', // Nombre de la opción que se mostrará 'desc' => 'Esta es nuestra opción', // Descripción de la opción que se mostrará 'opciones' => matriz (// matriz asociativa de pares de etiquetas de valor que contienen las opciones 'aa_hdr_logo' => 'Mostrar logotipo de encabezado', 'aa_hdr_bg_img' => 'Mostrar imagen de fondo del encabezado', 'aa_hdr_clr_overlay' => 'Permitir superposición de color de encabezado'), 'predeterminado' => matriz (' aa_hdr_logo ',' aa_hdr_bg_img ')));He añadido un verificación múltiple opción de tipo dentro de una sección de personalizador de tema $ aa_section1. Su ID es aa_multicheck_opt_in_sec.
En la imagen, hay una sección de personalizador llamada Mi seccion, en el que hay una lista de opciones de casilla de verificación.
Utilice este código para obtener los valores de una sección del personalizador.
getOption ('aa_multicheck_opt_in_sec'); / ** * * Impresión de valores guardados para una sección del personalizador * * / if (in_array ('aa_hdr_logo', $ aa_multicheck_opt_in_sec_val)) echo "Mostrar el logotipo del encabezado fue habilitado."; else echo" El logotipo del encabezado de la demostración no estaba habilitado."; if (in_array ('aa_hdr_bg_img', $ aa_multicheck_opt_in_sec_val)) echo" Mostrar imagen de fondo del encabezado fue habilitado."; else else echo" Mostrar imagen de fondo del encabezado no estaba habilitado."; if (in_array ('aa_hdr_clr_overlay', $ aa_multicheck_opt_in_sec_val)) echo" Permitir la superposición de color del encabezado fue habilitado."; else else echo" Permitir superposición de color de encabezado no estaba habilitado.";?>Este código es de nuevo bastante similar a lo que usé para otros tipos de contenedores. Solo los nombres de ID y variables son diferentes.
Sólo habilité la primera opción. Los cambios se pueden observar en el modo de vista previa en vivo:
Así que eso es todo. Puedes integrar el verificación múltiple Escriba la opción en su proyecto de desarrollo web para permitir a los usuarios habilitar múltiples funciones de tema en unos pocos clics.
Recuerde que le di un ejemplo en el tutorial de la opción de tipo de casilla de verificación, que le permite a un usuario final habilitar / deshabilitar cualquier parte de single.php. Ese mismo ejemplo se puede aplicar aquí, con poco de un contexto. Por lo tanto, si está proporcionando opciones de usuario relacionadas con un área en particular como el encabezado, entonces debería usar la verificación múltiple para evitar opciones adicionales.
Hay algunos otros tipos de opciones que pueden llamarse los derivados de este tipo. Los discutiré en mis próximos artículos. Hasta entonces, prueba este tutorial y hazme saber tus opiniones al respecto en los comentarios o en Twitter..
