Hoe een lidmaatschapssite met WordPress te ontwikkelen deel 3

Eerder in de serie hebben we besproken hoe u de aanmeldings- en registratieformulieren van WordPress aanpast. We hebben vervolgens een aantal aangepaste velden toegevoegd aan ons registratieformulier. Vandaag, in het derde en laatste deel van deze serie, zullen we bespreken hoe een "mijn account" -sectie voor de gebruikers van uw site kan worden ontwikkeld, waarbij gebruikers hun profielinformatie kunnen bewerken. 

Pagina instellingen

Het eerste dat we willen doen, is een paginasjabloon maken om onze inhoud onder te brengen. Ik geef de voorkeur aan het invoegen van mijn paginasjablonen met het woord "sjabloon". Dus mijn bestand heet template-user-profile.php en de openings-PHP ziet er zo uit: 

Ik heb dit opgeslagen in de hoofdmap van mijn themamap. Als u niet bekend bent met WordPress-paginasjablonen, raad ik u aan de bovenstaande link te lezen. Ze zijn buitengewoon handig. 
Laten we nu naar de WordPress-backend gaan en een pagina maken met de naam 'profile' en in de Paginakenmerken meta box wijs het onze nieuw gemaakte paginasjabloon toe. Nadat u deze pagina hebt gepubliceerd, moet u een lege pagina aan de voorkant hebben: http: // uwdomein / profiel. 
Om nu wat inhoud op onze pagina te injecteren. We willen dat de structuur pagina-inhoud is (dat wil zeggen alles wat in de WordPress WYSIWYG is geschreven) en vervolgens ons profielformulier om te volgen. 
Het is vaak handig om de code van page.php op te halen en die als uitgangspunt voor uw paginasjablonen te gebruiken. Deze code verschilt een beetje, afhankelijk van je thema, maar het bevat waarschijnlijk een lus die de inhoud van sommige pagina's uitspuugt. Het contentgedeelte wordt normaal opgehaald met de WordPress-functie get_template_part (). Direct onder waar de inhoud is opgehaald, voegen we ons formulier-HTML in. Dus om samen te vatten:
 
Kopieer en plak de code van page.php in onze paginasjabloon.
 
Zoek waar de inhoud wordt uitgevoerd.
 
Precies daaronder, voeg de volgende code in en dan zullen we er doorheen lopen:
 
  
   
 
   
 
   
 
   
 
   
 
   
  
Er is hier niets gek aan de hand: het formulier gebruikt Bootstrap-markeringen omdat ons thema is gebouwd op Bootstrap. Andere dingen om op te merken zijn dat het formulier wordt verzonden met behulp van de POST-methode en we hebben een wp_nonce_field-dit is een soort beveiligingstoken dat helpt bij het voorkomen van kwaadwillende aanvallen. Als u onbekend bent met WordPress's Nonces, zou ik voorstellen om dit artikel te lezen. 
De gegevens ophalen
Met dat op zijn plaats, zou je een formulier op de voorkant van de site moeten hebben, maar het doet niet veel. We willen dat het de gegevens weergeeft die we hebben voor de ingelogde gebruiker. Je hebt misschien gemerkt dat de waarde-attributen in onze vorm een ​​beetje PHP uitbeelden. 
value ="Voornaam; ?>"
Op dit moment dat $ USER_INFO object bestaat niet omdat we de code nog niet hebben geschreven, dus laten we daar beginnen. Plak de volgende code vóór ons formulier in template-user-profile.php.
Door enkele native-functies van WordPress te gebruiken, krijgt deze de ID van de huidige gebruiker en daarmee kunnen we de gegevens van de gebruiker ophalen. Dit wordt opgeslagen in een genoemd object $ USER_INFO, en zoals hierboven aangetoond, kunnen we gebruikersgegevens vrij gemakkelijk ophalen. Als u alle gegevens in dat object wilt zien, kunt u a. Uitvoeren var_dump zoals zo: . Dit kan handig zijn voor foutopsporing of om gewoon te zien waartoe u toegang hebt. 
Verwerking van de gegevens
Er is nog een laatste stuk aan de puzzel en dat is om de gegevens te verwerken, zodat gebruikers hun profielen kunnen bewerken. Om dingen georganiseerd te houden, heb ik de lidmaatschapscode in een bestand geplaatst met de toepasselijke naam membership.php. Dit staat in de lib directory en is opgenomen in ons function.php-bestand. Zodra je dit hebt gedaan, open je je nieuw gemaakte membership.php-bestand in een code-editor, en laten we de functie maken die de gegevens van de gebruikers verwerkt. 
Laten we eerst eerst de logica doornemen. Wanneer de knop Verzenden is geraakt, willen we controleren of ons nonce-veld is verzonden. Dit controleert of de gegevens van de juiste plaats komen. 
Als aan die voorwaarde is voldaan, willen we de ID van de huidige gebruiker ophalen omdat we deze nodig hebben om de gegevens op te slaan. Vervolgens willen we onze gegevens indelen in een structuur die van WordPress houdt, in dit geval is het een array met specifieke sleutels. Voordat we de gegevens opslaan, willen we deze ook valideren en opschonen. En tot slot willen we berichten weergeven aan onze gebruiker, hetzij van succes of fouten.
En de code voor al dat ziet er ongeveer zo uit:
 sanitize_text_field ($ _POST ['first_name']), 'last_name' => sanitize_text_field ($ _POST ['last_name']), 'user_email' => sanitize_email ($ _POST ['email']), 'twitter_name' => sanitize_text_field ( $ _POST ['twitter_name']), 'user_pass' => $ _POST ['pass1'],); if (! empty ($ user_data ['user_pass'])) // Valideer de wachtwoorden om te controleren of ze hetzelfde zijn. if (strcmp ($ user_data ['user_pass'], $ _POST ['pass2'])! == 0) wp_redirect ('? password-error = true'); Uitgang;  else // Als de wachtwoordvelden niet zijn ingesteld, sla deze dan niet op. unset ($ user_data ['user_pass']);  // Sla de waarden op in het bericht. foreach ($ user_data als $ key => $ value) $ results = "; // http://codex.wordpress.org/Function_Reference/wp_update_user if ($ key == 'twitter_name') $ results = update_user_meta ($ user_id, $ key, $ value); unset ($ user_data ['twitter_name']); elseif ($ key == 'user_pass') wp_set_password ($ user_data ['user_pass'], $ user_id); unset ($ user_data ['user_pass']); else // Sla de resterende waarden op. $ results = wp_update_user (array ('ID' => $ user_id, $ key => $ value)); if (! is_wp_error ($ results) ) wp_redirect ('? profile-updated = true'); wp_redirect ('? profile-updated = false'); exit; add_action ('tutsplus_process_user_profile', 'tutsplus_process_user_profile_data');
