Hoe u uw Gravatar-afbeeldings-URL ophaalt

Het hebben van een profielfoto ook bekend als "avatar afbeelding" is behoorlijk essentieel online. We uploaden onze beste profielfoto's op websites en sociale sites voor legitimiteit, geloofwaardigheid en voor mensen om onze online aanwezigheid beter te herkennen.

WordPress heeft een eigen service voor het leveren van afbeeldingen van gebruikersprofielen, en het wordt Gravatar genoemd. We kunnen dit ook opnemen in onze eigen aangepaste thema's. In dit bericht wordt een aantal manieren behandeld waarop u de profielafbeelding van Gravatar kunt ophalen.

Gravatar gebruiken

Laten we beginnen bij de basis. WordPress heeft een speciale geïntegreerde functie, get_avatar, waarmee we de gravatar-afbeelding kunnen ophalen. Voor deze functie zijn twee parameters vereist: de gebruikers-ID of e-mail en de grootte van de afbeelding die moet worden weergegeven. Hier is een voorbeeld.

 $ user_id = get_the_author_meta ('ID'); echo get_avatar ($ user_id, 80); 

Als u liever een e-mail van een gebruiker gebruikt, vult u de functie get_the_author_meta() met user_email :

 $ user_id = get_the_author_meta ('user_email'); echo get_avatar ($ user_id, 80); 

Beide voorbeelden geven hetzelfde resultaat: een 80px een gebruiker met de grootte van 80px . In mijn geval zal ik mijn foto zien.

Toch is het probleem dat ik ooit tegenkom met deze functie dat de functie het hele beeld genereert; een volle label. Inspecteer de codebron en je zou het als volgt moeten vinden:

Dit maakt het een beetje lastig voor ons om bijvoorbeeld extra klassen of een ID in te voegen in de .

Als alternatief kunnen we alleen de afbeeldings-URL ophalen in plaats van de element volledig. Zodra we de URL hebben, kunnen we deze toevoegen aan de met de aangepaste klassen of ID toegevoegd.

Hoe de afbeelding-URL op te halen

Eerst moeten we een nieuwe PHP-functie maken in functions.php van het WordPress-thema dat u gebruikt. Laten we de functie als volgt noemen:

 functie get_avatar_img_url {} 

Het ophalen van de Gravatar-afbeelding vereist de e-mail van de gebruiker; zorg ervoor dat de e-mail in Gravatar is geregistreerd om de uitvoer te zien. Bel de e-mail van de auteur, zoals zo.

 function get_avatar_img_url {$ user_email = get_the_author_meta ('user_email'); } 

De Gravatar-afbeeldings-URL wordt gespecificeerd met http://gravatar.com/avatar/ en gevolgd door md5-hash (gecodeerde waarde) van het e-mailadres. Om de addrress van de e-mail terug te brengen naar een "md5 hash" -waarde, kunnen we de ingebouwde PHP-functie md5() . Daarom hebben we de Gravatar-afbeeldings-URL op deze manier uiteengezet:

 function get_avatar_img_url {$ user_email = get_the_author_meta ('user_email'); $ url = 'http://gravatar.com/avatar/'. md5 ($ user_email); } 

Vervolgens moeten we een aantal vereiste parameters opnemen in de URL, die de afbeeldingsgrootte en de standaard terugvalafbeelding zijn, als de afbeelding niet is geregistreerd in Gravatar. Om dit te doen, gebruiken we een WordPress-functie met de naam add_query_arg.

 function get_avatar_img_url () {$ user_email = get_the_author_meta ('user_email'); $ url = 'http://gravatar.com/avatar/'. md5 ($ user_email); $ url = add_query_arg (array ('s' => 80, 'd' => 'mm', ), $ url); return esc_url_raw ($ url); } 

Deze add_query_arg functie voegt parameters toe aan het einde van de URL. In ons geval zal het ?s=80&d=mm waarmee de beeldgrootte op 80pixels wordt ingesteld en de standaardavatar op mm (Mystery Man) wordt ingesteld.

Gebruik nu gewoon de PHP- echo om de URL binnen de element, zoals zo:

 $ avatar_url = get_avatar_img_url (); echo '  '; 

10 Beste zelfstudies om AngularJS te leren

AngularJS is een geweldig Javascript-framework dat kan worden gebruikt om krachtig te maken en dynamische web-apps . Het behandelt ook het bouwen van complexe client-side applicaties . Sinds de release in 2009 is AngularJS door veel ontwikkelaars op grote schaal gebruikt voor het gemakkelijk uitbreiden van aangepaste HTML-tags en -attributen, ook wel 'richtlijnen' genoemd

(Technische en ontwerptips)

Creëer CSS 3D Shape met gemak met behulp van Tridiv

Heb je ooit met 3D op internet gewerkt? Zo ja, dan bent u waarschijnlijk bekend met WebGL (Web Graphics Library), een JavaScript-API die is bedoeld voor het weergeven van 3D- en 2D-afbeeldingen in uw webbrowser zonder het gebruik van plug-ins. In dit bericht introduceren we Tridiv, een gratis web-app voor het met gemak creëren van CSS 3D-vormen .

(Technische en ontwerptips)