Hur man redigerar HTML i WordPress kodredigerare (nybörjarguide)

Letar du efter mer kontroll över din WordPress-webbplats design och funktion? Att lära sig redigera HTML är svaret.

HTML (HyperText Markup Language) är koden som strukturerar ditt innehåll och talar om för webbläsare hur de ska visa dina sidor. Att redigera den direkt är användbart för avancerad anpassning, att lägga till specifik funktionalitet och för felsökning.

Vi hör ofta från användare på WPBeginner som är nervösa för att röra vid kod, men att redigera HTML inom WordPress är enklare än du kanske tror.

I den här artikeln visar vi dig hur du redigerar HTML i WordPress kodredigerare med flera olika metoder.

Varför ska du redigera HTML i WordPress?

WordPress erbjuder tusentals teman och plugins för att ändra utseendet på din webbplats och anpassa olika element utan att röra en enda kodrad.

Plugins och teman har dock sina begränsningar och kanske inte erbjuder exakt de funktioner du letar efter. Som ett resultat kanske du inte kan styla din webbplats på det sätt du vill att den ska se ut.

Det är här redigering av HTML verkligen är användbart. Du kan enkelt utföra avancerad anpassning med HTML-kod. Det ger mycket flexibilitet och kontroll över hur din webbplats kommer att se ut och fungera.

Dessutom kan inlärning av hur man redigerar HTML också hjälpa dig att identifiera och åtgärda fel på din WordPress-webbplats när du inte har tillgång till instrumentpanelen.

Med det sagt, låt oss titta på olika sätt att redigera HTML i en WordPress-webbplats.

Vi kommer att täcka hur man redigerar HTML med hjälp av blockredigeraren och klassiska redigeraren, och vi kommer också att visa dig ett enkelt sätt att lägga till kod på din webbplats. Du kan klicka på länkarna nedan för att hoppa till din föredragna sektion.

• Hur man redigerar HTML i WordPress blockredigerare
• Hur man redigerar HTML i WordPress klassiska redigerare
• Hur man redigerar HTML i WordPress-widgetar
• Hur man redigerar HTML i WordPress temaredigerare
• Hur man redigerar HTML i WordPress med FTP
• Enkelt sätt att lägga till kod i WordPress

Hur man redigerar HTML i WordPress blockredigerare

I WordPress blockredigerare finns det flera sätt att redigera HTML i ditt inlägg eller din sida.

Först kan du använda ett anpassat HTML-block i ditt innehåll för att lägga till HTML-kod.

För att börja, gå till din WordPress-instrumentpanel och lägg sedan till ett nytt inlägg/en ny sida eller redigera en befintlig artikel. Klicka sedan på plus (+) tecknet i det övre vänstra hörnet och lägg till ett 'Anpassad HTML'-block.

Gå sedan vidare och ange din anpassade HTML-kod i blocket.

Du kan också klicka på alternativet 'Förhandsgranska' för att kontrollera om HTML-koden fungerar korrekt och hur ditt innehåll kommer att se ut på din live-webbplats.

Ett annat sätt att lägga till eller ändra HTML-kod i WordPress blockredigerare är genom att redigera HTML för ett specifikt block.

För att göra det, välj helt enkelt ett befintligt block i ditt innehåll och klicka sedan på menyn med tre punkter. Gå sedan vidare och klicka på alternativet 'Redigera som HTML'.

Du kommer nu att se HTML för ett enskilt block. Fortsätt och redigera HTML för ditt innehåll.

Till exempel kan du lägga till en nofollow-länk, ändra stilen på din text eller lägga till annan kod.

Om du vill redigera HTML i hela ditt inlägg kan du använda 'Kodredigeraren' i WordPress blockredigerare.

Du kan komma åt kodredigeraren genom att klicka på alternativet med tre punkter i det övre högra hörnet. Välj sedan 'Kodredigerare' från rullgardinsmenyerna.

Hur man redigerar HTML i WordPress klassiska redigerare

Om du använder WordPress klassiska redigerare, kan du enkelt redigera HTML i textvyn.

För att komma åt textvyn, redigera helt enkelt ett blogginlägg eller lägg till ett nytt. När du är i den klassiska redigeraren klickar du på fliken 'Text' för att se HTML i din artikel.

Därefter kan du redigera innehållets HTML. Du kan till exempel göra olika ord fetstilta för att framhäva dem, använda kursiv stil i texten, skapa listor, lägga till en innehållsförteckning och mer.

Hur man redigerar HTML i WordPress-widgetar

Visste du att du kan lägga till och redigera HTML-kod i din webbplats widgetområde?

I WordPress kan du använda en anpassad HTML-widget för att anpassa din sidofält, sidfot och andra widgetområden. Du kan till exempel bädda in kontaktformulär, knappar för uppmaning till handling (CTA), Google Maps och annat innehåll.

Du kan börja med att gå till ditt WordPress-administrationspanel och sedan gå till Utseende » Widgets. Klicka sedan på 'Plus'-ikonen i valfritt widgetområde där du vill lägga till HTML-kod.

De tillgängliga widgetområdena beror på den WordPress-tema du använder. Till exempel kanske du kan lägga till det i din sidfot, sidhuvud eller andra områden.

Sök sedan efter widgeten Anpassad HTML i menyn för widgetblock och klicka på den för att automatiskt lägga till den i widgetområdet.