Nu merkt u misschien dat de gegevens worden opgeslagen met behulp van drie verschillende WordPress-functies:
 
 update_user_meta () voor de Twitter-naam
 
 wp_set_password () voor het wachtwoord
 
 wp_update_user () voor de resterende gegevens
 
En u hebt gelijk om dit te betwijfelen. In principe moeten de aangepaste metagegevens (de Twitter-naam) worden verwerkt met behulp van de relatieve functie en niet de algemene gebruikersfunctie van de update. Wat betreft het wachtwoord, terwijl het kan werken wp_update_user (), Ik heb er problemen mee gehad en geef er de voorkeur aan deze methode te gebruiken. Onthoud dat dit slechts een leidraad is en dat de code vaak gericht is op het demonstreren van verschillende methoden om aan uw vereisten te voldoen. 
Oké, dus nu hebben we onze functie om de gegevens te verwerken, maar deze wordt nergens heen genoemd. Aan het einde van onze functie kunt u zien dat er een actie aan is gekoppeld. Dus om die functie te gebruiken, hoeven we alleen maar de WordPress te gebruiken: do_action () ;. Plak deze regel dus boven uw formulier in de sjabloon voor de gebruikersprofielpagina die we eerder hebben gemaakt:
Met dat op zijn plaats, wanneer we ons formulier indienen, zou het onze functie moeten doornemen en de gegevens moeten verwerken. 
Fout- en succesberichten
Ons profielformulier moet de gegevens nu opslaan of weigeren. Misschien waren de twee wachtwoorden niet hetzelfde en niet opgeslagen. Er zijn geen berichten om feedback van gebruikers te geven. Laten we onze gebruikers wat verdriet besparen en ze wat berichten sturen. 
In onze tutsplus_process_user_profile () functie is het u misschien opgevallen dat verschillende vraagreeksen aan de URL worden toegevoegd, afhankelijk van het resultaat van de verwerking. Dus als alles is opgeslagen en succesvol is, wordt onze URL toegevoegd ?profiel-update = true, en deze variëren op basis van de resultaten. Wat we moeten doen is een bericht activeren op basis van deze antwoorden. 
Hieronder heb ik een filter gebruikt om de inhoud en de magie van te bekijken $ _GET we kunnen de parameters controleren en uitspugen wat we nodig hebben. 
Oké, niet helemaal daar - we gebruiken een functie genaamd tutsplus_get_message_markup () hierboven, maar we hebben het nog niet gedefinieerd. Het duurt twee parameters:
 
een string: het bericht dat moet worden weergegeven
 
een tekenreeks: de mate van waarschuwing die moet worden weergegeven op basis van Bootstrap  
 
Dus laten we onze definiëren tutsplus_get_message_markup () functie:
'; $ output. = ''; $ output. = ''; $ output. = ''; $ output. = '
'. $ bericht. '
'; $ output. = '