Vil du legge til en WordPress-widget i topptekstområdet på nettstedet ditt?

Med widgets kan du enkelt legge til innholdsblokker i bestemte deler av WordPress-temaet ditt.

I denne opplæringen vil vi vise deg hvordan du enkelt kan legge til en WordPress-widget til overskriften på nettstedet ditt.

Merknader: Dette er en mellomnivåopplæring. Du må legge til kode i filer med WordPress-temaet og behersker noen CSS.

Men før noen modifisering oppdager vår 5 WordPress plugins til backup bloggen din eller Hvordan installere en WordPress tema et Hvor mange plugins bør jeg installere på WordPress.

Så la oss gå tilbake til hvorfor vi er her. 

Hvorfor og når må du legge til en widget på overskriften?

Med widgets kan du enkelt legge til innholdsblokker til et bestemt område i WordPress-temaet ditt. Disse angitte områdene kalles " sidefelt "Eller områder av" widgets'.

Et widget-område på overskriften kan brukes til å vise annonser, nylige artikler eller hva du måtte ønske deg.

Dette bestemte domenet brukes på alle populære nettsteder for å vise virkelig viktig informasjon.

Oppdag også Slik legger du til egendefinerte widgets etter at du har lagt ut på WordPress

zone widgetisee i wordpress head

Som en generell regel, WordPress-temaer legg til sidefelt ved siden av innhold eller i bunntekstområdet. Svært få WordPress-temaer legger til widgetområder over innholdet eller i overskriften.

Vi anbefaler også å oppdage våre MailChimp tutorial på fransk: den komplette guiden til å opprette et nyhetsbrev

Derfor vil vi i denne opplæringen vise deg hvordan du legger til et widget-område til overskriften på WordPress-nettstedet ditt.

Trinn 1: Opprett et widgetområde

Først og fremst må vi lage et tilpasset widgetområde. Dette trinnet lar deg se et tilpasset widgetområde i " Utseende> Moduler På WordPress-oversikten.

Du må legge til denne koden i filen functions.php Av temaet ditt.

funksjon bpc_widgets_init () {register_sidebar (array ('name' => 'Custom Header Widget Area', 'id' => 'custom-header-widget', 'before_widget' => ' ',' after_widget '=>' ',' before_title '=>' ',' after_title '=>' ',)); } add_action ('widgets_init', 'bpc_widgets_init');

Denne koden lagrer et nytt sidefelt eller widget-område i WordPress-temaet.

Hvis du aldri har installert WordPress lokalt, kan du finne ut av det Hvordan installere WordPress lokalt på en PC / Windows med XAMPP

Du kan gå til " Utseende> Moduler Og du vil se et nytt widget-område merket " Custom Header Widget-området '.

ny WordPress-widget sone

Gå videre, og legg til en tekstwidget til dette nyopprettede området og lagre det.

Prøv også vår guide for å legge til widgeter.

Trinn 2: Vis widgeten din i overskriften

Hvis du besøker nettstedet ditt, vil du ikke kunne se tekstwidget du nettopp la til.

Fordi vi ennå ikke har vist deg hvordan du viser sonene til tilpassede widgeter WordPress.

Dette er hva vi vil gjøre i dette trinnet.

Her er også en liste over deg 5 Kritiske WordPress-plugins for å øke inntektene til bloggen din

Du må redigere filen header.php I WordPress-temaet ditt, og legg til denne koden der du vil vise widgetene.


 
 
 
 

Ikke glem å lagre endringene.

Du kan deretter besøke nettstedet ditt, og du vil se tekstwidgeten i overskriften.

demo-side i tankene

Resultatet vil ikke nødvendigvis være det mest attraktive. Derfor trenger du CSS slik at den vises riktig.

3 Trinn: Gi stil til CSS-overskriftene dine

Avhengig av WordPress-temaet, må du legge til litt CSS-kode for å kontrollere hvordan toppteksten og widgetområdet vises.

En av de enkleste måtene å gjøre dette på er ved å bruke CSS Hero. Sistnevnte lar deg bruke et intuitivt brukergrensesnitt for å endre CSS for et WordPress-tema.

Vi anbefaler deg også å oppdage dette Hva kan du gjøre med den gule blyanten WordPress-plugin?

Hvis du ikke vil bruke en plugin, kan du legge til tilpasset CSS til ditt WordPress-tema ved å gå til " Utseende »Tilpass Å tilpasse WordPress-temaet.

