Vill du lägga till en WordPress-widget i rubrikområdet på din webbplats?
Med widgetar kan du enkelt lägga till innehållsblock i angivna delar av ditt WordPress-tema.
I den här tutorialen visar vi dig hur du enkelt kan lägga till en WordPress-widget till rubriken på din webbplats.
Anmärkningar: Detta är en handledning på mellannivå. Du måste lägga till kod i filer med ditt WordPress-tema och behärska vissa CSS.
Men innan någon modifiering upptäck vår 5 Wordpress plugins att säkerhetskopiera din blogg eller Hur man installerar en Wordpress tema et Hur många insticksprogram ska jag installera på Wordpress.
Låt oss sedan gå tillbaka till varför vi är här.
Varför och när måste du lägga till en widget i rubriken?
Med widgets kan du enkelt lägga till innehållsblock till ett visst område i ditt WordPress-tema. Dessa utsedda områden kallas " sidofält "Eller områden med" Widgetar".
Ett widget-område på rubriken kan användas för att visa annonser, nya artiklar eller vad du vill.
Denna speciella domän används på alla populära webbplatser för att visa riktigt viktig information.
Upptäck också Så här lägger du till anpassade widgets efter att du har lagt in på WordPress
Som en generell regel, WordPress-teman lägg till sidofält bredvid innehållet eller i sidfotsområdet. Väldigt få WordPress-teman lägger till widgetområden ovanför innehållet eller i rubriken.
Vi rekommenderar också att upptäcka vårt MailChimp handledning på franska: den kompletta guiden för att skapa ett nyhetsbrev
Det är därför vi i den här tutorialen visar dig hur du lägger till ett widgetområde i rubriken på din WordPress-webbplats.
Steg 1: Skapa ett widgetområde
Först och främst måste vi skapa ett anpassat widgetområde. Detta steg låter dig se ett anpassat widgetområde i " Utseende> Widgets På din WordPress-instrumentpanel.
Du måste lägga till den här koden i filen functions.php Av ditt tema.
funktion 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');
Den här koden sparar ett nytt sidofält eller widget-område i ditt WordPress-tema.
Om du aldrig har installerat WordPress lokalt, ta reda på det Hur man installerar Wordpress lokalt på en PC / Windows med XAMPP
Du kan gå till " Utseende> Widgets Och du kommer att se ett nytt widgetområde markerat " Anpassad Header Widget Area ".
Gå vidare och lägg till en textwidget till det nyskapade området och spara det.
Försök också vår guide för att lägga till widgetar.
Steg 2: Visa din widget i rubriken
Om du besöker din webbplats kommer du inte att kunna se textwidgeten du just har lagt till.
Eftersom vi ännu inte har visat dig hur du visar zonerna för anpassade widgets Wordpress.
Detta är vad vi kommer att göra i detta steg.
Här är också en lista med 5 Kritiska WordPress-plugins för att öka din bloggs intäkter
Du måste redigera filen header.php I ditt WordPress-tema och lägg till den här koden där du vill visa widgetarna.
Glöm inte att spara dina ändringar.
Du kan sedan besöka din webbplats och du kommer att se textwidgeten i din rubrik.
Resultatet blir inte nödvändigtvis det mest attraktiva. Det är därför du behöver CSS så att den visas korrekt.
3 Steg: Ge stil till dina CSS-rubriker
Beroende på ditt WordPress-tema måste du lägga till CSS-kod för att styra hur rubriken och widgetområdet visas.
Ett av de enklaste sätten att göra detta är att använda CSS Hero. Det senare låter dig använda ett intuitivt användargränssnitt för att ändra CSS för ett WordPress-tema.
Vi råder dig också att upptäcka detta Vad kan du göra med det gula pennans WordPress-plugin?
Om du inte vill använda ett plugin kan du lägga till anpassad CSS till ditt WordPress-tema genom att besöka " Utseende »Anpassa För att anpassa WordPress-temat.
Läs också vår artikel om 10 WordPress-plugins för att förbättra trafiken för en blogg
Detta gör att du kan visa WordPress-anpassningsgränssnittet. Du måste klicka på " ytterligare CSS ".
Fliken « Ytterligare CSS I " Customizer Låter dig lägga till din anpassade CSS medan du visar ändringarna i förhandsgranskningen till höger.
Av anledningar tillhörande denna tutorial antar vi att du kommer att använda det här området för att lägga till en enda widget för att visa bannerannonser eller en anpassad menywidget.
Här är ett exempel på CSS för att komma igång:
div # header-widget-område {bredd: 100%; bakgrundsfärg: #f7f7f7; border-bottom: 1px fast #eeeeee; text-align: center; } H2.chw-title {margin-top: 0px; text-align: left; text-trans: versaler; font-size: small; bakgrundsfärg: #feffce; bredd: 130px; padding: 5px; }
Så här kommer vår anpassade widget att dyka upp i tjugo sjutton temahuvud.
Upptäck också några premium WordPress-plugins
Du kan använda andra Wordpress plugins för att ge ett modernt utseende och för att optimera hanteringen av din blogg eller hemsida.
Vi erbjuder dig här några premium WordPress-plugins som hjälper dig att göra det.
1. Smart4y Tooltip
Smart4y Tooltip är en Wordpress plugin flexibelt verktyg dedikerat till att skapa moderna verktygstips utan något beroende av Javascript-biblioteket. Det är fullt responsivt och erbjuder möjligheten att infoga HTML-innehåll.
Dess WYSIWYG-redigerare låter dig visuellt skapa varje verktygstips utan att behöva ange någon kod, men om du är villig kan du alltid göra det.
Upptäck också vår 10 WordPress plugins för att utvärdera artiklar från din blogg
Dess andra funktioner är: Stöd för byggmästarsida, en ganska responsiv layout, förmågan att definiera globala parametrar för alla verktygstips eller att definiera specifika parametrar för varje verktygstips, stöd för fördefinierade visuella effekter, beräkning av positionen för verktygstips i det ändrade fönstret, detaljerad dokumentation, etc….
Ladda ner | Demo | webbhotell
2. motiverade
Le Wordpress plugin Justified är ett responsivt galleriplugin som justerar dina miniatyrer i ett justerat rutnät med jQuery, som på Flickr.
Det ger funktioner som skiljer dina gallerier från konkurrenterna!
Dess huvudfunktioner är: responsiv layout, speciella flyover-effekter, automatisk justering av rutnätet, en kortkodredigerare, utseende ehelt anpassningsbar, stödet från ptittare och många andra…
Ladda ner | demo | webbhotell
3. Schemalägga e-postmeddelanden
ce Wordpress plugin som namnet antyder kan du schemalägga e-postpublicering på din webbplats. Det är en del av WordPress-plugintilläggen "Följ mitt blogginlägg".
Du kommer nu att kunna schemalägga publiceringen av dina e-postmeddelanden efter timmar, dagar eller veckor.
Läs också vår artikel om 10 WordPress plugins för att använda kartor på din webbplats
Det ger möjlighet att skicka ett kombinerat e-postmeddelande för alla aviseringar istället för varje e-postmeddelande för varje avisering och gör det också möjligt att definiera olika e-postmallar för olika e-postmeddelanden, slutligen för att göra mottagningen av dina e-postmeddelanden mer smältbar. .
Ladda ner | demo | webbhotell
Rekommenderade resurser
Ta reda på om andra rekommenderade resurser som hjälper dig att bygga och hantera din webbplats.
- Hur man skapar Excel och Word-dokument på Wordpress
- Hur du anpassar WordPress-logotypen på instrumentpanelen
- Hur man hittar filerna att redigera en Wordpress tema
- Hur du anpassar CSS på din WordPress-webbplats
Slutsats
Det är det! Det här är allt för denna tutorial, jag hoppas att det kommer att hjälpa dig att lägga till ett widgetområde i rubriken på ditt WordPress-tema. Tveka inte att dela med dina vänner på dina favorit sociala nätverk.
Du kommer dock också att kunna konsultera vår medel, om du behöver fler element för att genomföra dina projekt för att skapa webbplatser, genom att konsultera vår guide om WordPress blogg skapande.
Om du har förslag eller kommentarer, lämna dem i vårt avsnitt commentaires.
.
Hej! Jag skulle vilja veta om du har en chans att berätta för mig hur man lägger till en "informationsruta" som liknar den som används här i början av den här artikeln, inklusive de klickbara knapparna bredvid "Ladda ner" och "Kalkylark", layout är mycket trevlig. Tack!
Koden som lägger till header.php fungerar inte
Sir, jag försökte det. Faktum är att widgetsidan matas ut och definierar tillägget av widgets. Och jag lade till det. När steg 2 inte anger koden i php-rubriken. Gissa 2, vad är felet, sir?
I den första koden som visas, som är att generera ett nytt widgetområde, börja med att skriva "funktion", men jag skulle säga att det börjar med "funktion". Egentligen har den här koden flera fel som gör den fel när du skriver den. Jag skulle uppskatta att det korrigerades.
OK.
🙂 Allt är OK, bara ingen i deras råd förklarar var du ska lägga till koden till “functions.php !!! " Det är viktigt! Alla använder de "olika" teman ...
hej,
Tack för dessa stöd.
Jag visste hur jag skulle lägga till mitt sökfält i den personliga rubriken. Å andra sidan, för att anpassa stilen är det mer komplicerat ...
Jag vill ändra storlek, position (att den inte tar hela sidhuvudets bredd) samt bakgrundsfärg.
Merci d'avance.
Hej Thomas,
Det tar lite CSS kunskap för det. Men jag rekommenderar det här utmärkta WordPress-plugin: https://codecanyon.net/item/yellow-pencil-visual-css-style-editor/11322180?ref=voirplusgrand