Ser din webbplats tillräckligt tilltalande ut för besökarna? Eller är det bara en vanlig webbplats bland miljontals andra! Vill du att din webbplats ska sticka ut från mängden? Vill du att varje sida på din webbplats ser distinkt ut med en annorlunda känsla? Vad händer om jag säger att nyckeln till lösningen på alla dessa problem ligger i dina egna händer? Och den nyckeln är – Custom Header!! Ja, du läste rätt. Låt oss se hur…

En rubrik är det viktigaste visuella elementet på din webbplats som intar den översta positionen. Det är det första en besökare ser när han eller hon landar på din webbplats. Huvudet på din webbplats är din webbplats identitet som förblir densamma på alla webbplatsens sidor. Du kan använda den för att skapa ett bra och långvarigt intryck hos besökarna. Du kan sticka ut och vinna användarens förtroende genom att skapa anmärkningsvärda självporträtterande anpassade rubriker. En anpassad rubrik i WordPress är en funktion som gör att du kan anpassa rubrikbilden och lägga till text, widget etc. i den. Du kan också justera dessa element enligt dina behov för att presentera den bästa bilden av din webbplats. Här på Templatetoaster hemsida builder programvara, kontrollera hur man skapar anpassad rubrik med WordPress tema builder.

WordPress Custom Header: Varför behöver du egentligen en?

Headern är ett av de viktigaste elementen på din webbplats. Det är en gest som förmedlar mycket om din webbplats. Vanligtvis innehåller den en bild eller video för att fånga besökarens uppmärksamhet. Enligt Nielsen Norman-gruppen stannar en besökare bara i 10-20 sekunder på din webbplats. Så rubriken bör vara tilltalande för att intressera dem.

En anpassad rubrik i WordPress ger dig mer kontroll och flexibilitet. Du kan rotera, ändra storlek eller beskära en headerbild utöver omplacering av logotyp, text eller widgets. Du kan utforma den så att den står i kontrast till din webbplats utseende. Du måste använda den som ett förslag till målgruppen. Försök att citera din tagline i den anpassade rubriken i WordPress. Eftersom du kanske inte har en andra chans att göra det första goda intrycket. En välstrukturerad rubrik bör svara på varför du är unik, vad är allt som din webbplats har för funktioner etc.

Så, en anpassad rubrik är viktig eftersom den fungerar som ansiktet på din webbplats. Den ska kunna kommunicera kärnan och stämningen på din webbplats till publiken. Du kan ha en annan WordPress anpassad rubrik per sida. Du kan till exempel lägga till funktioner för din produkt i rubriken för sidan Om oss och resten av sidorna utan funktioner. Det kan göra underverk!!

Hur man lägger till en anpassad rubrik i WordPress?

De förvalda WordPress-teman tillåter dig att använda anpassade rubriker. Du kan lägga in dina egna anpassade headerbilder enligt dina önskemål. Att ställa in en WordPress anpassad headerbild kräver några ansträngningar. Det innebär i princip två steg för att lägga till en anpassad rubrik till standard WordPress-teman enligt följande

1. Källa och redigera din bild

Först av allt ska du välja en lockande bild. Den ska vara enkel och unik. Du kan få tag på massor av gratis bilder på internet. För mer information kan du läsa om 16 webbplatser för att få gratis bilder. När du har källan till din headerbild är det bara att redigera den.

Du kan använda några av de användbara datorredigeringsverktygen eller webbaserade kostnadsfria redigeringsverktygen. Du kan föryngra den valda bilden med GIMP, paint.net osv. GIMP är ett gratis bildredigeringsprogram med öppen källkod. Det ger dig många sofistikerade verktyg för att ge din bild en speciell touch. Medan paint.net underlättar redigeringsverktyg för bilder i Windows. Få din anpassade WordPress-bild för rubriken klar.

2. Ladda upp den anpassade rubriken

För att ladda upp rubriksbilden loggar du in på din WordPress-instrumentpanel. Från den vänstra rutan navigerar du till Utseende → Rubrik.

