Trusted WordPress tutorials, when you need them most.
Beginner’s Guide to WordPress
WPB Cup
25 Million+
Websites using our plugins
16+
Years of WordPress experience
3000+
WordPress tutorials
by experts

Så här add to syntaxmarkering i WordPress Comments

Vill du add to syntaxmarkering i WordPress comments?

Som standard levereras WordPress inte med någon syntaxmarkering för comments, posts eller pages. Detta kan vara ett stort problem om du skriver artiklar om kodning eller programmering på din WordPress website.

I den här artikeln visar vi dig hur du enkelt kan add to syntaxmarkering i WordPress comments.

Adding syntax highlighting in WordPress comments

Varför och när behöver du syntaxmarkering i WordPress Comments?

Syntaxmarkering är ett sätt att få kod att se bättre ut och bli lättare att förstå. Det adderar färger och radnummer till code snippets, vilket gör dem mer läsbara. Här är ett exempel:

<html>
    <head>
        <title>My Awesome Website</title>
    </head>
    <body>
        <h1>Welcome to My Homepage</h1>
    </body>
</html>

Om du har en WordPress blogg om webbutveckling eller kodning är det viktigt att aktivera syntaxmarkering i WordPress kommentarer. På så sätt kan läsare enkelt skriva kod på ett läsbart sätt.

Detta kommer att uppmuntra dem att lämna fler kommentarer och dela sina egna snippor. Det gör inte ej bara kommentarerna mer intressanta utan bygger också upp en känsla av engagemang i samhället.

Dessutom, om dina läsare behöver hjälp, kan de enkelt infoga koden i kommentaren på ett sätt som är visuellt tilltalande och lätt att förstå för de andra kommentatorerna.

Med detta i åtanke, låt oss se hur du kan add to syntaxmarkering i formuläret för comments på din WordPress website.

Step 1: Installera tillägget Syntax Highlighter Evolved

Det enklaste sättet att add to syntaxmarkering i WordPress är med pluginet Syntax Highlighter Evolved. Det är superenkelt att använda och aktiverar dig att aktivera syntaxmarkering i WordPress-poster, pages och comments.

På WPBeginner använder vi detta plugin för att inserta och displaya code snippets. Du kan läsa vår artikel om varför vi använder Syntax Highlighter Evolved för mer detaljer.

Först måste du installera och aktivera pluginet Syntax Highlighter Evolved. För mer information, se vår Step-by-Step guide om hur du installerar ett WordPress plugin.

När du har gjort det kan du nu editera ett post eller en page och add to kod med hjälp av syntax highlighter. Så här ser det ut i block editor:

SyntaxHighlighter block settings

Du kan lära dig mer om hur du använder pluginet Syntax Highlighter Evolved i vår artikel om hur du visar kod i WordPress.

Som standard tillåter Syntax Highlighter Evolved besökare att add to kod i sina comments, men den koden måste omslutas av shortcodes.

Dessa shortcodes är namngivna efter all populära programmerings- och skriptspråk. Detta innebär att den som kommenterar bara behöver omsluta sin kod med hakparenteser som innehåller språknamnet.

Om du till exempel vill posta en comment som innehåller PHP-kod, skulle du använda följande:

Hi everyone. I need help with this PHP code: [php]

<?PHP

private function get_time_tags() {

$time = get_the_time('d M, Y');

return $time;

}

?>

[/php]

På samma sätt, om du vill posta en HTML-kod som en comment, måste du omsluta den med HTML shortcode:

Hey there! Could anyone check this code snippet? [html]<a href="https://example.com">Demo website>/a>[/html]

Nu, vad som gör detta knepigt är att användare inte vet att de faktiskt kan använda syntaxmarkering med dessa shortcodes. Så du måste låta dem veta genom ett notice-meddelande.

Step-by-Step 2: Add to en notice för syntaxmarkering i formuläret Comment

För att informera kommentatorer om funktionen för syntaxmarkering måste du lägga till ett notice-meddelande ovanför ditt kommentarformulär, gillar så här:

Adding syntax highlighter notice before comment field

Du kan göra detta genom att lägga till ett eget code snippet på din WordPress site.

Om du läser den här tutorialen för att du har en kodningsblogg, är du troligtvis ganska bekväm med kodning.

Trots det kan det vara svårt för de mest avancerade användarna att hålla all sina code snippets under uppsikt. Om de inte hanteras korrekt kan du uppleva några vanliga WordPress error eller förstöra din site helt och hållet.

Det är därför vi rekommenderar att du använder WPCode för att infoga anpassade code snippets. Det är det enklaste och säkraste sättet att add to custom code i WordPress utan att behöva edit några core WordPress-filer.

Obs/observera : Även om den gratis versionen av WPCode är available rekommenderar vi att du använder Pro-versionen av WPCode eftersom den ger dig tillgång till smart villkorlig logik, tillgång till ett molnbibliotek med code snippets och mycket mer.

Det första du behöver göra är att installera och aktivera pluginet WPCode. För mer detaljer, se vår Step-by-Step guide om hur du installerar ett WordPress plugin.

