no.hideout-lastation.com
Paradis For Designere Og Utviklere


Slik bruker du Dashicons i WordPress Theme eller Plugin

Sammen med den nye WP-Admin, tok WordPress 3.8 også et sett med helt nye ikoner som heter Dashicons. Dashicons er et fontikon designet av Mel Choyce som ble opprettet primært for å imøtekomme det nye WP-Admin-brukergrensesnittet, fra innholdsskjermredigeren til administrasjonsmenyen, som du kan se på skjermbildet nedenfor.

Som WordPress bruker nå den til å levere ikoner i WP-Admin, bør du også bruke den i dine temaer og plugins. Ved å bruke et skriftsymbol sett, som Dashicons, kan du enkelt tilpasse utdataene gjennom CSS . Hvis du er en utvikler som vil oppdatere pluginene eller temaene dine, i henhold til det nyeste WordPress-designet, så vel som å bruke de nye egenskapene, er denne artikkelen definitivt for deg.

Dashikoner i administrasjonsmenyen

Forutsatt at du tar med tilpasset innleggstype inn i temaet eller plugin-modulen, kan du bruke Dashicons på følgende måte. Tilpasset menu_icon bruker menu_icon til å vise ikonet. Før WordPress 3.8, kan du legge til bildeikon-banen i den. I versjon 3.8 kan denne parameteren også brukes til å deklarere ikonet fra Dashicons.

Først besøk Dashicons nettside. Klikk på et av ikonene. Du kan se at det valgte ikonet er reflektert på overskriften, og det viser ikonets navn med alternativer for å kopiere det i flere formater: CSS, HTML og Glyph.

Kopier ikonets navn, og legg det til i menu_icon i funksjonen Tilpasset menu_icon, slik som det. Merk at jeg har fjernet koden for å holde denne artikkelen kortere. Kodenes full lengde kan bli funnet her.

 $ args = array ('label' => __ ('bok', 'bok'), 'beskrivelse' => __ ('Posttype beskrivelse', 'bok'), 'etiketter' => $ etiketter, 'støtter' => array (), 'taxonomies' => array ('kategori', 'post_tag'), 'menu_position' => 20, 'menu_icon' => 'dashicons-book', 'capability_type' => 'innlegg' ; 

I dette eksemplet har jeg opprettet en egendefinert innleggstype for å legge inn bøker. Og som du kan se nedenfor, vises bokikonet ved siden av det.

Menyside

Plugins kan også bruke add_page_menu funksjonen for å legge til en Administrasjonsmeny. For dette tilfellet kan du bare angi Dashicons ikonnavn som sjette parameter. I det følgende eksempelet viser vi "skiftenøkkel" -ikonet på siden Alternativer.

 funksjon hkdc_custom_menu_page () {add_menu_page ('Options Page', 'Options', 'manage_options', 'myplugin / option.php', '', 'dashicons-admin-tools', 81); } add_action ('admin_menu', 'hkdc_custom_menu_page'); 

Gå over til WP-Admin, og du bør se ikonet som vist.

The Fallback

Aldri anta at alle brukerne vil oppdatere til den nyeste WordPress. I noen tilfeller gjør de det ikke. De kan ha installert et plugin for å slå av automatiske oppdateringer. Så, det er nødvendig å gi en tilbakebetaling som støtter eldre WordPress-versjon. Hvis vi ikke gjør det, vises ikonsiden som et ødelagt bilde (som hva som skjer i dette bildet ved siden av bøker).

Før du fortsetter, må du sørge for at du har plassert bildeikonet i temaet eller plugin-katalogen. Deretter kan vi spesifisere ikonet med en betinget funksjon, som følger:

Først setter vi standard, som bruker Dashicons.

 $ icon = 'dashicons-book-alt'; 

Og vi erstatter $ ikonvariabelenes verdi hvis den er i WordPress 3.7 og under.

 hvis (version_compare ($ GLOBALS ['wp_version'], '3.8', '<')) {$ icon = get_template_directory_uri (). '/extra///hideout-lastation.com/img/book-brown.png'; } 

Erstatt ikonparameteren i tilpasset add_menu_page (samt i add_menu_page funksjonen) med variabelen $icon .

 $ args = array ('label' => __ ('bok', 'bok'), 'beskrivelse' => __ ('Posttype beskrivelse', 'bok'), 'etiketter' => $ etiketter, 'støtter' => array (), 'menu_position' => 20, 'menu_icon' => $ ikon, ); register_post_type ('bok', $ args); 

Og vi er ferdige. Den vil bruke Dashicons for WordPress 3.8, mens du viser "bilde" -ikonet i eldre versjoner.

Designerhåndboken til grunnlaget for Web Accessibility Design

Designerhåndboken til grunnlaget for Web Accessibility Design

Internett skal være et sted hvor alle kan få tilgang til det samme innholdet fra hvor som helst i verden. Responsive teknikker har gått langt for enhets-agnostisk design . Men hva med tilgjengelighet-agnostisk design ?Webtilgjengelighet har eksistert i årevis, men implementeringen krever nye fremskritt innen teknologi og webutvikling. Ma

(Tekniske og design tips)

CSSMatic - Automatiseringsverktøy som gjør CSS enkelt for webdesignere

CSSMatic - Automatiseringsverktøy som gjør CSS enkelt for webdesignere

CSS er et veldig kraftig stilarksspråk som lar deg ta kontroll over utseendet på et nettsted. Det gir effektivitet i design og oppdateringer. Men koding fra grunnen er alltid tøff . Heldigvis kan du finne mange små hjelpere som vanligvis dekker noen få funksjoner for å gjøre koding av CSS lettere.I dag

(Tekniske og design tips)