Een beginnersgids voor Titan Framework Hoe Titan werkt

Dit is het derde artikel van de serie en tot nu toe heb ik het belang en de functies van Titan Framework samen met de basisconfiguratie besproken. In het allereerste artikel besprak ik de drietraps setup van Titan Framework die als volgt gaat: 

  1. Stel uw project in.
  2. Maak opties.
  3. Krijg waarden.

Ik heb de eerste stap in het vorige artikel uitgelegd, waarin we hebben geleerd dat Titan Framework een plug-en-play-framework is, d.w.z. het komt als een plug-in, hoewel het ook kan worden geïntegreerd door het in te bedden in uw webontwikkelingsproject. Dus, laten we verder gaan waar ik was gebleven en doorgaan met de volgende twee stappen.

Hier zal ik uitleggen hoe en in welke hoedanigheid Titan Framework werkt in uw webontwikkelingsproject. Dan spring ik naar het concept van creëren instanties en opties waarvan ik het gered krijg waarden aan de voorkant. Dus laten we beginnen! 

1. Stel uw project op

Laten we eerst eens kijken wat u nodig hebt om de zelfstudie van vandaag te implementeren. We gaan een eenvoudig WordPress-thema maken waarmee we Titan Framework zullen gebruiken om de verschillende set opties die het kan maken te verkennen. Je hebt nodig:

  1. Lokale WordPress-instellingen, b.v. Ik gebruik DesktopServer (geloof me, het is geweldig!).
  2. Een basis WordPress-thema - ik ga Neat voor dat doel gebruiken. Ik heb een nieuwe branch gemaakt met de naam Neat: TitanFramework voor deze tutorial.

Mijn installatie

Omdat ik het Neat WordPress-thema ga gebruiken, is het belangrijk dat ik eerst de structuur uitleg. Open de themamap in uw teksteditor in de middelen map Ik heb een nieuwe map gemaakt met de naam beheerder. Het doel is om alle relevante code voor admin-opties af te handelen. Daarbinnen is een andere map, titanframework,en een PHP-bestand, admin-init.php.

admin-init.php het dossier

Dit PHP-bestand zal alle aan de administratie gerelateerde activiteiten afhandelen. Als je door de code scrolt, kom je te weten dat ik de get_template_directory () functie om vier bestanden uit de titanframework directory. De volgende code spreekt voor zich, maar ik zal het doel van elk van deze bestanden in een korte tijd toelichten.

Hier is de code voor admin-init.php:

Telefoonlijst titanframework

Ik heb eerder besproken dat Titan Framework je helpt creëren Admin-panelen en tabbladen, metaboxen en Thema-aanpasser secties en panelen. Dus ik heb aparte bestanden voor elk van hen gemaakt. Uiteraard kunnen ze worden gemaakt met afzonderlijke regels code. Ik zal elk van deze in mijn aankomende artikelen bespreken, maar voorlopig hoef je alleen maar te weten waar deze bestanden voor zijn.

  • titan-framework-checker.php: is verantwoordelijk voor het opnemen van Titan Framework in uw thema.
  • AdminPanel-options-init.php: bevat de code voor het maken van admin-paneel en tabbladen met een reeks opties.
  • Metabox-options-init.php: Bevat de code voor het maken van metaboxen voor berichttypen met een reeks opties daarin.
  • customizer-options-init.php: Bevat de code voor het maken van thema-aanpassingspanelen en secties met een reeks opties.

Inclusief de admin-init.php het dossier

Tot nu toe moet je je afvragen waarom ik zoveel nieuwe bestanden heb gemaakt. Waarom heb ik niet gewoon alle code in de functions.php het dossier? Welnu, ik beschouw het niet als een goede architectuurontwerpbenadering. Om een ​​onderhoudbaar product te bouwen, moet u een goed ontwerppatroon definiëren. 

Wat heeft het voor zin om je te verpesten functions.php bestand met zoveel regels code? Ik heb dit zelf ervaren: tegen het einde van een ontwikkelingsproject wordt de code zo enorm dat het moeilijk wordt om alles in een enkel bestand te verwerken, vooral als het gaat om foutopsporing en het oplossen van fouten. Het is altijd beter om aparte bestanden te maken, dus denk aan deze bestanden als modules.

Laten we opnemen admin-init.php in onze functions.php het dossier.

Hier heb ik de admin-init.php bestand via hetzelfde get_template_directory () en eenmalig benodigd() functies.