Efter aktivering, head över till Code Snippets ” Add Snippet.

Adding a code snippet using WP Code

Here, you will see all of the ready-made snippets that you can add to your WordPress website.

Eftersom vi vill lägga till vårt eget snippet, hoverar du över ”Add Your Custom Code” och klickar sedan på ”Use snippet”.

Creating a custom code snippet using WP Code

Börja med att enter en titel för det anpassade code snippet. Det kan vara vad som helst som hjälper dig att identifiera snippet.

Därefter öppnar du dropdown ”Code Type” och väljer ”PHP Snippet”.

Adding a custom PHP snippet

Nu klistrar du bara in följande snippet i code snippets editor:

function wpbeginner_comment_text_before($arg) {
    // Add a custom notice to inform users about using shortcodes for syntax highlighting
    $arg['comment_notes_before'] .= "<p class='comment-notice'>You can use shortcodes for syntax highlighting when adding code. For example,  or </p>";
    
    // Return the modified comment arguments
    return $arg;
}

// Add the filter to apply the custom comment modification function
add_filter('comment_form_defaults', 'wpbeginner_comment_text_before');

Därefter öppnar du dropdown ’Location’ och klickar på ’Run Everywhere’.

Inserting the PHP snippet across your website

Sedan är du redo att rulla högst upp på vyn och klicka på ”Inaktiverad” toggle så att den ändras till ”Aktiv”.

Slutligen klickar du på ”Save Snippet” för att göra snippet live.

Saving your PHP snippet

Den här koden visar helt enkelt en notice ovanför kommentarsfältet i WordPress kommentarformulär. Du kommer dock inte att se den här texten när du är inloggad på ditt account, så du måste öppna ett nytt fönster i webbläsaren i inkognitoläge eller logga ut från ditt account.

Om du vill se om shortcoden faktiskt fungerar, besök bara din website i inkognitoläge, kommentera ett blogginlägg och använd shortcoden. När kommentaren har granskats och approves bör du se något som gillar detta:

Example of a comment using syntax highlighter

Learn More Sätt att öka engagemanget för comments

Att lägga till syntaxmarkering capability är inte bara det enda sättet att öka ditt comment engagement om du har en blogg för webbutvecklare.

Ett annat tips är att add to likes och dislikes till dina comments. På så sätt kan dina läsare enkelt uttrycka sina expressioner om specifika comments. Det kan sätta igång diskussioner och lyfta fram värdefulla bidrag från your community.

Du kan också meddela användare när de får svar på sina kommentarer. Detta säkerställer att de förblir engagerade i konversationen och får dem att komma tillbaka för mer.

Dessutom kanske du vill add to custom fields till formuläret för comments. Det kan du göra om du vill att läsarna ska ge specifik information tillsammans med sina comments, som att de gillar programmeringsspråket de använder eller versionen av ett ramverk.

Här är andra tips som du kan använda för att öka engagemanget för comments:

Vi hoppas att den här artikeln hjälpte dig att add to syntaxmarkering i WordPress comments. You may also want to see our guide on how to add videos and more in WordPress comments and our expert picks for the best WordPress comment plugins.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

Avslöjande: Vårt innehåll stöds av våra läsare. Det innebär att om du klickar på några av våra länkar, kan vi tjäna en provision. Se hur WPBeginner finansieras, varför det är viktigt, och hur du kan stödja oss. Här är vår editoriala process.

Avatar

Editorial Staff at WPBeginner is a team of WordPress experts led by Syed Balkhi with over 16 years of experience in WordPress, Web Hosting, eCommerce, SEO, and Marketing. Started in 2009, WPBeginner is now the largest free WordPress resource site in the industry and is often referred to as the Wikipedia for WordPress.

Den ultimata WordPress-verktygslådan

Få GRATIS tillgång till vår verktygslåda - en samling WordPress-relaterade produkter och resurser som varje professionell användare bör ha!

Reader Interactions

6 kommentarerLämna ett svar

  1. Syed Balkhi says

    Hey WPBeginner readers,
    Did you know you can win exciting prizes by commenting on WPBeginner?
    Every month, our top blog commenters will win HUGE rewards, including premium WordPress plugin licenses and cash prizes.
    You can get more details about the contest from here.
    Start sharing your thoughts below to stand a chance to win!

  2. Jiří Vaněk says

    Thank you for demonstrating the possibility using a snippet. I already have quite a lot of plugins on the site that I need to run it and at the same time, since I have a technology blog, I wanted to allow users to highlight codes in comments. I use WP Code for other snippets that have an important role on the website, so the possibility to do this with a snippet is very useful. Thank you once again, I will save the snippet to my code library for other sites as well.

Lämna ett svar

Tack för att du väljer att lämna en kommentar. Tänk på att alla kommentarer modereras enligt våra policy för kommentarer, och din e-postadress kommer INTE att publiceras. Vänligen använd INTE nyckelord i namnfältet. Låt oss ha en personlig och meningsfull konversation.