Därefter kan du klicka på din anpassade HTML-widget och ange HTML-koden.

När du är klar, glöm inte att klicka på knappen 'Uppdatera' i det övre högra hörnet av skärmen.

Du kan nu besöka din webbplats för att se den anpassade HTML-widgeten i aktion.

Hur man redigerar HTML i WordPress temaredigerare

Ett annat sätt att redigera din webbplats HTML är via WordPress temaredigerare (kodredigerare).

Vi rekommenderar dock inte att du redigerar koden direkt i temaredigeraren. Minsta lilla misstag när du anger kod kan förstöra din webbplats och blockera dig från att komma åt WordPress-instrumentpanelen.

Dessutom, om du uppdaterar ditt tema, skulle alla dina ändringar gå förlorade.

Med det sagt, om du överväger att redigera HTML med hjälp av temaredigeraren, är det en bra idé att säkerhetskopiera din webbplats innan du gör några ändringar.

Gå sedan till Utseende » Temaredigerare från din WordPress-instrumentpanel. Du kommer nu att se ett varningsmeddelande om att redigera temafiler direkt.

När du klickar på knappen 'Jag förstår' ser du dina temafiler och kod.

Härifrån kan du välja vilken fil du vill redigera och göra dina ändringar.

Hur man redigerar HTML i WordPress med FTP

En annan alternativ metod för att redigera HTML i WordPress-temafiler är att använda FTP, även känt som filöverföringsprotokolltjänst.

Detta är en standardfunktion som följer med alla WordPress-hosting-konton.

Fördelen med att använda FTP istället för kodredigeraren är att du enkelt kan fixa problem med FTP-klienten. På så sätt kommer du inte att vara utelåst från din WordPress-instrumentpanel om något går sönder när du redigerar HTML.

För att börja måste du först välja en FTP-programvara. Vi kommer att använda FileZilla i den här handledningen, eftersom det är en gratis och användarvänlig FTP-klient för Windows, Mac och Linux.

Efter att ha valt din FTP-klient måste du nu logga in på din webbplats FTP-server. Du hittar inloggningsuppgifterna i din webbhotells kontrollpanel.

När du är inloggad ser du olika mappar och filer på din webbplats under kolumnen 'Fjärrplats'. Gå vidare och navigera till dina temafiler genom att gå till wp-content » theme.

Du kommer nu att se olika teman på din webbplats. Fortsätt och välj det tema du vill redigera.

Därefter kan du högerklicka på en temafil för att redigera HTML. Om du till exempel vill göra ändringar i sidfoten, högerklicka då på filen footer.php.

Många FTP-klienter låter dig visa och redigera filen och ladda upp dem automatiskt när du har gjort ändringarna. I FileZilla kan du göra detta genom att klicka på alternativet 'Visa/Redigera'.

Vi föreslår dock att du laddar ner filen du vill redigera till ditt skrivbord innan du gör några ändringar.

Efter att ha redigerat HTML kan du ersätta den ursprungliga filen. För mer detaljer rekommenderar vi att du följer vår guide om hur man använder FTP för att ladda upp filer i WordPress.

Enkelt sätt att lägga till kod i WordPress

Det enklaste sättet att lägga till kod i WordPress är att använda WPCode, det bästa pluginet för kodavsnitt på marknaden.

Teamet på WPBeginner designade detta plugin så att även helt nybörjare kan lägga till anpassad kod på sin webbplats på några minuter. Dessutom finns det en lite-version av pluginet som är 100% gratis att använda.

Det hjälper till att organisera din kod eftersom den lagras på ett ställe. Dessutom förhindrar det fel som kan uppstå när man redigerar kod manuellt.

En annan fördel är att du inte behöver oroa dig för att din kod raderas om du bestämmer dig för att uppdatera eller byta tema.

Det första du behöver göra är att installera och aktivera det kostnadsfria pluginet WPCode på din webbplats. För mer information kan du följa vår detaljerade handledning om hur man installerar ett WordPress-plugin.

När pluginet är aktivt kan du gå till Kodavsnitt » Sidhuvud & Sidfot från din adminpanel.

Därefter kan du lägga till HTML-koden på din webbplats i fälten för sidhuvud, brödtext och sidfot.

Låt oss till exempel säga att du vill visa en varningsruta på din webbplats. Du kan helt enkelt ange HTML-koden i rutan 'Brödtext' och klicka på knappen 'Spara ändringar'.

Dessutom kan du lägga till en Google Analytics-spårningskod, Facebook-pixel och TikTok-annons-pixel i sidhuvudet. Eller så kan du lägga till en Pinterest-knapp i sidfoten på din webbplats med hjälp av pluginet.

Med WPCode är det enkelt att bestämma var koden ska visas. Du kan till exempel automatiskt visa viss HTML-kod i början eller slutet av varje inlägg.

För mer information kan du se vår guide om hur man lägger till kod i sidhuvud och sidfot i WordPress.

Vi hoppas att den här artikeln hjälpte dig att lära dig hur du redigerar HTML i WordPress kodredigerare. Du kanske också vill titta på vår guide om hur du lägger till HTML-formulär i WordPress, eller se de viktigaste anledningarna till varför du bör använda WordPress för din webbplats.

Om du gillade den här artikeln, prenumerera då på vår YouTube-kanal för WordPress-videoguider. Du kan också hitta oss på Twitter och Facebook.