Una guía para principiantes de Titan Framework agregar texto y tipos de área de texto

Titan Framework ofrece una amplia gama de opciones que puede agregar en un complemento o un tema para proporcionar a los usuarios finales configuraciones dinámicas. Hoy voy a hablar de cubrir dos de las opciones más básicas: una texto tipo de opción y un textarea opción. Veamos cómo crear una opción de tipo de texto en un panel de administración, un metabox o una sección del personalizador de temas.

Opciones de tipo de texto en Titan Framework

En Titan Framework hay varios tipos de opciones, y hoy vamos a revisar el que tiene tipo texto. Así es como se ve:

los textoLa opción de tipo en Titan Framework lleva una amplia gama de parámetros de configuración:

  • nombre: Esto controla el nombre con el que se muestra la opción..
  • carné de identidad: Un nombre único que se utiliza para obtener los valores guardados.
  • desc: Muestra una breve descripción con el nombre de la opción..
  • defecto: Este parámetro especifica el valor por defecto de la opción.
  • vista previa en vivo: (Opcional) Este parámetro solo se usa cuando un texto La opción de tipo se está utilizando dentro de la sección del personalizador de temas. Ayuda a mostrar una vista previa en vivo de los cambios en su tema.
  • css: (Opcional) Cuando se agrega un campo de texto dentro de una página de administración o una sección del personalizador de temas, este parámetro puede ayudar a generar CSS. Cómo?
  • marcador de posición: (Opcional) Esto muestra texto ficticio cada vez que el campo de texto está vacío.
  • is_password: (Opcional) Una etiqueta adicional, ubicada inmediatamente después del campo de formulario. Acepta alfanuméricos y símbolos. Las aplicaciones potenciales incluyen la indicación de una unidad, especialmente si el campo se usa con números. Por ejemplo, si usa el campo como entrada para números de píxeles, ingresará el valor como 'px'. O, si como unidad de porcentaje, ingresaría '%' como valor.

Todos estos parámetros son de tipo cuerda esperar para el is_password parámetro que es booleano. Si no necesita los parámetros opcionales, no es necesario incluirlos.

Contenedores disponibles para la opción de tipo de texto

Los contenedores son básicamente las páginas de administración, las pestañas, las cajas de metadatos y las secciones del personalizador de temas. Estas son esencialmente las áreas donde pones tus opciones. No todos los tipos de opciones se pueden colocar en estos contenedores. Pero el texto La opción de tipo se puede utilizar en cualquier contenedor, es decir:

  • Panel de administrador
  • Pestaña admin
  • Metabox
  • Personalizador de temas

Revisemos cómo crear opciones en Titan Framework:

  • Llame a una instancia única a través de obtener Instancia() función.
  • Crear opciones a través de createOption () funcionar dentro de un contenedor.
  • Obtener los valores de la opción guardada a través de la getOption () función.

Entonces, revisemos cómo un texto La opción de tipo se crea dentro de cada uno de estos contenedores..

Creación de una opción de tipo de texto dentro de un panel de administración

Ejemplo de Declaración

El siguiente código se utiliza mientras está agregando un textoOpción dentro de un panel de administración:

createOption (array ('id' => 'aa_txt', // El ID que se usará para obtener el valor de esta opción 'type' => 'text', // Tipo de opción que estamos creando 'name' => 'Mi opción de texto', // 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));

Este código agregará un textoopción de tipo dentro de un panel de administración $ aa_panel. los createOption () función ocupa una serie de parámetros que son compatibles con el texto opción. 

En este caso, he usado parámetros como ID, tipo, nombredesc. De todos estos, ID es el parámetro más importante y siempre debe ser único. Se utilizará más adelante para obtener los valores guardados.. 

Entonces, un texto opción con ID aa_txt y nombre 'Mi opción de texto'fue creado dentro del panel de administración $ aa_panel

La captura de pantalla de arriba muestra Mi opción de texto dentro del panel de administración Opciones aseadas

Este es un panel de administración personalizado y se ha creado con Titan Framework. Si desea saber cómo, consulte los artículos anteriores de esta serie..  

Ejemplo de uso

Use el siguiente código para recuperar los valores guardados de este texto opción.

getOption ('aa_txt'); / ** * * Imprime el valor de la opción * * / echo $ aa_txt_val; // Imprimir el valor guardado en una opción aa_txt 

Utilicé el ID de la texto Opción como parámetro dentro de la getOption () Funciona y guarda el valor en una variable. $ aa_txt_val. Voila! Todo lo que queda por hacer es usar este valor, lo que hice usando el eco mando.

Viendo el resultado en el front-end

Supongamos que ingresé el valor de demostración 'Configuración de texto AA ' y lo guardó. Así que aquí está la captura de pantalla de la salida del código anterior.

Creación de una opción de tipo de texto dentro de una pestaña de administrador

Ejemplo de Declaración

Veamos el código de una texto opción dentro de una pestaña de administrador.

createOption (array ('id' => 'aa_txt_in_tab1_panel2', // Las ID siempre deben ser únicas. La ID que se usará para obtener el valor de esta opción 'type' => 'text', // Tipo de opción que somos creando 'nombre' => 'Mi opción de texto', // 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 administrador panel));

Esta vez he creado un texto opción de tipo con ID aa_txt_in_tab1_panel2 dentro $ aa_tab1. $ aa_tab1 es una pestaña de administración que existe dentro de un panel de administración personalizado $ aa_panel2. El proceso de creación de una pestaña de administración se ha explicado en mis artículos anteriores. Por lo tanto, puede referirse a ellos para obtener ayuda.

Tenga en cuenta que he usado el mismo nombre, lo que significa que los nombres pueden ser los mismos, pero las identificaciones son siempre únicas.

La captura de pantalla de arriba muestra el Mi opción de texto dentro Pestaña 1 de panel Opciones aseadas 2.

Ejemplo de uso

Vamos a recuperar los valores guardados de este texto opción.

getOption ('aa_txt_in_tab1_panel2'); / ** * * Imprimir el valor de la opción * * /?> 
El valor del cuadro de texto de la primera pestaña es:

los getOption () función recupera el valor guardado a través de ID aa_txt_in_tab1_panel2 Y luego lo imprimí a través del eco mando.

Viendo el resultado en el front-end

El valor que ingresé fue 'Configuración de texto AA ' y su salida en la parte delantera se ve así:

Crear una opción de tipo de texto dentro de un Metabox

Ejemplo de Declaración

Usted puede agregar un textoEscriba la opción dentro de un metabox a través del siguiente código:

createOption (array ('id' => 'aa_mb_txt', // El ID que se usará para obtener el valor de esta opción 'type' => 'text', // Tipo de opción que estamos creando 'name' => 'Mi opción de texto', // 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)); 

De nuevo el createOption () función agrega un texto opción dentro de un metabox llamado $ aa_metbox. Aquí se utilizan los mismos parámetros y el ID es aa_mb_txt.

La captura de pantalla anterior muestra una pantalla de edición de página donde puede encontrar un nuevo metabox con 'Mi opción de texto dentro de eso. Creamos metaboxes en un artículo anterior de esta serie, así que refiérase a eso si necesita revisar sus conceptos.

Ejemplo de uso

Entonces, aquí está el código para obtener los valores guardados..

getOption ('aa_mb_txt', get_the_ID ()); / ** * * Imprimir el valor de la opción * * /?> 
El valor de la opción metabox txt para esta página es:

Todo es más o menos igual, excepto en la línea 15 donde getOption () La función tiene dos parámetros:

  • aa_mb_txt, que es el ID de opción de tipo de texto que creamos
  • get_the_ID () función, que devolverá el ID de la publicación / página / tipo de entrada actual.

Después de eso, acabo de usar el eco mandó e imprimió el valor.

Viendo el resultado en el front-end

Yo guarde 'Configuración de texto AA ' como el valor de esta opción y publicado la página. El código anterior se usó para mostrar ese valor en la parte delantera.

Creación de una opción de tipo de texto dentro del personalizador de temas

Ejemplo de Declaración

Finalmente, vamos a escribir el código para crear una textoopción de tipo dentro de una sección de personalizador de tema.

createOption (array ('id' => 'aa_sec_head_txt', // El ID que se usará para obtener el valor de esta opción 'type' => 'text', // Tipo de opción que estamos creando 'name' => 'Site Header Text', // Nombre de la opción que se mostrará en el panel de administración 'desc' => 'Este es el encabezado del sitio' // Valor predeterminado de nuestra opción));

UNA textoopción de tipo con ID aa_sec_head_txt Se crea dentro de una sección de personalizador de tema. $ aa_section1. Consulte mis artículos anteriores si desea aprender cómo agregar secciones de personalizador en Titan Framework.

La captura de pantalla de arriba muestra una sección del personalizador de tema llamada Mi seccion en el que un Texto del encabezado del sitio la opción está siendo mostrada.

Ejemplo de uso

Aquí está el código para obtener los valores guardados..

getOption ('aa_sec_head_txt'); / ** * * Imprimir el valor de la opción * * /?> 

aa_sec_head_txt es un textotipo de opción, y recuperé su valor de nuevo con el getOption () función. No hay ciencia espacial aquí.

Viendo el resultado en el front-end

Entré 'Mi texto Opción Encabezamiento' y puedes ver el resultado de la vista previa en vivo a continuación:

A continuación, vamos a cubrir el textarea Opción de tipo en Titan Framework. Revisemos cómo puede aprovechar Titan Framework para crear un textarea escriba la opción en los paneles de administración, meta cajas y la sección de personalizador con solo unas pocas líneas de código.

La opción de tipo Textarea en Titan Framework

Debes haber visto el textarea Escriba la opción en varios plugins y temas de WordPress. Con Titan Framework, puede agregar este tipo de opción con el createOption () función. Algunos parámetros de esta opción son:

  • nombre: Este parámetro decide el nombre de visualización del textarea.
  • carné de identidad: Este es un nombre único que se utiliza para recuperar los valores de las opciones guardadas.
  • desc: Muestra una descripción de una línea con el nombre de la opción.
  • defecto: (Opcional) Representa la configuración por defecto de la textareaopción.
  • vista previa en vivo: (Opcional) Este parámetro funciona exclusivamente con la sección del personalizador de temas y muestra una vista previa en vivo de los cambios que realiza..
  • css: (Opcional) Genera CSS cada vez que un textareaLa opción se crea dentro de una página de administración y / o una sección del personalizador de temas..
  • marcador de posición: (Opcional) Si desea que aparezca un texto ficticio dentro de su textareaOpción luego usar este parámetro.
  • is_code: (Opcional) Este parámetro realiza una comprobación para ver si la entrada del código se ve mejor y si es verdadera, entonces la fuente del código se convierte en monoespaciada.

Todos los parámetros son del tipo. cuerda, excepto por el is_code cual es booleano

Contenedores disponibles para la Opción Tipo Textarea

Esta opción tiene tipo textarea y se puede agregar en lugares como:

  • Página de administrador
  • Pestaña admin
  • Metabox
  • Personalizador de temas

Pero antes de explicar cómo agregar esta opción dentro de todos estos contenedores, permítame resumir los pasos básicos que se deben seguir:

  • Llama a obtener Instancia() Funciona al comienzo de cada nuevo archivo cuando se usa Titan Framework.
  • Utilizar el createOption () Función para agregar cualquier nueva opción..
  • Obtenga los valores de opción guardados llamando al getOption () función.

Manteniendo las cosas al punto, solo explicaré cómo agregar esta opción dentro de estos contenedores. Si desea saber cómo crear estos contenedores, lea los artículos anteriores de esta serie..

Creación de una opción de tipo Textarea dentro de un panel de administración

Ejemplo de Declaración

Voy a crear un textareaOpción dentro de un panel de administración con el siguiente código.

createOption (array ('id' => 'aa_txtarea', // El ID que se usará para obtener el valor de esta opción 'type' => 'textarea', // Tipo de opción que estamos creando 'name' => 'My Textarea Option', // Nombre de la opción que aparecerá 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));

UNA textarease crea dentro de un panel de administración $ aa_panel mediante el createOption ()función. Esta función ocupa una serie de parámetros y solo usaré aquellos que admita la opción. he usado carné de identidadtiponombre desc. El parámetro tipo es lo que determina qué tipo de opción es.

UNA textareaopción con ID aa_txtarea y nombre Mi opción de Textarea se muestra en la captura de pantalla anterior, que acabamos de crear.

Ejemplo de uso

Ahora recuperaré el valor guardado de lo que ingrese un usuario final dentro de este área de texto.

getOption ('aa_txtarea'); / ** * * Imprime el valor de la opción * * / echo $ aa_txtarea_val; // Imprimir el valor guardado en una opción aa_txt

Para recuperar los valores guardados, primero obtenga una instancia única a través de obtener Instancia() función, seguido de la getOption () Función, dentro de la cual utilizamos el ID de textareacomo parámetro. 

Más tarde, imprima el valor guardado en la parte delantera a través del eco mando.

Viendo el resultado en el front-end

Vamos a introducir cualquier texto ficticio dentro de nuestro textarea y guárdalo.

Aquí está la captura de pantalla de la salida en la parte frontal.

Ahora vamos a crear esta opción dentro de una pestaña de administrador.

Creación de una opción de tipo Textarea dentro de una pestaña de administrador

Ejemplo de Declaración

Aquí está el código:

createOption (array ('id' => 'aa_txtarea_in_tab1_panel2', // Las ID siempre deben ser únicas. La ID que se usará para obtener el valor de esta opción 'type' => 'textarea', // Tipo de opción que somos creando 'name' => 'My Textarea Option', // 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 administrador panel)); 

Creé un textarea opción con ID aa_txtarea_in_tab1_panel2 dentro de una pestaña de administrador $ aa_panel2. Aparece en contra del nombre. Mi opción de Textarea.

La captura de pantalla anterior muestra esta opción dentro de mi segundo panel de administración, es decir,. Opciones aseadas 2

Ejemplo de uso

Consigamos los valores guardados..

getOption ('aa_txtarea_in_tab1_panel2'); / ** * * Imprimir el valor de la opción * * / 

El valor del cuadro de texto de la primera pestaña es:


Una vez más obtenga una instancia, luego use el getOption () Función e ingrese ID como su parámetro. A continuación, imprimiré la salida en la parte delantera usando la ecocomando dentro de una etiqueta div.

Viendo el resultado en el front-end

Estoy usando el mismo texto ficticio una vez más como ejemplo.

El resultado final se muestra arriba..

Creación de una opción de tipo Textarea dentro de un Metabox

Ejemplo de Declaración

Ahora, voy a crear un textareaopción dentro de un metabox.

createOption (array ('id' => 'aa_mb_txtarea', // El ID que se usará para obtener el valor de esta opción 'type' => 'textarea', // Tipo de opción que estamos creando 'name' => 'My Textarea Option', // Nombre de la opción que se mostrará 'desc' => 'Esta es nuestra opción' // Descripción de la opción que se mostrará));

los createOption () función agrega un textarea con identificación aa_mb_txtarea dentro de un metabox $ aa_metbox. Esta opción aparece en todas las pantallas de edición de página / publicación..

La captura de pantalla de arriba muestra una textarea llamado Mi opción de Textarea Justo al final de una pantalla de edición de página. Lo mismo también aparece dentro del Añadir nueva publicación sección.

Ejemplo de uso

Ahora voy a escribir el código para recuperar los valores de las opciones guardadas..

getOption ('aa_mb_txtarea', get_the_ID ()); / ** * Imprimir el valor de la opción * / 

El valor de la opción de área de texto de metabox para esta página es:


Repita el proceso nuevamente, es decir, obtenga una instancia primero, y luego use el getOption () función y presentar el ID de la textarea Con el ID de nuestro post_type. El resultado se guarda en una variable llamada $ aa_mb_txtarea_val. Finalmente, hice eco de la salida en una etiqueta div.

Viendo el resultado en el front-end

Subamos la salida final en el front-end..

Vayamos a la parte final donde crearé un textareaOpción dentro de una sección de personalizador de tema.

Creación de una opción de tipo Textarea dentro de una sección del personalizador de temas

Ejemplo de Declaración

Usa el siguiente código.

createOption (array ('id' => 'aa_sec_desc_txtarea', // El ID que se usará para obtener el valor de esta opción 'type' => 'textarea', // Tipo de opción que estamos creando 'name' => 'Site Description Textarea', // Nombre de la opción que se mostrará 'desc' => 'Esta es la descripción del sitio' // Valor predeterminado de nuestra opción));

UNA textareacon identificación aa_sec_desc_txtarea existe dentro de una sección de personalizador de tema $ aa_section1

UNAtextarea La opción de tipo en la figura anterior se muestra con el nombre Descripción del sitio Textarea dentro de Mi seccion sección de personalizador de tema.

Ejemplo de uso

Vamos a obtener los valores de las opciones guardadas..

getOption ('aa_sec_desc_txtarea'); / ** * * Imprimir el valor de la opción * * / 

Este código recupera e imprime el valor más o menos de la misma manera que se explicó anteriormente.

Viendo el resultado en el front-end

Aquí está la vista previa en vivo de mi entrada.

Puede usar esta opción, por ejemplo, para agregar una breve descripción en su página de destino.

Conclusión

Eso es todo. Ahora sabes dónde y cómo textoopción de tipo y la textarea La opción de tipo se puede agregar con Titan Framework. 

He visto a personas que fabrican productos abusar de la opción de tipo de texto en lugares donde un usuario final podría querer agregar más datos que solo unas pocas palabras. Siempre debes usar el textarea escriba la opción en tal caso.

Todo el proceso es bastante simple y fácil. Espero que hayan disfrutado leyendo este artículo. Si tiene alguna pregunta, puede comentar a continuación o comunicarse conmigo en Twitter.