Op dit punt hebben we een kijkje genomen bij de basisopstelling van een thema dat ik ga gebruiken om uit te leggen hoe Titan Framework werkt. We hebben de setup en ingebedde Titan Framework voltooid in ons WordPress-thema. Laten we een beheerdersvenster met opties maken en de waarden voor de frontend ophalen.

Werken met Titan Framework

Om met Titan Framework te werken, moet je een bepaalde workflow volgen die:

  1. Maak een Titan Framework-instantie per bestand.
  2. Creëer Admin Panel / Tabs, Metaboxes of Theme Customizer Sections / Panels.
  3. Maak er opties in.
  4. Verkrijg de waarden.

Laat me eerst het stukje code schrijven dat ik voor dit doel ga gebruiken. Dit is de code voor de adminpanels-options-init.php bestand dat aanwezig is in de assets / admin / titanframwork / directory.

createAdminPanel (array ('name' => 'Neat Options' // Geef het optiemenu een naam)); / ** * Maak de opties. * * Nu zullen we opties voor ons panel creëren die we zojuist hebben aangemaakt met de naam '$ aa_panel'. * / $ aa_panel-> createOption (array ('id' => 'aa_txt', // De ID die wordt gebruikt om de waarde van deze optie te krijgen. 'type' => 'text', // Type optie we '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.)); / ** * Knop Opslaan voor opties. * * Gebruik deze code bij het maken van opties voor het beheerdersvenster om een ​​optie "Opslaan" -knop * toe te voegen, omdat de gebruiker de opties niet op een andere manier kan opslaan. Uw gebruikers kunnen nu * (en opnieuw ingesteld) de opties opslaan die we zojuist hebben gemaakt. * / $ aa_panel-> createOption (array ('type' => 'save')); 

Helemaal aan het begin heb ik een paar helpende links toegevoegd uit de documentatie van Titan Framework. Nu ga ik deze code regel voor regel toelichten.

Regel 17

Hier hebben we een haak genoemd tf_create_options, die wordt gebruikt om opties te creëren via Titan Framework met behulp van de aa_options_creating_function () functie. 

Lijnen 19

We hebben een functie gemaakt met de naam aa_options_creating_function (), die verantwoordelijk zal zijn voor het maken van deze opties.

Lijn 22

Op regel 22 heb ik een gemaakt aanleg voor Titan Framework. Het maken van een exemplaar is een integraal onderdeel van dit framework en het moet in elk bestand worden gemaakt, waar we ook nodig hebben om te communiceren met Titan Framework. Als u uw instantie uniek wilt maken, kunt u de naam van uw product erin opnemen. Ik heb bijvoorbeeld 'netjes' als parameter toegevoegd. 

Krijg een exemplaar van Titan Framework

Het creëren van een exemplaar van Titan Framework is vrij eenvoudig. We krijgen een uniek exemplaar om verwarring te voorkomen, voor het geval dat een andere plug-in Titan Framework gebruikt om opties te maken. De auteur verklaart dat: 

De getInstance-functie maakt / verkrijgt een uniek exemplaar van Titan Framework dat specifiek is voor 'mytheme'. Dit is de namespace we gaan gebruiken om ervoor te zorgen dat onze instellingen niet in conflict komen met andere plug-ins die Titan Framework gebruiken. Zorg ervoor dat u deze wijzigt in uw thema of plugin-naam.

Hier is een codevoorbeeld van het verkrijgen van een exemplaar met Titan. 

$ titan = TitanFramework :: getInstance ('my-theme');

In het geval van mijn Neatthema Ik zal de parameter van gebruiken netjesin plaats vanmijn thema om mijn code uniek te maken, d.w.z.. 

$ titan = TitanFramework :: getInstance ('netjes');

Een beheerdersdashboard maken; Lijnen 33-35

Deze regels zullen een admin-paneel maken dat ik heb genoemd als "$ aa_panel". Titan Framework helpt bij het maken van secties zoals admin panel, admin tabs, metaboxen en themafoutizer panelen binnen uw project. Maar voor nu zal ik alleen een admin-paneel maken als een voorbeeld om dingen uit te leggen. 

Deze coderegels noemen ons createAdminPanel () functie in Titan Framework die een array vormt. Met deze functie wordt een nieuw gedeelte in uw WordPress-dashboard met de naam toegevoegd Nette opties.

De bovenstaande afbeelding is een screenshot van het WordPress-dashboard, waar u een nieuwe sectie kunt vinden die wordt toegevoegd in het beheerdersdashboard.

Om kort samen te vatten wat ik tot nu toe heb gedaan: ik heb mijn webontwikkelingsproject opgezet en daarna heb ik er een exemplaar aan toegevoegd, waarna ik een beheerdersdashboard heb gemaakt. 

Op dit moment, als ik op de Nette optiesknop, dan is deze sectie leeg. Dus nu maak ik opties aan in dit nieuwe beheerdersdashboard. 

Opties maken in Titan Framework

Aanpasbare WordPress-thema's hebben de voorkeur omdat de eindgebruikers meestal thema's willen configureren zonder een enkele regel code te schrijven. Dit wordt mogelijk gemaakt door flexibele opties toe te voegen tijdens de ontwikkeling van het thema. 

We kunnen dergelijke opties toevoegen in een afzonderlijk admin-paneel, of in de vorm van metaboxen of anders in keuzepanelen binnen de thema-aanpasser. Opties dienen voor het opslaan van de waarden die later aan de voorkant worden opgehaald.

Lijnen 42-47

Bekijk nu deze coderegels. Deze worden gebruikt om opties te maken binnen een admin panel of tab. Regel 42 definieert de createOption () functie voor de $ aa_panel. Deze functie is opnieuw een array die bepaalde parameters draagt ​​zoals id, type, naam, beschrijving, enz. Volgens deze regels heb ik een optie gemaakt die een tekstveld is en een naam heeft Mijn tekstoptie

Dit is de screenshot die de optie weergeeft die is gemaakt in de Nette opties paneel.  

Regel 56-58

De laatste twee regels van de code creëren een andere optie binnen dit paneel. Maar het doel is om de instellingen op te slaan. Bijvoorbeeld in de Mijn tekstoptie veld, de gebruiker vult het met John Doe. Dit betekent dat de gebruiker de standaardinstelling wil wijzigen, wat alleen mogelijk is als de gebruiker de aangepaste instellingen opslaat.

Dus, ik gebruikte opnieuw de createOption () functie en heeft de waarde van parameter "type = opslaan". 

Dit is de uiteindelijke schermafbeelding van de ontwikkeling die ik tot nu toe heb gedaan. 

Op dit punt heb je Titan Framework helemaal ingesteld, je hebt een paar opties gecreëerd om dynamische resultaten te krijgen, en nu hoef je alleen de waarden uit de opties die je hebt ingesteld, eerst te krijgen. Uit de tagline met drie stappen heb ik de eerste twee in de vorige twee artikelen besproken. Dus, laten we nu naar het laatste en inderdaad het belangrijkste deel gaan van hoe Titan Framework werkt.

Waarden verkrijgen

Opties maken gebeurt aan de achterkant, en nu moeten we de waarden ophalen voor die opties, ingesteld door een eindgebruiker, om ze te gebruiken aan de voorkant. Via een eenvoudige functie, d.w.z., kunnen we waarden ophalen die tegen de opties zijn ingesteld. GetOption ().

Het volgende is de basisstructuur van de code om de opgeslagen waarden op te halen:

getOption ('my_text_option'); // Dingen hier doen. 

Dus ik heb een functie gemaakt met de naam myFunction waar ik voor het eerst een exemplaar van Titan heb geregistreerd. Het registreren van een instantie is een belangrijke stap, omdat het het door Titan Framework gemaakte object krijgt voor uw instellingen geregistreerd in een variabele, d.w.z.. $ titan. U kunt zien dat ons exemplaar specifiek is voor ons thema, d.w.z.. mijn thema, wat onze themanaam of iets unieks zou moeten zijn. 

Waarden ophalen aan de voorkant

Laten we de waarden gebruiken die zijn ingesteld voor de opties aan de voorkant. Ik heb een lege aangepaste paginasjabloon gemaakt. Als u naar de Netjes themamap, vindt u een bestand met de naam aa_titanframework.php in de root. Je kunt hetzelfde doen met je thema ook.

Maak een nieuw bestand in je teksteditor en kopieer en plak de volgende regels code.

getOption ('aa_txt'); ?> 

Voordat ik de bovengenoemde code uitleg, verwijs dan naar de code van mijn vorige artikel waarin ik een beheerdersdashboard en de bijbehorende opties heb gemaakt, omdat ik dezelfde namen, ID's, enz. Gebruik, ook hier.

De eerste vier regels van de code zijn voor WordPress om dit aangepaste paginasjabloon te registreren, wat vrij standaard is, geen raketwetenschap daar.

Optiewaarden verkrijgen

Ik zal de waarden krijgen van de opties die ik heb gemaakt in de AdminPanel-options-init.php bestand (verwijs naar de code van mijn vorige artikel) hier. Hiervoor zijn twee stappen nodig:

  1. Krijg een uniek Titan Framework-exemplaar en sla het op in een variabele.
  2. Verkrijg de waarde via ID met behulp van de GetOption () functie.

Lijn 12

Na de eerste stap initialiseerde ik een unieke instantie tegen de variabele $ titan, slechts één keer voor elk bestand waarin ik het gebruik. Mijn instantie is uniek omdat ik het heb genoemd netjes, d.w.z. de pakketnaam voor mijn thema - je kunt het alles wat uniek is noemen. Het is noodzakelijk dat als een plug-in Titan gebruikt en uw thema deze ook gebruikt, er een manier moet zijn om onderscheid te maken tussen de opties die zijn ingesteld door die plug-in en uw thema.

$ titan = TitanFramework :: getInstance ('netjes');

Regel 14

De tweede stap is om gebruik te maken van de ID en de opgeslagen waarde voor die optie te krijgen. De code voor deze regel is:

$ aa_txt_val = $ titan-> getOption ('aa_txt'); 

Ik heb de waarde voor opgehaald aa_txt die wordt opgeslagen tegen de variabele $ aa_txt_val. De aa_txt parameter verwijst naar de ID van de optie die ik heb gemaakt in mijn eerste beheerderspaneel (zie mijn vorige artikel).

Dus ik heb de basisstructuur opgesteld om de opgeslagen waarden te krijgen. Laten we nu de opgeslagen waarden aan de voorkant gebruiken.

Lijnen 22-35

Deze coderegels worden gebruikt om de opgeslagen waarden aan de voorkant weer te geven. Kijk eens naar regel 29 waar ik de echo commando om de output te krijgen. Hetzelfde gebeurt op regel 35, maar deze keer toon ik de uitvoer voor $ aa_txt_val in een H3-indeling (kop 3). Dus ongeacht de waarde die de eindgebruiker voor deze optie instelt, wordt deze aan de voorkant weergegeven.

resultaten

Voer de volgende stappen uit om de resultaten weer te geven voor de code die ik hierboven heb uitgelegd:

  • Ga naar je WordPress dashboard
  • Maak een Nieuwe pagina via Pagina's> Nieuw toevoegen.
  • Geef de pagina een naam Titan Framework (optioneel, dat weet je wel)

De bovenstaande schermafbeelding toont de pagina die ik heb gemaakt. Tegelijkertijd kunt u ook het nieuwe beheerderspaneelmenu vinden, d.w.z.. Nette opties, waar we de opties hebben gemaakt.

Kies vervolgens de paginasjabloon, d.w.z.. Titan Framework, voor deze pagina voordat u deze publiceert.

De aa_titanframework.php bestand voegt een nieuwe pagina toe Sjabloon genaamd het "Titan Framework" dat in de vervolgkeuzelijst verschijnt. Kies die sjabloon.

  • Publiceer de pagina.
  • Ga vervolgens naar de Nette opties menu en voeg wat waarde toe aan de genoemde optie Mijn tekstoptie.

De afbeelding laat zien dat ik dit veld heb ingevuld AA-Text-Option en toen klikte ik Wijzigingen opslaan.

  • Ga terug naar de Titan Framework-pagina en uitzicht de pagina.

De bovenstaande afbeelding toont het eindresultaat. Dit is deTitan Framework pagina. De opgeslagen optiewaarde (d.w.z. AA-tekstoptie) voor aa_txt wordt weergegeven in twee verschillende vormen. De eerste is binnen paragraaf formaat terwijl de tweede binnen is h3 formaat.

Conclusie

Inmiddels moet je enig begrip hebben van Titan Framework en zijn werking. Dit is de basisconfiguratie die moet worden gevolgd telkens wanneer u iets ontwikkelt met Titan Framework. 

Nu u weet hoe u het moet instellen, maakt u een paar opties en haalt u de opgeslagen waarden op; probeer het uit en laat het me weten in geval van vragen via opmerkingen of neem contact met me op via Twitter. 

Volgende in deze reeks zullen we de reeks opties die we kunnen maken met Titan Framework verkennen en hoe deze te gebruiken.