Share
Welkom bij deel 3 van BuddyPress-thema's ontwikkelen. In deze tutorial zullen we ons concentreren op BuddyPress 'nieuwste release - versie 1.5, evenals hoe de gebruikerservaring kan worden aangepast door ledenpagina's te bewerken en aangepaste functies toe te voegen.
Deze tutorial is het laatste deel in deze serie BuddyPress Themes ontwikkelen. We zijn van de API gegaan naar een aangepast thema dat is opgebouwd rond een specifieke community. Vandaag nemen we dat een beetje verder.
In deze tutorial zullen we:
Aan het einde van deze tutorialserie moet je een goed begrip hebben van de nieuwe veranderingen van BuddyPress en een goed referentiepunt als je je BuddyPress-thema's begint of blijft ontwikkelen.
Ten eerste, als je BP nog niet hebt bijgewerkt, ga je gang en neem de sprong en update. U kunt dat handmatig doen of via het WP-dashboard. Zodra u hebt bijgewerkt, ziet u een bericht boven aan het scherm waarin staat dat u de update moet configureren.
Klik daarop en dan zou je dit moeten zien:
Het thema dat we hebben gemaakt, zou goed moeten zijn. Maak je geen zorgen over het inruilen van de stylesheets of iets dergelijks, want het is eigenlijk niet nodig voor zover ik kan vertellen. Als iemand daar een opmerking over heeft, zorg er dan voor dat je hem daar gooit!
Als de update niet zo goed was voor uw thema, bezoekt u hier de BuddyPress-themaontwerper en -ontwikkelaarspagina.
Sinds de release vorige week heb ik minimaal gespeeld, maar ik zal de hoogtepunten uit de BuddyPress-website herhalen. Ze zijn als volgt:
Klik hier voor een complete lijst met functies en hoogtepunten. Let op enkele wijzigingen in loops en basis-BP-functies. Deze zouden je echt moeten helpen bij je BP-themaontwikkeling.
Een belangrijk ding dat ik specifiek wil bespreken in BuddyPress 1.5 is hoe in te bedden. BuddyPress maakt nu gebruik van de native embedding van Wordpress, waarmee je content direct kunt insluiten via de URL. Als ik bijvoorbeeld een video wil toevoegen aan mijn forumonderwerp, zou ik iets plaatsen als:
Hé, kijk hier eens bij en laat me weten wat je ervan vindt. http://www.youtube.com/watch?v=ROBmgYcIBww
Dit zal resulteren in:
Als u wilt, kunt u de bovenstaande URL ook in een embed shortcode en geef de hoogte en breedte op als:
[embed] http://www.youtube.com/watch?v=ROBmgYcIBww [/ embed]
Dat zou moeten helpen als u een thema gebruikt dat een stijl gebruikt die anders is dan de standaard, omdat de breedte van de insluiting groter kan zijn dan u wilt.
Laten we nu eens kijken naar het bewerken van ledensjablonen, een functie van BuddyPress 1.5. Terwijl we de lidsjablonen bewerken, wil ik u ook laten zien hoe u uw aangepaste profielveldgegevens aan de sjablonen toevoegt om uw online community echt te versterken.
Voordat we beginnen, moet je het kopiëren leden map van bp-standaard, en plak het in uw onderliggende themamap.
Werk nog steeds in de ledenmap die u naar uw kindthema hebt gekopieerd en open de map met de naam single. Deze map bevat de elementen waaruit een lid bestaat wanneer ze hun profiel bezoeken. Mijn pagina ziet er momenteel zo uit:
De belangrijkste bestanden waarmee we werken zijn home.php en member-header.php, omdat dit de bestanden zijn die bepalen wat de gebruiker ziet wanneer ze naar hun info kijken.
Open eerst het bestand lid-header.php. Dit bestand wordt gebruikt om de avatar-, info- en navigatie-elementen van de gebruiker weer te geven.
Omdat de site die ik maak over het buitenleven gaat en specifiek over kamperen, wil ik dat leden informatie hebben die relevant is. Hiervoor heb ik de volgende aangepaste profielvelden gemaakt:
Een groot voordeel van de nieuwe gebruikersinterface is dat navigeren veel eenvoudiger is. U kunt snel volledig nieuwe profielvelden maken en bewerken voor elke groep die u heeft, waardoor u elke groep in BuddyPress echt kunt aanpassen.
Om deze velden te integreren in de kop van mijn ledenpagina, onder regel 29, die is:
plaats het volgende:
Accentsconagua
Mijn favoriete kampeerplek: '. $ Favorite_spot. ''; $ necessary_item = bp_get_profile_field_data ('field = One Necessary Item'); echo 'Mijn One Necessary Item: '. $ Necessary_item. '
'; ?> Hier heb ik de aangepaste profielvelden "Favoriete Kampeerplek" en "Eén Noodzakelijk voorwerp" opgehaald en in nieuwe alinea's onder de laatste activiteitsinformatie weergegeven. Ik gaf ze ook de klasse "profielvelden", zodat ik ze gemakkelijk kan inrichten via CSS.
Bovendien kunt u voorwaardelijke voorwaarden toevoegen waarmee gebruikers hun profiel kunnen bijwerken als de gegevens ontbreken.
Tot nu toe hebben we veel gesproken over kindthema's en hoe je je eigen functies daaraan kunt toevoegen via de functies.php in de themak map van je kind. Hoe zit het met de wijzigingen die u aan BuddyPress wilt aanbrengen, ongeacht het thema dat wordt gebruikt? Hoe zit het met het veranderen van algemene zaken zoals het registratieproces of andere algemene elementen van de gebruikerservaring?
Om veranderingen op wereldwijde schaal te kunnen uitvoeren, ongeacht het thema, moet je een nieuw bestand maken met de naam bp-custom.php en plaatsen in wp-contents / plugins /. Om dat bestand aan te maken, opent u een nieuw bestand en plaatst u het daarin:
Sla het op als bp-custom.php, plaats het in wp-contents / plugins en je bent klaar! Zodra u daar functies toevoegt, worden ze ongeacht het thema geladen.
Ten slotte wilde ik snel demonstreren hoe aangepaste velden en bp-custom.php kunnen worden gebruikt om een Twitter-feed weer te geven. Ik weet dat er plug-ins zijn die deze functionaliteit ook hebben, maar ik wilde een aantal concepten waar we het over hadden in een voorbeeld plaatsen.
Eerst plaatste ik de volgende code in mijn bp-aangepast bestand:
function CNBTgetTwitterStatus () ?>'s Twitter Feed
tekst; // krijgt de tijd dat de status is gemaakt $ tweet-> created_at; // krijgt de URL van het gebruikersprofiel Afbeelding $ tweet-> gebruiker-> profile_image_url; // krijgt de gebruikersnaam $ tweet-> gebruiker-> schermnaam; // krijgt de gebruiker locatie $ tweet-> gebruiker-> locatie; // krijgt de gebruikersnaam $ tweet-> gebruiker-> naam; // Haal het aantal volgers. $ Tweet-> gebruiksvriendelijker> followers_count; // Ontvang de URL van de gebruikerswebsite. $ tweet-> user-> url * / // Convert twitter Gebruikersnamen en links naar Hyperlinks $ tweetcontent = linkify ($ tweet-> text); $ getTweets. = "$ tweetcontent
"; // Cache instellen als deze niet bestaat set_transient ($ transient, $ getTweets, 10); echo $ getTweets; else return false; / * Credit Jeremy Parrish http://rrish.org/ * / functie linkify ($ status_text) // linkify URL's $ status_text = preg_replace ('/ (https?: \ / \ / \ S +) /', '\ 1', $ status_text); // linkify gebruikers $ status_text = preg_replace ('/ (^ | \ s) @ (\ w +) /', '\ 1 @ \ 2', $ status_tekst); // koppelingstags $ status_text = preg_replace ('/ (^ | \ s) # (\ w + ) / ',' \ 1 # \ 2 ', $ status_tekst); return $ status_tekst; add_action (' bp_after_member_home_content ',' CNBTgetTwitterStatus ');
Deze code produceert dit:
Om dit een beetje op te splitsen, gebruik ik eerst een sjabloontag om een kop met de naam van de gebruiker weer te geven, weet je, om het persoonlijker te maken.
's Twitter Feed
Vervolgens bouwen we de functie die onze twitter-updates zal uitvoeren. Omwille van de tijd heb ik deze functie eigenlijk gevonden. Er zijn andere functies die u gemakkelijk kunt gebruiken om de Twitter-feed te maken die u wilt. Als je merkt, zet ik ook een klasse op elke tweet, zodat ik het in mijn style.css kan stylen:
$ getTweets. = "$ tweetcontent
";
Aan het einde van deze functie, ik noem het en gebruik een sjabloon-tag om het te plaatsen na de inhoud van de homepage van het lid.
add_action ('bp_after_member_home_content', 'CNBTgetTwitterStatus'); En nu hebt u een eenvoudige Twitter-feed die u kunt weergeven en aanpassen om uw gebruikers nog meer te verbinden!
Tot slot hoop ik dat je in deze serie hebt gezien dat BuddyPress een krachtige tool is die effectief kan worden gebruikt in je projecten. Het gaat niet voorbij aan begrip! Beter nog, het heeft een actief dev-team en een gemeenschap die werken om het nog efficiënter en functioneler te maken. Ik heb met je genoten van deze serie, en als ik kan helpen, laat het me alsjeblieft weten.
!
