Titan Framework biedt een breed scala aan opties die u kunt toevoegen in een plug-in of een thema om eindgebruikers te voorzien van dynamische instellingen. Vandaag ga ik bespreken twee van de meest elementaire opties: een tekst type optie en a textarea keuze. Laten we eens kijken hoe u een optie voor een teksttype kunt maken in een beheerderspaneel, een metabox of een themaaanpassingsgedeelte.

Teksttype-opties in Titan Framework

In Titan Framework zijn er verschillende soorten opties en vandaag gaan we die met type herzien tekst. Zo ziet het eruit:

De teksttype optie in Titan Framework heeft een groot aantal instellingsparameters:

• naam: Dit bepaalt de naam waarmee de optie wordt weergegeven.
• ID kaart: Een unieke naam die wordt gebruikt om de opgeslagen waarden te verkrijgen.
• desc: Het geeft een korte beschrijving weer met de naam van de optie.
• standaard: Deze parameter geeft de standaardwaarde van de optie aan.
• live voorvertoning: (Optioneel) Deze parameter wordt alleen gebruikt als a tekst type optie wordt gebruikt in het gedeelte voor het aanpassen van het thema. Het helpt om een ​​live preview van veranderingen in uw thema weer te geven.
• css: (Optioneel) Wanneer een tekstveld wordt toegevoegd in een beheerderspagina of een themaaanpassingsgedeelte, kan deze parameter helpen bij het genereren van CSS. Hoe?
• placeholder: (Optioneel) Hiermee wordt dummy tekst weergegeven telkens wanneer het tekstveld leeg is.
• is_password: (Optioneel) Een extra label, direct achter het formulierveld. Accepteert alfanumerieke tekens en symbolen. Potentiële toepassingen omvatten de indicatie van een eenheid, vooral als het veld wordt gebruikt met getallen. Als u het veld bijvoorbeeld gebruikt als invoer voor aantallen pixels, geeft u de waarde op als 'px'. Of, als u als een percentage, '%' als waarde invoert.

Al deze parameters zijn van het type draad verwacht voor de is_password parameter die is boolean. Als u de optionele parameters niet nodig hebt, hoeft u ze niet op te nemen.

Beschikbare containers voor de optie Teksttype

Containers zijn in feite uw admin-pagina's, tabbladen, metaboxen en thema-aanpassersecties. Dit zijn in wezen de gebieden waar u uw opties plaatst. Niet alle optietypen kunnen in deze containers worden geplaatst. Maar de tekst type optie kan in elke container worden gebruikt, d.w.z.

• Administratie Paneel
• Admin Tab
• Metabox
• Thema-aanpasser

Laten we eens kijken hoe we opties in Titan Framework kunnen maken:

• Roep een uniek exemplaar via de getInstance () functie.
• Maak opties via de createOption () functie in een container.
• Krijg de waarden van de opgeslagen optie via de GetOption () functie.

Laten we dus eens kijken hoe een tekst typeoptie wordt in elk van deze containers gemaakt.

Een teksttype-optie maken in een beheerdersdashboard

Voorbeeldverklaring

De volgende code wordt gebruikt terwijl u een toevoegt tekstoptie in een admin panel:

createOption (array ('id' => 'aa_txt', // De ID die wordt gebruikt om de waarde van deze optie te krijgen 'type' => 'tekst', // Type optie we maken 'naam' => 'Mijn tekstoptie', // Naam van de optie die wordt weergegeven in het admin-paneel 'desc' => 'Dit is onze optie' // Beschrijving van de optie die wordt weergegeven in het admin-paneel));

Deze code voegt een toe teksttyp optie in een beheerdersdashboard $ aa_panel. De createOption () functie neemt een array van parameters in die worden ondersteund door de tekst keuze. 

In dit geval heb ik parameters gebruikt zoals id, type, naam en desc. Van al deze is ID de meest belangrijke parameter en zou altijd uniek moeten zijn. Het wordt later gebruikt om de opgeslagen waarden te krijgen. 

Dus, a tekst optie met ID aa_txt en naam 'Mijn tekstoptie'is gemaakt in het beheerdersdashboard $ aa_panel. 

Het screenshot hierboven wordt getoond Mijn tekstoptie in het admin-paneel Nette opties. 

Dit is een aangepast beheerderspaneel en is gemaakt met Titan Framework. Als je wilt weten hoe, kijk dan naar de vorige artikelen van deze serie.  

Voorbeeldgebruik

Gebruik de volgende code om de opgeslagen waarden hieruit op te halen tekst keuze.

getOption ('aa_txt'); / ** * * Druk de optiewaarde * * / echo $ aa_txt_val af; // Druk de waarde af die is opgeslagen in de aa_txt-optie 

Ik gebruikte de ID van de tekst optie als een parameter in de GetOption () functie en heeft de waarde in een variabele opgeslagen $ aa_txt_val. Voila! Het enige wat u hoeft te doen, is deze waarde gebruiken, die ik heb gedaan met behulp van de echo commando.

Resultaat weergeven aan de voorkant

Laten we aannemen dat ik de demowaarde heb ingevoerd 'AA-tekstinstellingen ' en bewaarde het. Dus hier is de schermafbeelding van de uitvoer van de bovenstaande code.

Een teksttype-optie creëren op een beheerders-tabblad

Voorbeeldverklaring

Laten we naar de code van a kijken tekst optie in een admin-tabblad.

createOption (array ('id' => 'aa_txt_in_tab1_panel2', // ID's moeten altijd uniek zijn.De ID die wordt gebruikt om de waarde van deze optie te krijgen 'type' => 'tekst', // Type optie we zijn create 'name' => 'My Text Option', // Naam van de optie die getoond wordt in het admin paneel 'desc' => 'Dit is onze optie' // Beschrijving van de optie die getoond wordt in de admin paneel));

Deze keer heb ik een gemaakt tekst type optie met ID aa_txt_in_tab1_panel2 binnen $ aa_tab1. $ aa_tab1 is een admin-tabblad dat bestaat in een aangepast admin-paneel $ aa_panel2. Het proces voor het maken van een admin-tabblad is in mijn vorige artikelen uitgelegd. Dus, u kunt hen om hulp vragen.

Merk op dat ik dezelfde naam heb gebruikt, wat betekent dat namen kunnen hetzelfde zijn, maar ID's zijn altijd uniek.

De screenshot hierboven toont de Mijn tekstoptie binnen Tab 1 van paneel Nette opties 2.

Voorbeeldgebruik

Laten we de opgeslagen waarden hieruit ophalen tekst keuze.

getOption ('aa_txt_in_tab1_panel2'); / ** * * Druk de optiewaarde * * /?> Af 
 De waarde van het eerste tabblad is:  

De GetOption () functie haalt de opgeslagen waarde op via ID aa_txt_in_tab1_panel2 en vervolgens heb ik het via de echo commando.

Resultaat weergeven aan de voorkant

De waarde die ik invoerde was 'AA-tekstinstellingen ' en de uitvoer aan de voorkant ziet er als volgt uit:

Een teksttype-optie creëren in een metabox

Voorbeeldverklaring

U kunt een toevoegen teksttyp optie in een metabox via de volgende code:

createOption (array ('id' => 'aa_mb_txt', // De ID die wordt gebruikt om de waarde van deze optie te krijgen 'type' => 'tekst', // Type optie we maken 'naam' => 'Mijn tekstoptie', // Naam van de optie die wordt weergegeven in het admin-paneel 'desc' => 'Dit is onze optie' // Beschrijving van de optie die wordt weergegeven in het admin-paneel)); 

Nogmaals de createOption () functie voegt een toe tekst optie in een metabox genoemd $ aa_metbox. Dezelfde parameters worden hier gebruikt en de ID is aa_mb_txt.

Bovenstaande schermafbeelding toont een pagina-bewerkingsscherm waarin u een nieuwe metabox kunt vinden met 'Mijn tekstoptie ' in het. We hebben metaboxen gemaakt in een vorig artikel van deze serie, dus verwijs naar dat als je je concepten moet herzien.

Voorbeeldgebruik

Dus, hier is de code om de opgeslagen waarden te krijgen.

getOption ('aa_mb_txt', get_the_ID ()); / ** * * Druk de optiewaarde * * /?> Af 
 De waarde van metaboxoptie txt voor deze pagina is:  
 

Alles is vrijwel hetzelfde behalve op regel # 15 waar de GetOption () functie heeft twee parameters:

• aa_mb_txt, welke is de ID van de teksttype optie die we hebben gemaakt
  
• get_the_ID () functie, die de ID van het huidige bericht / pagina / bericht_type retourneert.

Daarna gebruikte ik de echo opdracht en de waarde afgedrukt.

Resultaat weergeven aan de voorkant

Ik heb gered 'AA-tekstinstellingen ' als de waarde van deze optie en publiceerde de pagina. De bovenstaande code werd gebruikt om die waarde aan de voorkant weer te geven.

Een teksttype-optie creëren in de thema-aanpasser

Voorbeeldverklaring

Eindelijk, laten we de code schrijven voor het maken van een teksttyp optie in een gedeelte voor het aanpassen van een thema.

createOption (array ('id' => 'aa_sec_head_txt', // De ID die wordt gebruikt om de waarde van deze optie te krijgen 'type' => 'tekst', // Type optie we maken 'naam' => 'Site Header Text', // Naam van de optie die wordt weergegeven in het admin-paneel 'desc' => 'Dit is de sitekop' // Standaardwaarde van onze optie));

EEN teksttype optie met ID aa_sec_head_txt is gemaakt in een sectie voor het aanpassen van een thema $ aa_section1. Raadpleeg mijn vorige artikelen als u meer wilt weten over het toevoegen van customizersecties in Titan Framework.

De bovenstaande schermafbeelding toont een thema-aanpassersectie met de naam Mijn sectie waarin een Tekst van de sitekop optie wordt weergegeven.

Voorbeeldgebruik

Hier is de code om de opgeslagen waarden te krijgen.

getOption ('aa_sec_head_txt'); / ** * * Druk de optiewaarde * * /?> Af 
  

aa_sec_head_txt is een teksttype optie, en ik heb de waarde ervan opnieuw opgehaald met de GetOption () functie. Geen rocket science hier.

Resultaat weergeven aan de voorkant

Ik kwam binnen 'Mijn tekst Keuze header' en je kunt het live preview-resultaat hieronder zien:

Laten we vervolgens de textarea type optie in Titan Framework. Laten we eens kijken hoe u Titan Framework kunt gebruiken om een ​​te maken textarea typ optie in beheerderspanelen, metaboxen en het customizer-gedeelte met slechts een paar regels code.

De optie Textarea Type in Titan Framework

Je moet de textarea type optie in verschillende WordPress plug-ins en thema's. Met Titan Framework kunt u dit type optie toevoegen met de createOption () functie. Sommige parameters van deze optie zijn:

• naam: Deze parameter bepaalt de weergavenaam van de textarea.
• ID kaart: Dit is een unieke naam die wordt gebruikt om de opgeslagen optiewaarden op te halen.
• desc: Er wordt een beschrijving van één regel weergegeven met de naam van de optie.
• standaard: (Optioneel) Dit vertegenwoordigt de standaardinstelling van de textareakeuze.
• live voorvertoning: (Optioneel) Deze parameter werkt uitsluitend met het gedeelte voor themaaanpassing en toont een live voorvertoning van wijzigingen die u aanbrengt.
• css: (Optioneel) Het genereert elke keer dat CSS een CSS textareaoptie wordt aangemaakt in een admin-pagina en / of thema-aanpasser.
• placeholder: (Optioneel) Als je wilt dat er wat dummy tekst in je verschijnt textareaoptie en gebruik dan deze parameter.
• is_code: (Optioneel) Deze parameter voert een controle uit voor beter uitziende code-invoer en als deze waar is, wordt het lettertype van de code monospaced.

Alle parameters zijn van het type draad, behalve de is_code welke is boolean. 

Beschikbare containers voor de Textarea Type Option

Deze optie heeft type textarea en kan worden toegevoegd op plaatsen zoals:

• Admin-pagina
• Admin Tab
• Metabox
• Thema-aanpasser

Maar voordat ik uitleg over het toevoegen van deze optie aan al deze containers, kan ik de basisstappen samenvatten die moeten worden gevolgd:

• Bel de getInstance () functie aan het begin van elk nieuw bestand wanneer Titan Framework wordt gebruikt.
• Gebruik de createOption () functie om een ​​nieuwe optie toe te voegen.
• Download de opgeslagen optiewaarden door de GetOption () functie.

Om het op een rijtje te houden, zal ik alleen uitleggen hoe deze optie in deze containers kan worden toegevoegd. Als je wilt weten hoe je deze containers moet maken, lees dan de vorige artikelen van deze serie.

Een Textarea-type-optie maken in een beheerdersdashboard

Voorbeeldverklaring

Ik zal een maken textareaoptie in een admin-venster met de volgende code.

createOption (array ('id' => 'aa_txtarea', // De ID die wordt gebruikt om de waarde van deze optie te krijgen 'type' => 'textarea', // Type optie we maken 'naam' => 'Mijn Textarea-optie', // Naam van de optie die wordt weergegeven in het admin-paneel 'desc' => 'Dit is onze optie' // Beschrijving van de optie die in het admin-paneel wordt weergegeven));

EEN textareais gemaakt in een beheerdersdashboard $ aa_panel via de createOption ()functie. Deze functie neemt een reeks parameters in beslag en ik zal alleen die gebruiken die de optie ondersteunt. Ik heb gebruikt ID kaart, type, naam en desc. De parameter type is wat bepaalt welke soort optie het is.

EEN textareaoptie met ID aa_txtarea en naam Mijn Textarea-optie wordt weergegeven in de bovenstaande schermafbeelding die we zojuist hebben gemaakt.

Voorbeeldgebruik

Nu haal ik de opgeslagen waarde op van wat een eindgebruiker binnen dit tekstgebied invoert.

getOption ('aa_txtarea'); / ** * * Druk de optiewaarde * * / echo $ aa_txtarea_val; // Druk de waarde af die is opgeslagen in de aa_txt-optie

Als u de opgeslagen waarden wilt ophalen, moet u eerst een uniek exemplaar ophalen via de getInstance () functie, gevolgd door de GetOption () functie, waarbinnen we de ID van gebruiken textareaals een parameter. 

Later drukt u de opgeslagen waarde aan de voorkant af via de echo commando.

Resultaat weergeven aan de voorkant

Laten we een dummy tekst invoeren in onze textarea en bewaar het.

Hier is de schermafbeelding van de uitvoer aan de voorkant.

Laten we nu deze optie maken op een admin-tabblad.

Een Textarea-type-optie maken op een beheerders-tabblad

Voorbeeldverklaring

Hier is de code:

createOption (array ('id' => 'aa_txtarea_in_tab1_panel2', // ID's moeten altijd uniek zijn.De ID die wordt gebruikt om de waarde van deze optie te krijgen 'type' => 'textarea', // Type optie we zijn create 'name' => 'My Textarea Option', // Naam van de optie die getoond wordt in het admin paneel 'desc' => 'Dit is onze optie' // Beschrijving van de optie die getoond wordt in de admin paneel)); 

Ik heb een gemaakt textarea optie met ID aa_txtarea_in_tab1_panel2 binnen een admin tab $ aa_panel2. Het lijkt tegen de naam Mijn Textarea-optie.

De bovenstaande schermafbeelding toont deze optie in mijn tweede admin-paneel, d.w.z.. Nette opties 2. 

Voorbeeldgebruik

Laten we de opgeslagen waarden ophalen.

getOption ('aa_txtarea_in_tab1_panel2'); / ** * * Druk de optiewaarde af * * / 
 
 De waarde van het eerste tabblad textarea box is: 
 
  

Krijg opnieuw een instantie en gebruik vervolgens de GetOption () functie en voer ID in als parameter. Vervolgens zal ik de uitvoer aan de voorkant afdrukken met behulp van de echocommando binnen een div-tag.

Resultaat weergeven aan de voorkant

Ik gebruik opnieuw dezelfde dummy-tekst als voorbeeld.

Het eindresultaat wordt hierboven getoond.

Een Textarea-type-optie creëren in een Metabox

Voorbeeldverklaring

Nu ga ik een maken textareaoptie in een metabox.

createOption (array ('id' => 'aa_mb_txtarea', // De ID die wordt gebruikt om de waarde van deze optie te krijgen 'type' => 'textarea', // Type optie we maken 'naam' => 'My Textarea Option', // Naam van de optie die wordt weergegeven 'desc' => 'Dit is onze optie' // Beschrijving van de optie die wordt weergegeven));

De createOption () functie voegt een toe textarea met ID aa_mb_txtarea in een metabox $ aa_metbox. Deze optie verschijnt op alle pagina- / berichtbewerkingsschermen.

De bovenstaande schermafbeelding toont een textarea genaamd Mijn Textarea-optie aan het einde van een bewerkingsscherm voor een pagina. Hetzelfde verschijnt ook in de Voeg nieuwe bericht toe sectie.

Voorbeeldgebruik

Nu ga ik de code schrijven voor het ophalen van de opgeslagen optiewaarden.

getOption ('aa_mb_txtarea', get_the_ID ()); / ** * Druk de optiewaarde * af / 
 
De waarde van textarea voor metaboxopties voor deze pagina is:
 
  

Herhaal het proces opnieuw, dat wil zeggen, eerst een exemplaar ophalen en vervolgens de GetOption () functie en verzend de ID van de textarea met de ID van ons post_type. Het resultaat wordt opgeslagen in een variabele genaamd $ aa_mb_txtarea_val. Ten slotte herhaalde ik de uitvoer in een div-tag.

Resultaat weergeven aan de voorkant

Laten we de laatste uitvoer uploaden aan de voorkant.

Laten we naar het laatste deel gaan waar ik een textareaoptie in een gedeelte voor het aanpassen van een thema.

Een Textarea-type-optie creëren in een gedeelte voor het aanpassen van een thema

Voorbeeldverklaring

Gebruik de volgende code.

createOption (array ('id' => 'aa_sec_desc_txtarea', // De ID die wordt gebruikt om de waarde van deze optie te krijgen 'type' => 'textarea', // Type optie we maken 'naam' => 'Site Description Textarea', // Naam van de optie die wordt weergegeven 'desc' => 'Dit is de sitebeschrijving' // Standaardwaarde van onze optie));

EEN textareamet ID aa_sec_desc_txtarea bestaat in een thema-aanpasser $ aa_section1. 

EENtextarea typ optie in de bovenstaande afbeelding wordt weergegeven tegen de naam Beschrijving van de site Textarea binnen de Mijn sectie thema customizer sectie.

Voorbeeldgebruik

Laten we de opgeslagen optiewaarden ophalen.

getOption ('aa_sec_desc_txtarea'); / ** * * Druk de optiewaarde af * * / 
  
  

Deze code haalt de waarde op en drukt deze op vrijwel dezelfde manier af als hierboven besproken.

Resultaat weergeven aan de voorkant

Hier is de live preview van mijn input.

U kunt deze optie gebruiken om bijvoorbeeld een korte beschrijving op uw bestemmingspagina toe te voegen.

Conclusie

Dat is het zo'n beetje. Nu weet je waar en hoe a teksttype optie en de textarea type optie kan worden toegevoegd met Titan Framework. 

Ik heb gezien dat mensen die producten bouwen, de teksttype-optie misbruiken op plaatsen waar een eindgebruiker misschien meer gegevens wil toevoegen dan alleen een paar woorden. Gebruik altijd de textarea typ optie in een dergelijk geval.

Het hele proces is vrij eenvoudig en gemakkelijk. Ik hoop dat je het leuk vond om dit artikel te lezen. Als u vragen heeft, kunt u hieronder reageren of contact met mij opnemen op Twitter.