WordPress är ett robust innehållshanteringssystem som driver över hälften av alla webbplatser på internet. Den inbyggda CRM gör det enkelt för en att skapa en webbplats även om du aldrig har skrivit ett datorprogram förut. Även om det är så enkelt att visa ett block med normal text på en WordPress-webbplats, kan detsamma inte sägas om datorkod. En bit kod måste visas på ett adekvat sätt för att tittarna ska kunna analysera och förstå den. Och det är där WordPress-kodblock kommer in.
Om du vill veta hur du använder kodblock i WordPress har du kommit till rätt ställe. I den här artikeln går vi igenom hela processen så att du kan börja dela kodavsnitt med dina läsare. Fortsätt läsa för att ta reda på mer.
Hur man använder kodblock i WordPress
Att visa ett datorprogram som en vanlig webbsidestext kan vara katastrofalt. Många användare kommer att ha svårt att visualisera och förstå. Lyckligtvis har många WordPress-redigerare en kodblocksfunktion som låter dig visa ett datorprogram i ett kodformat.
Lyckligtvis är det relativt enkelt att använda kodblock för att visa datorkod. För att komma igång måste du byta till den inbyggda WordPress-redigeraren eftersom vissa textplugin kanske inte har funktionen. När du har gjort det, följ dessa steg för att lägga till ett kodblock på en webbplatssida:
- Öppna webbsidan du vill lägga till ett kodblock till genom att klicka på knappen 'Ny'.
- Skriv in '/code' och tryck på 'Enter'.
- Skriv eller klistra in koden du vill ska visas och tryck på 'Enter'.
- Du kan vidare använda kodblockets verktygsfält för att anpassa utseendet på koden du just har skrivit. Du kan till exempel använda 'B'-knappen för att göra en rad fetstil eller 'i'-knappen för att kursivera den.
- När du är klar med att skapa din webbsida klickar du på knappen 'Förhandsgranska' för att se hur kodblocket kommer att se ut i en liveversion.
- Om du är nöjd med de slutliga resultaten, tryck på knappen 'Uppdatera' för att andra också ska se kodblocket.
Hur man ändrar typografin för ditt kodblock
Typografi säger mycket och kan göra eller bryta estetiken hos inte bara ditt kodblock utan även hela webbsidan. För att ändra typografin för ditt kodblock, följ dessa steg:
- Markera kodblocket vars typografi du vill ändra.
- Klicka på ikonen 'Inställningar' i det övre högra hörnet av skärmen.
- Ange din föredragna typografi under avsnittet 'Typografi'.
- Klicka på knappen 'Uppdatera' för att spara ändringarna.
Du kan ytterligare anpassa blockets estetik genom att ändra färg, bakgrund, bokstavsavstånd och radavstånd.
Om du till exempel har en webbplats med mörkt tema kanske du också vill att ditt kodblock ska ha en annan bakgrund.
Windows 10 startknapp svarar inte
Hur man tar bort ett kodblock i WordPress
Kodblockeringar är inte permanenta och precis som alla andra delar av en WordPress-webbsida kan du ta bort dem. Så här går du tillväga för processen:
- Öppna webbsidan eller inlägget som har kodblocket du vill ta bort.
- Klicka på kodblocket du vill ta bort för att markera det.
- På widgeten som dyker upp högst upp i kodblocket klickar du på de tre prickarna.
- Från alternativen väljer du 'Ta bort kod.'
Ovanstående åtgärd bör ta bort hela kodblocket från webbsidan. Alternativt kan du helt enkelt välja blocket och trycka på 'Delete'-tangenten. Du kan också trycka på tangenterna 'Ctrl' + 'Shift' + 'Z' samtidigt och det bör ge samma resultat.
Hur man redigerar ett redan publicerat kodblock
Då och då kan du göra fel. Du kanske också snubblar på ett bättre sätt att utföra idén genom kod. WordPress låter dig redigera redan befintliga kodblock genom att följa instruktionerna nedan:
- Öppna sidan som har kodblocket du vill redigera.
- Klicka på 'Redigera'.
- Klicka på kodblocket för att aktivera kodredigering.
- När du är klar med ändringarna klickar du på knappen 'Uppdatera'.
Hur man lägger till ett kodblock på din WordPress-webbplats med hjälp av ett plugin
Om du ofta lägger till kodavsnitt på din webbplats kan det vara bäst att skaffa ett mer robust plugin som hjälper dig. Ett populärt kraftfullt och utmärkt kodblock är SyntaxHighlighter Evolved plugin.
Detta plugin har en fördel jämfört med den inbyggda WordPress Editor eftersom:
- Det markerar antalet rader i ett kodavsnitt
- Den stöder flera programmeringsspråk
- Det låter dina tittare kopiera och klistra in den visade koden
Så här använder du plugin-programmet för att hantera kodavsnitt på din webbplats bättre:
- Installera och aktivera SyntaxHighlighter Evolved plugin.
- Öppna sidan eller inlägget om du vill lägga till ett kodblock.
- Aktivera redigering och klicka på plusknappen.
- Sök efter 'SyntaxHighLighter Evolved' och öppna det första resultatet som kommer upp.
- Klistra in eller skriv koden i det tillgängliga kodblocket.
- Klicka på inställningsikonen i det övre högra hörnet av skärmen och navigera till fliken 'Blockera'.
- Ange hur du vill att din numrering ska se ut och vilka kodrader du vill ska markeras.
- Du kan också aktivera 'Gör webbadresser klickbara' om du vill göra din kod klickbar.
För att ändra färg- och formateringsschemat för ditt kodblock, följ dessa steg:
- Gå till 'Inställningar' och navigera till avsnittet 'SyntaxHighlighter'.
- Ändra temat för ditt block.
- Tryck på 'Spara' och 'Förhandsgranska' för att förhandsgranska hur ändringarna kommer att se ut i live-läge.
Ytterligare vanliga frågor
Hur gör man en kodblockering till en klickbar länk?
varför finns det bara ett snapchat-filter
För att få en kod att blockera en länk med WordPress-redigeraren, följ dessa steg:
1. Välj den kodrad du vill ska fungera som länk.
2. Välj länkikonen i popup-widgeten. Alternativt kan du trycka på tangenterna 'Ctrl' + 'K' på ditt tangentbord.
byta namn på alla filer i en mapp
3. Ange webbadressen som du vill att koden ska länka till och tryck på 'Enter'.
Kan jag markera kod med kodblockredigeraren som WordPress-redigeraren tillhandahåller?
Nej, kodblocket som tillhandahålls av den inbyggda WordPress-redigeraren tillåter inte användare att kopiera och klistra in koden. För att göra det behöver du hjälp av en avancerad kodblocksredigeringsplugin som 'SyntaxHighligher Evolved'-plugin.
Har Elementor en kodblocksfunktion?
Elementor är ett populärt dra-och-släpp-plugin som används för att bygga WordPress-webbplatser. Tyvärr, om du använder plugin för att skapa webbplatser, hittar du inte ett block som låter dig formatera datorprogram på din webbplats. Därför måste du byta till den konventionella WordPress-redigeraren för att slutföra uppgiften.
Få din webbplats igång
Oavsett om du driver en programmeringsblogg eller helt enkelt gillar att dela kodavsnitt på din webbplats, är det superviktigt att veta hur man använder kodblock i WordPress. Kodblock kommer att ge dina läsare en enkel tid och totalt sett öka din webbplats användarupplevelse. Och som du kan se är att infoga kodblock en relativt enkel process, speciellt med den inbyggda WordPress-redigeraren.
Har du testat att använda kodblocken som WordPress tillhandahåller? Vad sägs om plugin-programmet SyntaxHighlighter Evolved? Vänligen dela din upplevelse med oss i kommentarsfältet nedan.