Det kommer att öppna en rubrik för rubrikmedia till vänster på skärmen. Gå till Header Image och klicka på Add New Image-knappen.

Det kommer att öppna bildgalleriet där du kan välja bild. Du kan också bläddra bland dina egna bilder här. Välj bilden och beskär den om det behövs. Ange den som den anpassade rubrikbilden. Du är klar.

Hur man anpassar rubriken i WordPress?

När du har laddat upp den anpassade rubrikbilden för WordPress-temat kan du redigera den för att lägga till video, text, widgetar, sociala ikoner etc. Du kan använda vilket standardtema som helst i WordPress. Här får du exempelkod för att redigera anpassad rubrik i Twenty Seventeen-temat.

1. Lägg till ett textområde i rubriken

Med standardtemat kan du bara ändra webbplatsens titel. Men för att lägga till ett textområde måste du skriva lite kod i filen header-image.php. Du lägger till följande kod för att få ett textområde i rubriken

När du lagt till den här koden kommer du att se ett separat textområde i rubriken som visas nedan

2. Lägg till sociala ikoner

För att lägga till sociala ikoner i rubriken lägger du till följande kod i site-branding.php efter wrap class.

Du måste också ange CSS om du vill styla sociala ikoner i din egen unika stil.

Det kommer att ge dig de önskade resultaten som visas

3. Lägg till en widget i rubriken

Om du vill ha några widgetar för att visa upp din webbplats definierar du en funktion i filen function.php. Du kan lägga till den här koden i slutet av filen.

När du har gjort det lägger du till den här HTML-koden i filen header-image.php för att visa den specifika widgeten på frontend.

Nu flyttar du till Appearance → Widgets. Härifrån kan du lägga till vilken widget som helst till din anpassade headerposition. Till exempel läggs widgeten Search till genom att helt enkelt dra den till Custom Header position.

Den resulterande rubriken kommer att se ungefär så här ut

4. Omplacera logotypen

Du kan lägga till en logotyp till standardalternativen för WordPress. Navigera till utseende → rubrik → rubrikmedia → avsnittet logotyp. Här ställer du in en logotyp genom att klicka på alternativet Välj logotyp.

Men för att omplacera den måste du skriva ytterligare CSS. I Twenty Seventeen-temat får du som standard en logotyp i nedre vänstra position som visas nedan

Här ser du ett exempel på CSS för att lägga till logotypen i mitten. På samma sätt kan du ställa in den var som helst i rubriken.

.custom-logo-link {padding-right: 2em;position: absolute;left: 500px;top: 0px;}

5. Lägg till video i rubriken

Slutligt kan du också lägga till en video i din WordPress-rubrik. Tack och lov behöver du inte lägga till kod för detta. WordPress ger dig ett standardalternativ för att lägga till video eller bakgrundsbild.

För att lägga till video i rubriken navigerar du till Appearance → Header → Header Media → Header Video. Här klickar du på knappen Välj video som visas nedan. Därefter kan du bläddra till den video som du vill ha i rubriken från din dator. Alternativt kan du också ange videons URL om den finns online. Publicera den bara.

Din Header Video kommer att se ut så här

På samma sätt kan du lägga till en bakgrundsheaderbild genom att välja en Header Image från Header Media-avsnittet.

Du kan ha olika WordPress-anpassade header per sida, t.ex. en del med bakgrundsbild, en del med video eller widgetar osv. Allt beror på ditt val och din kreativitet.

Hur man skapar en anpassad rubrik i WordPress från början med TemplateToaster?

Du bör ha goda kunskaper i PHP, HTML, CSS för att arbeta med mallfiler. Om du är nybörjare och inte vet hur man skriver kod kan du förlita dig på TemplateToaster WordPress Theme Builder. Du behöver ingen kodning för att skapa en anpassad WordPress-huvudmall. Bara några klick för att dra & drop-gränssnittet och du är redo med din anpassade rubrik. Låt oss se hur du lägger till anpassad rubrik till WordPress med TemplateToaster

