Share
Nå har vi jobbet med egendefinerte menyer, la oss fokusere på dynamiske sidebjelker og hvordan de kan brukes innenfor et tema.
Hva er et dynamisk sidebjelke nøyaktig? Det er 3 deler av navngivelsen vi må håndtere når det gjelder dette emnet.
For det første, "dynamisk". Dynamisk refererer til at sidebarområdet kan styres fra administrasjonspanelet og lett kan endres. Videre kan innholdet bli trukket fra kontinuerlig oppdatert WordPress-informasjon som innlegg, kommentarer og andre jevnlig oppdaterte innholdstyper, slik at hver gang et nytt innlegg legges til, kan det trekkes inn i en ny innleggsblokk med innhold eller widget (vi vil avtale med begrepet widget i litt.).
For det andre, "Sidebar" refererer til et innholdsområde, som ikke nødvendigvis må være plassert på siden av oppsettet (merkelig jeg vet). Begrepet ble arvet fra de tidlige dagene av blogg stil layouter hvor widgets var ganske mye alltid plassert på siden. Sidebjergsområdet inneholder ekstra innholdsblokker eller plugins genererte data som vises i form av "widgets" vanligvis på siden, i overskriften eller i bunnteksten til WordPress-temaer, men kan også plasseres på noe som helst måte innenfor temaets layout.
En widget er en liten innholdsblokk, som vanligvis inneholder koblinger eller innhold knyttet til sider eller innlegg. Disse kan inneholde lister over innlegg, kommentarer, koder, kategorier og en rekke andre innholdsinnsamlinger som er innebygd, og noen genereres av flere plugins.
Widgets kan legges til "widget ready" -temaer via Utseende -> Widgets i administrasjonspanelet ved hjelp av det innebygde dra og slipp-widget-administrasjonsområdet. Temaer støtter ikke widgets automatisk og må gjøres widget klar ved å registrere en spesiell funksjon, på samme måte som vi registrerte de tilpassede menyene.
Før vi registrerer sidefelt i et WordPress-tema, ser vi følgende når du besøker Utseende -> Widgets.
I likhet med de tilpassede menyene i vår forrige leksjon, for at den dynamiske sidebarfunksjonen skal fungere i ditt tema, trenger temaet en functions.php-fil som registrerer sidebjørene. Den enkle funksjoner.php-filen skal inneholde følgende kode:
Vær forsiktig som nevnt før ikke å forlate tomme mellomrom etter kode i funksjonsfilen din, da dette noen ganger forårsaker problemer som kan resultere i hvite skjermbilder når du ser temaet ditt på forsiden.
Det eneste aspektet av denne koden som ville være nødvendig å redigere i begynnelsen, ville være mengden av dynamiske sidebar områder å registrere i "register_sidebars (1);". Vi skal håndtere navngitte sidebjelker i en liten stund. For nå har koden ovenfor registrert 2 sidebjelker identifisert bare etter deres nummer.
Skulle du ønske å ha 5 dynamiske sidebar områder i temaet ditt, endres nummeret til 5 - "register_sidebars (5);". I så fall vil du ha 5 dynamiske sidebar områder nummerert 1 - 5.
Funksjonen har en "if" -attest eller betinget argument som kontrollerer om register_sidebars-funksjonen finnes i denne versjonen av WordPress. Hvis svaret kommer tilbake med et ja, blir register_sidebars-funksjonen utført. Med tanke på sidebjelker har blitt støttet fra versjon 2.2 av WordPress, er det sannsynligvis unødvendig å bekymre seg for dette aspektet av koden.
Når din funksjonsfil er klar, kan du fortsette å sette inn widgets i de nye sidefeltområdene vi har opprettet.
Du kan nå hente widgets fra venstre side "Tilgjengelige widgets" -området og slippe dem inn i sidefeltet 1 eller 2 i høyre side.
Når din funksjonsfil er klar, kan du fortsette å sette inn den dynamiske sidelinjekoden i områdene av temaet der du ønsker å dynamisk legge til WordPress-widgets. Koden nedenfor er den mest grunnleggende formen for sidelinje plasseringskoden. Det eneste aspektet som må endres, er nummeret som reflekterer hvilken nummerert sidebjelke du vil plassere i det bestemte stedet.
Vi plasserer denne koden i venstre sidefelt
Koden ovenfor skal være nok til at den registrerte sidebaret kan vise widgetinnhold innenfor temaet. Så vi går videre og legger til noen widgets.
Som resulterer i:
Jeg har måttet legge til flere CSS for å ta med de nylig lagt til widgets. I hovedsak har jeg lagt til i sidebar widget CSS fra Twenty Eleven tema. Du må kanskje skrive egendefinert CSS for dine egne temaer slik at de passer inn i utformingen, styling og farging for temaet ditt. Jeg legger inn CSS på slutten av leksjonen.
For å sikre at sidelinjen fremdeles viser noe i tilfeller der det ikke er lagt til widgets ennå, eller i den eksterne hendelsen som sidelinjer ikke har registrert, (vi håper ingen kjører pre versjon 2 WordPress), må vi utvide plasseringskoden med følgende. Legge merke til dynamic_sidebar (1) er fortsatt i den første linjen med kode!
Hva gjør koden ovenfor?
Linje 1 av koden sjekker for å se om du har registrert noen sidebjelker i din functions.php-fil, og i så fall hvilket sidebarnummer som skal settes inn på dette stedet.
Linje 2 Fungerer som en standard widget som viser en liste over nettstedets innleggskategorier dersom ingen dynamiske widgets er lagt til. Når en dynamisk widget er lagt til i sidelinjen i dashbordet, blir standard-widgeten erstattet av den dynamiske.
Linje 3 slutter om argumentet som linje 1 startet. I PHP-argumenter som om, som er et betinget utsagn, må også sluttes, så argumentet påvirker ikke noen PHP-kode som følger. Ikke lukke hvis med endif; vil ødelegge temaet ditt!
Den eneste delen av de 3 linjene med dynamisk sidebar kode som virkelig må redigeres er nummeret, for å indikere hvilket spesifikt nummerert sidebjelke som blir satt inn på dette bestemte stedet.
Fra WordPress-dokumentasjonen (The Codex) er dette noen av funksjonene som kan brukes til "hardkode" widgets i sidebar områder og å inkludere som standard widgets i sidebar plasseringskode.
wp_list_authors () - Viser en liste over nettstedets forfattere (brukere), og hvis brukeren har skrevet noen innlegg, vises forfatternavnet som en lenke til sine innlegg.
wp_list_categories () - Viser en liste over kategorier som lenker. Når en kategorilink er klikket, vil alle innleggene i den kategorien vises
wp_dropdown_categories () - Vis eller hent HTML-rullegardinlisten over kategorier.
wp_tag_cloud () - Viser en liste med koder i det som kalles en "tag cloud", hvor størrelsen på hver tag er bestemt av hvor mange ganger den aktuelle taggen er tildelt innlegg.
wp_list_pages () - Viser en liste over WordPress-sider som lenker.
wp_list_bookmarks () - Viser bokmerker som finnes i Administrasjon -> Lenker panel.
get_comments () - Liste kommentarer basert på nummer, rekkefølge og andre parametere.
wp_get_archives () - Denne funksjonen viser en datobasert arkivliste.
Disse funksjonene kan også brukes hvor som helst i temaet for å generere lister over ulike innhold fra nettstedet for å hjelpe brukerne med å finne innhold enklere.
Vi kan da bruke denne plasseringskoden for å plassere vårt sidebar nummer 2 i høyre side av temaet vårt.
kategorier
Vi kan også inkludere andre HTML-innhold som standard widget innhold som skal vises før dynamiske widgets legges til via widgets admin. Dette kan inkludere en melding for å minne nettstedseiere om å legge til widgets fysisk når de aktiverer det nye temaet.
Ingen Widgets lagt til
Vennligst logg inn og legg til noen widgets i dette sidebjelken
Som vi kan se nedenfor, har vi satt inn sidebar plasseringskode til standardinnhold, enten av widgets som illustrert i venstre sidefelt eller annet HTML-innhold, som illustrert i høyre sidefelt. Dette vises så lenge ingen dynamiske widgets blir lagt til via widgetens betjeningspanel. Når dynamiske widgets er lagt til, erstatter de disse standardinnholdene automatisk.
Nå for å teste ut noen dynamiske widgets la vi til følgende 2 dynamiske widgets:
Hvilket resulterer i følgende utseende.
Foreløpig har vi 2 plasseringskoder med forskjellig standardinnhold, men trekker samme sidebarområde inn i både venstre og høyre side av temaet vårt. For å rette opp dette vil vi endre eller sidebar plasseringskode i høyre sidefelt for å plassere sidebar nummer 2 i stedet for sidebar 1 som følger. Som du kan se trenger vi bare å endre nummeret til det nummererte sidebaret vi ønsker å plassere.
Ingen Widgets lagt til
Vennligst logg inn og legg til noen widgets i dette sidebjelken
Vi kan nå styre våre venstre og høyre sidefelt uavhengig av hverandre.
Når du har lagt til en viss mengde sidebjelker i temaet ditt, vil du raskt innse behovet for å ha navn i stedet for bare tall. Dette vil hjelpe deg med å huske hvilke områder av siden din eller maler den bestemte sidebaren er plassert i.
For å registrere navngitte sidebjelker må følgende kode brukes til å registrere sidebjelker i din functions.php-fil:
Den eneste forskjellen når det gjelder hva som blir registrert her, er for øyeblikket navnet på sidefeltet. Det finnes flere parametere for å tilpasse HTML-utdataene til sidebar-widgets på følgende måte:
Kilde: register_sidebar
Å bruke noen av disse i arrayformat resulterer i følgende kodestruktur.
'Venstre side', 'before_widget' => '',' after_widget '=>'',' before_title '=>'',' after_title '=>'
',)); ?>
Dette vil resultere i følgende HTML-utgang.
Vi kan endre HTML-pakkene for widgetbeholderen og tittelen med andre HTML, klasser, ID-er osv.
Videre for å registrere mer enn ett Dynamisk Sidebar-område, dupliserer vi register_sidebar område av koden sammen med sin rekke parametere så mange ganger som nødvendig for å registrere flere sidebjelker.
'Venstre side', 'before_widget' => '',' after_widget '=>'',' before_title '=>'',' after_title '=>'
',));
register_sidebar (array ('name' => 'Høyre side', 'before_widget' => '',' after_widget '=>'',' before_title '=>'',' after_title '=>'
',)); ?>
Med disse tilleggsparametrene kan vi lettere kontrollere HTML-utgangen, slik at vi kan matche strukturen vi trenger for stylingen vi prøver å oppnå. Vi bruker koden ovenfor til å erstatte våre nummererte sidebjelker med navngitte.
Det er viktig å merke seg at når du endrer sidebaregistreringer, måten jeg nettopp har gjort, eller når du legger til flere sidebjelker, spesielt for temaer som kjører på levende nettsteder, kan widgets muligens bli feildelt av WordPress
WordPress prøver generelt å holde widgets i sidebjelker basert på deres rekkefølge, så hvis et sidebarområde fjernes eller legges til, kan WordPress omfordele eksisterende eksisterende widgets til sidebar områder som korresponderer med forrige sidefeltbestilling. I vårt tilfelle akkurat nå er dette ikke noe problem fordi vi fortsatt har bare 2 sidebjelper, slik at våre widgets blir der de var.
For øyeblikket har du endret navnene i vår registreringskode, fordi vi har et enkelt 2-sidig oppsett, kan WordPress fortsatt plassere våre navngitte sidebjelker i vårt tema basert på deres bestilling. Vi må imidlertid redigere vår sideboks plasseringskode for å gjenspeile navnene vi har opprettet for å unngå mulige problemer i fremtiden.
Plassering av navngitte navnganger krever i hovedsak å endre nummeret, i vår plasseringskode, til sidelinjen. Så ved å bruke den aller første plasseringskoden vi startet med, det var den enkleste:
Navnet vi bruker må være identisk med navnet vi har gitt sidebjelken i vår registreringskode.
Med hensyn til den utvidede plasseringskoden vi brukte for våre nummererte sidebjelker:
Ingen Widgets lagt til
Vennligst logg inn og legg til noen widgets i dette sidebjelken
Ved å bruke HTML-utgangen generert av registreringskoden, kan vi nå utforme våre sidebarelementer til hjertets innhold.
Koblingen nedenfor beskriver noen av de viktige sidebar / widget-CSS-elementene vi må vurdere når du forbereder temaer for offentlig utgivelse. Dette er slik at brukere som legger til de vanligste widgets vil ha dem pre-stylet for å matche utseendet og utformingen av temaet.
WordPress Standard CSS-stiler - Jeff Star, DigWP
Nå gå videre og widgetize!
Accentsconagua