Les også artikkelen vår om 10 WordPress-plugins for å forbedre trafikken til en blogg

Dette lar deg vise WordPress Customizer-grensesnittet. Du må klikke på " Tilleggs CSS '.

ekstra css WorDPress

Fanen « Ekstra CSS I " Customizer Lar deg legge til din tilpassede CSS mens du ser på endringene i forhåndsvisningen til høyre.

Av grunner som følger med denne opplæringen, antar vi at du vil bruke dette området til å legge til en enkelt widget for å vise bannerannonser, eller en egendefinert menywidget.

Her er et eksempel på CSS for å komme i gang:

div # header-widget-område {bredde: 100%; background-color: #f7f7f7; nedre kant: 1px fast #eeeeee; tekst-Justering: center; } H2.chw-tittel {margin-top: 0px; tekst-Justering: venstre; text-transform: store bokstaver; font-size: liten; background-color: #feffce; bredde: 130px; padding: 5px; }

Slik viser den tilpassede widgeten vår på Twenty Seventeen temaoverskriften.

demo tema tjue sytten wordpress

Oppdag også noen premium WordPress-plugins  

Du kan bruke andre WordPress plugins for å gi et moderne utseende og for å optimalisere håndteringen av bloggen eller nettsiden din.

Vi tilbyr deg her noen premium WordPress-plugins som vil hjelpe deg å gjøre det.

1. Smart4y Tooltip

Smart4y Tooltip er en WordPress Plugin fleksibelt verktøy dedikert til å lage moderne verktøytips uten noen avhengighet av Javascript-biblioteket. Den er fullstendig responsiv og gir mulighet for å sette inn HTML-innhold.

Smart4y Tooltip Responsiv WordPress-plugin

Dets WYSIWYG-redigeringsprogram lar deg visuelt lage hver verktøytips uten å måtte oppgi noen kode, men hvis du er villig, kan du alltid gjøre det.

Oppdag også vår 10 WordPress plugins for å evaluere artikler fra bloggen din

Dens andre funksjoner er: Byggesidesupport, et ganske responsivt oppsett, muligheten til å definere globale parametere for alle verktøytips eller å definere spesifikke parametere for hver verktøytips, støtte for forhåndsdefinerte visuelle effekter, beregning av plassering av verktøytips i det endrede vinduet, detaljert dokumentasjon osv.

Last ned | Demo | Webhotell

2. rettferdig

Le WordPress Plugin Justified er en responsiv galleriplugin som justerer miniatyrbildene dine i et justert rutenett ved å bruke jQuery, som på Flickr. 

Justified-plugin for WordPress-fotografer,

Det gir funksjoner som skiller galleriene dine fra konkurrentene!

Hovedfunksjonene er: responsiv layout, spesielle flyover-effekter, automatisk justering av nettet,  en kortkodeditor, utseende ehelt tilpassbar, støtte fra pseere og mange andre…

Last ned | dEMO | Webhotell  

3. Planlegg e-post

ce WordPress Plugin som navnet tilsier lar deg planlegge e-postpublisering på nettstedet ditt. Det er en del av "Følg mitt blogginnlegg" WordPress-plugin-utvidelsene. Planlegg e-post Følg blogginnlegget wordpress plugin

Du vil nå kunne planlegge publiseringen av e-postene dine i henhold til timer, dager eller uker.

Les også artikkelen vår om 10 WordPress plugins for å bruke kart på nettstedet ditt

Det gir muligheten til å sende en kombinert e-post for alle varsler i stedet for hver e-post for hvert varsel, og gjør det også mulig å definere forskjellige e-postmaler for forskjellige e-postmeldinger, til slutt for å gjøre mottakelsen av e-postene dine mer fordøyelig. .

Last neddEMO |Webhotell

Anbefalte ressurser

Finn ut om andre anbefalte ressurser for å hjelpe deg med å bygge og administrere nettstedet ditt.

konklusjonen

Det er det! Det er alt for denne opplæringen, jeg håper det vil hjelpe deg å legge til et widget-område i overskriften på WordPress-temaet ditt. Ikke nøl med å del med vennene dine på dine favoritt sosiale nettverk

Du vil imidlertid også kunne konsultere våre ressources, hvis du trenger flere elementer for å gjennomføre prosjektene dine med oppretting av nettsteder, ved å konsultere vår guide om WordPress blog oppretting.

Hvis du har forslag eller kommentarer, kan du la dem ligge i seksjonen vår commentaires.

...