Först av allt, ladda ner och installera TemplateToaster website builder. När du har installerat den framgångsrikt kommer du att få CMS-valskärmen som visas nedan. Välj WordPress här

Därefter får du nästa skärm där du kan skapa en mall från grunden eller använda en exempelmall. Du väljer Start from Scratch och klickar på Modify.

Därefter kommer du att omdirigeras till programvarans huvudgränssnitt där du kan börja designa din anpassade rubrik.

1. Anpassad rubrik i full bredd

Du får upp programvarans huvudgränssnittsskärm som visas nedan. Härifrån kan du ställa in en fullbreddsrubrik. Gå till Header → Width → Full Width.

2. Omplacera logotypen

Från fliken Header klickar du på alternativet Logo. Det kommer att öppna ett galleri med logotypikoner. Du kan välja en logotypbild från exempelbiblioteket eller bläddra bland dina egna anpassade bilder. Logotypen ställs in.

När du dubbelklickar på logotypbilden öppnas en Format-flik som visas nedan. Härifrån kan du ge en länk till logotypbilden eller ställa in dess position. Du kan flytta positionen genom att ange anpassade vänster- och toppositioner eller välja en positionsgenväg. Här har till exempel en vertikal-centrisk position valts för logotypen.

3. Lägga till bakgrundsbild

Du väljer bakgrundsalternativet från fliken Header för att ställa in en bakgrundsbild för rubriken. Det kommer att öppna ett bildgalleri. Du kan också bläddra bland dina egna anpassade headerbilder från alternativet Fler bilder.

På samma sätt kan du lägga till en förgrundsheaderbild genom att klicka på Bildalternativet från fliken Header.

4. Lägg till textområde i Header

Om du vill visa tagline och relevant information i headern kan du använda ett textområde. I textområdet kan du lägga till vanlig text, knapp, lista osv. Klicka på alternativet Textområden.

Lägg till innehåll och styla det genom att dubbelklicka. Eftersom ett dubbelklick öppnar en Editor-flik för att redigera innehållet.

5. Lägg till widget i rubriken

Du kan lägga till ett widgetområde i rubriken med ett enda klick. Gå till fliken Widget Areas och klicka på Widget Areas → Header-alternativet. Du kan också ställa in typografi för den här widgeten och kan flytta den var som helst i rubriken bara genom att dra den. Du kan lägga till innehåll i den efter export.

6. Lägg till sociala ikoner i rubriken

Att lägga till ikoner för sociala medier i rubriken är väldigt enkelt. På fliken Header klickar du på alternativet Social Icons (sociala ikoner). Då öppnas ett galleri med sociala ikoner där du kan välja en bild enligt dina behov. Du kan också bläddra bland dina egna ikoner här.

Alla ikoner för sociala medier finns tillgängliga här. Du kan behålla ikoner enligt dina behov. Du lägger in ikoner för sociala medier på Facebook, Twitter och Google + här.

7. Lägga till video i rubriken

För att lägga till en video klickar du på alternativet Lägg till video. Härifrån kan du enkelt ladda upp en bakgrundsvideo till rubriken.

Slutord

Nu har du lärt dig hur du skapar en anpassad rubrik i WordPress. Det kommer definitivt att förändra utseendet på din webbplats. Vilken lösning du väljer är helt och hållet ditt val. Förhoppningsvis gillade du inlägget. Om du har frågor kan du skriva i kommentarsfältet nedan.

Relaterad läsning: Hur man kontrollerar WordPress version

Hur man hittar WordPress inloggningsadress

Hur man installerar WordPress

Hur man installerar WordPress

Hur man kontrollerar WordPress version

Hur man hittar WordPress inloggningsadress

Hur man hittar WordPress inloggningsadress

Hur man installerar WordPress tema är det

Hur man ändrar WordPress språk

Hur man skapar WordPress anpassad inloggningssida

Hur man skapar WordPress tema från början

Hur man fixar WordPress siduppdatering fungerar inte