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 stylar du formuläret för kommentarer i WordPress (Ultimate Guide)

Vill du ändra stilen på WordPress-kommentarformuläret på din webbplats? På WPBeginner har vi i flera år experimenterat med olika sätt att öka användarnas engagemang och vi har kommit fram till att ett snyggt och användarvänligt kommentarsformulär kan göra stor skillnad.

Kommentarer spelar en viktig roll när det gäller att skapa engagemang hos användarna på en webbplats. När du gör det enkelt och visuellt tilltalande för användarna att lämna kommentarer uppmuntrar du till mer diskussion och interaktion på din webbplats.

I den här artikeln visar vi dig hur du enkelt kan utforma formuläret WordPress comment för att öka engagemanget på din website.

Styling WordPress comment form

Innan du kommer igång

WordPress personuppgiftsansvariga teman kontrollerar utseendet på din website. Varje WordPress theme innehåller flera filer, bland annat template-filer, functions-filer, JavaScripts och stylesheets.

Stylesheets innehåller CSS-reglerna för alla element som används av ditt WordPress-tema. Du kan add to din egen custom CSS för att åsidosätta ditt temas stilregler.

Om du inte har gjort det tidigare kan du läsa vår artikel om hur du lägger till custom CSS i WordPress för nybörjare.

Förutom CSS kan du också behöva add to några funktioner för att ändra standard appearance av your WordPress comment form. Om du inte har gjort det tidigare, vänligen se vår artikel om hur du copy and paste kod i WordPress.

Med detta sagt, låt oss ta en titt på hur du stylar formuläret för WordPress comment.

Eftersom det här är en ganska omfattande guide har vi skapat en tabell över innehållet för enkel navigation:

Styling av WordPress Formulär för kommentarer med hjälp av SeedProd Theme Builder

Denna metod kräver SeedProd som är det bästa WordPress page builder och theme builder plugin på marknaden.

Den rekommenderas för Beginnare utan kodningserfarenhet. Nackdelen med den här metoden är dock att den kommer att ersätta ditt befintliga WordPress-tema med ett customze-tema.

Först måste du installera och aktivera SeedProd plugin. För mer detaljer, se vår Step-by-Step guide om hur du installerar ett WordPress plugin.

Note: Du behöver minst planen PRO för att få tillgång till funktionen för temabyggare.

Vid aktivering måste du skapa templates för ditt customize WordPress-tema. SeedProd allow you att enkelt generera dessa templates med hjälp av ett av deras built-in themes.

Detaljerade instruktioner finns i vår tutorial om hur du skapar ett customize WordPress theme utan kodning.

När du har genererat dina temamallar måste du klicka på länken ”Edit Design” under Single Post-mallen.

Edit the single post template

Detta kommer att hämta Preview för enskilda inlägg i SeedProd Theme Builder-gränssnittet. You’ll notice the comment form block at the bottom of the preview.

Edit your comment form in SeedProd

Klicka bara på formuläret för kommentarer så ser du dess egenskaper i den vänstra panelen.

Härifrån kan du lägga till en kommentar eller sekretesspolicy, du kan också byta till fliken ”Avancerat” för att redigera kommentarformulärets stil utan att skriva någon CSS-kod.

Advance styling options for comment form in SeedProd

När du är klar, glöm inte att klicka på knappen ”Spara” för att publicera dina ändringar.

SeedProd gör det superenkelt att ändra stilen på alla element på din website utan att skriva kod.

Det är dock en temabyggare och du kanske redan använder ett WordPress-tema som du gillar. I så fall hjälper dig följande tips att manuellt ändra formulärstilar för comments i WordPress.

Changed Styling av formulär för comments i WordPress

I de flesta teman för WordPress finns det en template som heter comments.php. Den här filen används för att displaya comments och kommentarformulär på dina blogginlägg. Kommentarsformuläret i WordPress genereras med hjälp av funktionen: <?php comment_form(); ?>.

Som standard genererar den här funktionen ditt kommentarsformulär med tre textfält (namn, e-post och webbplats), ett textfält för kommentartexten, en kryssruta för GDPR-efterlevnad och knappen Skicka.

Du kan enkelt ändra vart och ett av dessa fält genom att helt enkelt tweaka standard CSS-klasserna. Under finns en lista över de standard CSS-klasser som WordPress addar till varje formulär för comments.

#respond { }
#reply-title { }
#cancel-comment-reply-link { }
#commentform { }
#author { }
#email { }
#url { }
#comment
#submit
.comment-notes { }
.required { }
.comment-form-author { }
.comment-form-email { }
.comment-form-url { }
.comment-form-comment { }
.comment-form-cookies-consent { }
.form-allowed-tags { }
.form-submit

Genom att helt enkelt tweaka dessa CSS-klasser kan du helt ändra utseendet och känslan av din WordPress comment form.

Låt oss gå vidare och försöka ändra några saker, så att du kan få en bra uppfattning om hur det här fungerar.

Först börjar vi med att markera det aktiva formulärfältet. Att markera det aktiva fältet gör ditt formulär mer tillgängligt för personer med särskilda behov, och det gör också att formuläret för comments ser snyggare ut på mindre devices.

#respond {
background: #fbfbfb;
padding:0 10px 0 10px;
}

/* Highlight active form field */

#respond input[type=text], textarea {
  -webkit-transition: all 0.30s ease-in-out;
  -moz-transition: all 0.30s ease-in-out;
  -ms-transition: all 0.30s ease-in-out;
  -o-transition: all 0.30s ease-in-out;
  outline: none;
  padding: 3px 0px 3px 3px;
  margin: 5px 1px 3px 0px;
  border: 1px solid #DDDDDD;
}

#respond input[type=text]:focus,
input[type=email]:focus,
input[type=url]:focus,
textarea:focus {
box-shadow: 0 0 5px rgba(81, 203, 238, 1);
margin: 5px 1px 3px 0px;
border: 2px solid rgba(81, 203, 238, 1);
}

Så här gillade vi vårt formulär i WordPress Twenty Sixteen Theme efter ändringarna:

Highlight active comment form field

Med hjälp av dessa klasser kan du ändra beteendet för hur text visas i inmatningsboxar. Vi kommer att gå vidare och ändra textstilen för fälten för författarens namn och URL.

#author, #email {
font-family: "Open Sans", "Droid Sans", Arial;
font-style:italic;
color:#1d1d1d;
letter-spacing:.1em;
} 

#url  {
color: #1d1d1d;
font-family: "Luicida Console", "Courier New", "Courier", monospace;
} 

Om du tittar närmare på screenshoten under ser du att fonten för namn- och email-fältet är annorlunda än URL:en för website.

Input styles for WordPress comment form

Du kan också ändra stilen på knappen för att skicka in WordPress kommentarformulär. Istället för att använda standardknappen för att skicka in, låt oss ge den lite CSS3-gradient och box-shadow.

#submit {
background:-moz-linear-gradient(top, #44c767 5%, #5cbf2a 100%);
background:-webkit-linear-gradient(top, #44c767 5%, #5cbf2a 100%);
background:-o-linear-gradient(top, #44c767 5%, #5cbf2a 100%);
background:-ms-linear-gradient(top, #44c767 5%, #5cbf2a 100%);
background:linear-gradient(to bottom, #44c767 5%, #5cbf2a 100%);
background-color:#44c767;
-moz-border-radius:28px;
-webkit-border-radius:28px;
border-radius:28px;
border:1px solid #18ab29;
display:inline-block;
cursor:pointer;
color:#ffffff;
font-family:Arial;
font-size:17px;
padding:16px 31px;
text-decoration:none;
text-shadow:0px 1px 0px #2f6627;
} 

#submit:hover {
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #5cbf2a), color-stop(1, #44c767));
background:-moz-linear-gradient(top, #5cbf2a 5%, #44c767 100%);
background:-webkit-linear-gradient(top, #5cbf2a 5%, #44c767 100%);
background:-o-linear-gradient(top, #5cbf2a 5%, #44c767 100%);
background:-ms-linear-gradient(top, #5cbf2a 5%, #44c767 100%);
background:linear-gradient(to bottom, #5cbf2a 5%, #44c767 100%);
background-color:#5cbf2a;
}
#submit:active {
position:relative;
top:1px;
}
Comment form submit button

WordPress formulär för comments till nästa nivå

Du kanske tycker att det var för grundläggande. Men vi måste börja där så att alla kan följa med.

Du kan dock ta ditt WordPress-kommentarformulär till nästa nivå genom att ordna om formulärfält, lägga till social inloggning, kommentarsprenumerationer, riktlinjer för kommentarer, snabbtaggar och mer.

Add Social Login till WordPress Comments

Låt oss börja med att lägga till sociala logins i WordPress comments.

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

Vid aktivering måste du besöka Super Socializer ” Social Login och sedan kontrollera boxen som säger ’Aktivera Social Login’.

Check box to enable social login

Detta visar panelen för alternativ för social login. Klicka först på tabben ”Advanced Configuration”.

Se sedan till att boxen ”Enable at comment form” är kontrollerad.

Enable social login on comment form

Klicka sedan på tabben ”Basic Configuration”. Här kan du välja de sociala nätverk som du vill add to genom att kontrollera boxarna i ”Select Social Networks” section.

Select social networks for login

Under detta kommer pluginet att kräva API keys för att kunna anslutas till sociala plattformar. Klicka bara på ikonen ”Question Mark” för att få upp instruktionerna om hur du får detta för varje plattform.

Enter social network API keys

När du är klar klickar du på knappen ”Save Changes” för att spara dina inställningar för social login.

Du kan nu besöka din webbplats för att se de sociala inloggningsknapparna ovanför ditt kommentarsformulär.

Social login comment form example

Lägga till kommentarspolicytext före eller efter kommentarformuläret

Vi älskar alla våra användare, och vi uppskattar verkligen att de tar några minuter för att lämna en comment på vår site. För att skapa en sund diskussion är det dock viktigt att granska kommentarer.

För att ha full transparens skapade vi en page med policy för comments, men du kan inte bara lägga den här länken i footern.

Vi ville att vår kommentarspolicy skulle vara framträdande och synlig för alla användare som lämnar en kommentar. Det är därför vi bestämde oss för att add to kommentarpolicyn i vårt WordPress-kommentarformulär.

Om du vill add to en page med kommentarspolicy är det första du behöver göra att skapa en WordPress page och definiera din kommentarspolicy (du kan stjäla vår och ändra den så att den passar your behov).

Följaktligen kan du add to följande kod i functions.php-filen i ditt theme eller i ett code snippets plugin.

function wpbeginner_comment_text_before($arg) {
    $arg['comment_notes_before'] .= '<p class="comment-policy"">We are glad you have chosen to leave a comment. Please keep in mind that comments are moderated according to our <a href="http://www.example.com/comment-policy-page/">comment policy</a>.</p>';
    return $arg;
}

add_filter('comment_form_defaults', 'wpbeginner_comment_text_before');

Koden ovan kommer att ersätta standardformuläret för comments före obs/observera med denna text. Vi har också add to en CSS-klass i koden, så att vi kan markera notisen med hjälp av CSS. Här är det exempel på CSS som vi använde:

p.comment-policy {
    border: 1px solid #ffd499;
    background-color: #fff4e5;
    border-radius: 5px;
    padding: 10px;
    margin: 10px 0px 10px 0px;
    font-size: small;
    font-style: italic;
}

Så här såg det ut på vår test site:

Comment policy note

Om du vill visa länken efter textområdet för kommentaren använder du följande kod.

function wpbeginner_comment_text_after($arg) {
    $arg['comment_notes_after'] .= '<p class="comment-policy"">We are glad you have chosen to leave a comment. Please keep in mind that comments are moderated according to our <a href="http://www.example.com/comment-policy-page/">comment policy</a>.</p>';
    return $arg;
}

add_filter('comment_form_defaults', 'wpbeginner_comment_text_after');

Glöm inte att ändra URL: en i enlighet med detta, så att den går till din sida för kommentarpolicy snarare än example.com.

Flytta textfältet för comments längst ner

Som standard visar WordPress kommentarformulär först textområdet för kommentaren och sedan fälten för namn, email och website. Denna ändring infördes i WordPress 4.4.

Innan dess visade WordPress-webbplatser fälten namn, email och website först, och sedan textboxen för kommentarer. Vi ansåg att våra användare är vana vid att se formuläret för kommentarer i den ordern, så vi använder fortfarande den gamla fältordningen på WPBeginner.

Om du vill göra det är allt du behöver göra att lägga till följande kod i ditt temas functions.php-fil eller ett code snippets plugin.

function wpb_move_comment_field_to_bottom( $fields ) {
$comment_field = $fields['comment'];
unset( $fields['comment'] );
$fields['comment'] = $comment_field;
return $fields;
}

add_filter( 'comment_form_fields', 'wpb_move_comment_field_to_bottom');

Vi rekommenderar alltid att du lägger till kod i WordPress med hjälp av ett code snippets plugin som WPCode. Detta gör det enkelt att add to custom code utan att editera din functions.php-fil, så du behöver inte oroa dig för att förstöra din site.

För att komma igång måste du installera och aktivera det gratis pluginet WPCode. För instruktioner, se den här guiden om hur du installerar ett plugin för WordPress.

Efter aktivering, gå till Code Snippets ” + Add Snippet från WordPress dashpanelen.

Därifrån hittar du alternativet ”Add Your Custom Code (New Snippet)” och klickar på knappen ”Use Snippet” under den.

Add new snippet

Lägg sedan till en rubrik för ditt snippet högst upp på sidan, det kan vara vad som helst som hjälper dig att komma ihåg vad koden är till för.

Klistra sedan in koden ovan i ”Code Preview” boxen och välj ”PHP Snippet” som code type från dropdown-listan till höger.

Paste code into Code Preview box and select the Code Type

Efter det är det bara att toggle omkopplaren från ”Activate” till ”Inaktiverad” och clicka på knappen ”Save Snippet”.

Activate and save snippet in WPCode

Den här koden flyttar helt enkelt fältet för textområdet comment längst ner.

Moving comment field to the bottom

Remove Website (URL) fält från WordPress Comment Form

Fältet för website i formuläret för comments lockar många spammare. Även om det inte kommer att stoppa spammare eller ens minska skräppostkommentarer att ta bort det, kommer det säkert att rädda dig från att av misstag godkänna en kommentar med dålig länk till författarens webbplats.

Det kommer också att minska ett fält från formuläret för kommentarer, vilket gör det enklare och mer användarvänligt. För mer information om detta ämne, se vår artikel om att remove website url fält från WordPress comment formulär.

För att ta bort URL-fältet från kommentarformuläret, lägg bara till följande kod i din functions.php-fil eller ett code snippets plugin.

function wpbeginner_remove_comment_url($arg) {
    $arg['url'] = '';
    return $arg;
}
add_filter('comment_form_default_fields', 'wpbeginner_remove_comment_url');

Remove URL field

Du kan följa samma steg i föregående section för att på ett säkert sätt add to denna kod i WordPress med hjälp av tillägget WPCode.

Add to en checkbox för Prenumerera på Comments i WordPress

När användare lämnar en kommentar på din website kanske de vill följa upp den threaden för att se om någon har svarat på deras kommentar. Genom att lägga till en checkbox för att prenumerera på kommentarer aktiverar du användare att få omedelbara aviseringar när en new comment visas på posten.

För att add to denna checkbox, det första du behöver göra är att installera och aktivera Subscribe to Comments Reloaded plugin. Efter aktivering måste du besöka StCR ” Comment Form page för att konfigurera plugin-inställningarna.

Subscribe to comments checkbox

För detaljerade Step-by-Step-instruktioner, se vår artikel om hur man tillåter användare att prenumerera på kommentarer i WordPress.

Add extra fält till formuläret för comments i WordPress

Vill du add to extra fält till din WordPress comment form? Instance, an optional field where users can add their Twitter handle?

Installera och aktivera helt enkelt WordPress Comments Fields plugin. När du har aktiverat det, gå till sidan ”Comments Fields” och växla till tabben ”Comment Fields”.

Add extra fields to comment form

Dra och släpp helt enkelt ett custom-fält och ge det en rubrik, description och ett datanamn.

När du är klar med att lägga till fälten, glöm inte att klicka på knappen ”Save all changes”.

You can now view your comment form to see the custom fields in actions.

Comment form custom fields

De customize-fälten visas sedan i moderationen av kommentarer och under innehållet i kommentaren.

Comment extra fields displayed

För mer detaljer, se vår tutorial om hur du lägger till custom fields till formuläret för comments i WordPress.

Vi hoppas att den här artikeln hjälpte dig att lära dig hur du stylar WordPress formulär för kommentarer för att göra det roligare för dina användare. Du kanske också vill se våra tips för att få fler comments på dina blogginlägg i WordPress och våra expertval av de bästa pluginsen för sociala medier för WordPress.

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

118 kommentarerLämna ett svar

  1. Hitesh Patel

    Currently, comment form has one Comment textarea field and one Post comment button. I have not found Name, Email, and website field in twenty twenty four theme.

    • WPBeginner Support

      If you are logged in to your site it would automatically use your logged in user’s information. If you visit your site using an incognito browser you should see the fields unless a customization was done to remove commenter names and information.

      Administratör

  2. Gabriel Pinto-Hasagiv

    Hi,
    I love this article! explained so well!

    Quick question, how can i change the ”↩” with my svg icon when someone replays a comment?

    • WPBeginner Support

      That would depend on your specific theme as not every theme has that symbol in their comment form.

      Administratör

  3. Dayo Olobayo

    Thanks for taking out the time to put this article together. I used the code snippet for removing the website url but I noticed it doesn’t working well here. Reason why I said that is because it only worked on 2 post but other posts on my website still has the URL box in the comment section.

    Am I the one not getting it right please? Also, do I need to replace the ”wpbeginner” in the code to my domain name?

    • WPBeginner Support

      You may want to check with your theme to see if they have something in their styling that could be overriding the standard styling. You do not need to remove wpbeginner from the code for it to work. :)

      Administratör

  4. Jiří Vaněk

    Thanks for the tutorial using Seed Prod. I am currently using WP Discuz and I am quite happy with it. However, for smaller sites this form is much more elegant with Seed Prod. The instructions are quite long but I will try it on my test site where I have Seed Prod installed. Thanks for a great and really detailed tutorial.

  5. Moinuddin Waheed

    I have seen many different comments section on websites and wondered why do they differed on appearance although all are using the same wordpress comments.
    having a good looking comments section is necessary for making good user experience while commenting.
    I have a query regarding disqus platform for wordpress comments which I have used for two years.
    is it good idea to continue to use it or is there a better alternative?
    also just curious to know what does wpbeginner uses for comments?

    • Jiří Vaněk

      In my opinion, WP Discuz is a great plugin. I’ve been using it on my blog for almost two years now, and I must say, without any issues so far. So if you’re using it too, I wouldn’t necessarily change this plugin. The developers and support team work great. However, it probably also depends on the type and size of the website, as this plugin is quite large and complex.

  6. Vera Kofyan

    Thank you for a great tutorial.
    One thing did not work for me: moving the text area to bottom. I added the script in Code snippets, but nothing changed. Has anything changed since you wrote that?
    Thank you,
    Vera

    • WPBeginner Support

      The snippet should still work correctly, the theme you are using may have added styling to the comment form that could be changing some things, if you check with the support for your specific theme they can help check and confirm this.

      Administratör

  7. Arischvaran Puvanesvaran

    Thank you for sharing

    • WPBeginner Support

      You’re welcome, we hope you found our guide helpful!

      Administratör

  8. Ali Kaleem

    This Blog Is very imformative.

    • WPBeginner Support

      Glad you found our site helpful!

      Administratör

  9. Asutosh sahoo

    really full of knowledge. please keep updating. thanks..

    • WPBeginner Support

      Glad you found our guide helpful!

      Administratör

  10. saikul

    good tutorial . i like this

    • WPBeginner Support

      Thank you, glad you liked it!

      Administratör

  11. Samyak sharma

    Thanks, This is very good article.

    • WPBeginner Support

      Glad you found it helpful :)

      Administratör

  12. Vincent Nyagaka

    Thank you for guiding us on how to style WordPress form. However I have tried to use almost all the codes, on how to remove the URL field from the comment form but unfortunately, none is working code. Kindly can you give me another code to use

    • WPBeginner Support

      If none of our recommendations were able to assist, we would recommend reaching out to the support for your specific theme and they should be able to assist with targeting their specific target for your comments.

      Administratör

  13. amr

    Hi
    How can I delete the url from the author name and date?

    Thanks

  14. lal

    good tutorial, loved it

    • WPBeginner Support

      Glad you liked our tutorial :)

      Administratör

  15. Adam Rees

    Thanks, it helped me a lot in customizing the comment section.

    • WPBeginner Support

      You’re welcome :)

      Administratör

  16. fred

    Hi, nice tutorial ! but i have a problem to find the location of the right .php to modify the post comments, i’m using oceanwp theme with elementor pro, when i go to the functions.php or comments.php i can’t find any of the command lines, i’v tryed to add your code and nothing happens. so i guess it’s somewhere else but where ?

    • WPBeginner Support

      If you are using a page builder you would need to reach out to that page builder’s support for how to edit the comment form and what tools are available.

      Administratör

  17. Muhammad Shahzad

    how to show to comment box to the top of all comments and after post.

    • WPBeginner Support

      If your theme is not set up that way you would sadly need to modify the theme’s code to do that. As each theme’s code can be very different we do not have a specific guide on how to do that yet.

      Administratör

  18. HieuBui

    Thank you very much

    • WPBeginner Support

      You’re welcome :)

      Administratör

  19. tom

    Great Article! thanks a lot

    • WPBeginner Support

      You’re welcome :)

      Administratör

  20. mobileninja

    Thank you so much. It is very helpful article.

    • WPBeginner Support

      Glad it could be helpful :)

      Administratör

  21. Emma

    Hi. Great tutorial. I wanted to refrain my users from adding their website url to the comment section, because it causes crashes for some users (no idea why). I succeeded, but now it still says the usual ”remember my name, e-mail adres and website for the next time I leave a comment”. Do you know how to fix that?

    • WPBeginner Support

      You may want to check with your theme’s support and let them know about the crashing and editing that message.

      Administratör

  22. WPBeginner Support

    Glad our guide could help :)

    Administratör

  23. Deepak Bharti

    Thanks for sharing this type of article. it is helpful for me and my website.

    • WPBeginner Support

      Glad our article could be helpful :)

      Administratör

  24. Rubel Ahmed

    Hello

    Nice article and I have used some of your suggestions but I found a code error that needs fixing under ‘Adding Comment Policy Text Before or After Comment Form’.

    You have placed the add filter within the function or otherwise it won’t get executed, it needs to be moved outside of the function.

    Rubel

    • WPBeginner Support

      Both filters should be outside the function but we will certainly take another look and update if we can see the error :)

      Administratör

  25. suvo

    obviously like your web-site Post Thanks for Shearing. i Read your Blog every day.it very bothersome to tell the reality then again I’ll definitely come back again.Please write more about this topics.

    • WPBeginner Support

      Glad you like our articles :)

      Administratör

  26. ARPIT

    The Information you’ve provided here is very good. Nice Tutorial. Thanks for sharing. I was looking for a long time for this.It’s really helping me get more familiar with WordPress!

  27. Hồ Ngọc Thanh

    I can’t find #respond { }
    #reply-title { }
    #cancel-comment-reply-link { }
    #commentform { }
    #author { }
    #email { }
    #url { }
    #comment
    #submit
    in my wordpress theme?

  28. Chintan

    How to add real-time comment preview?

    • Paulina

      Hello, thank you for this very useful article. I am interested in adding a text before the button ”submit”. In the code that you are providing here: would I need to change the words ’wpbeginner’ to anything else that is connected to my own site?

      • Akramul Hasan

        Hello Paulina,
        You can add text or anything before Submit button by using a simple filter hook that works for comments form fields.

  29. Hena

    wow!! It’s very good

  30. Woolker Cherenfant

    Hi! Great article as usual. But I am wondering how can I change the word ”says” in the comment section. I want to translate it into Haitian Creole ”di”. Any help with that?

    Thanks in advance.

    —Woolker

  31. Tisha

    Is it possible to copy the code to blogger?. Because I want to make Wordpress style comment in my Blogger blog. Thanks for your help. :)

  32. Mate Hodi

    Hey!

    Great article! I was looking for a solution to change the ”Leave a Reply” part. Do you have any idea how I may change it?

  33. Neeraj

    This is a helpful guide which gave thorough guidance to me about Comments Section Optimization.

  34. Kevin Byrnes

    Excellent article. I will be facing some of these issues as well..

  35. JP

    Hi
    I love your tutorials! I still have a question though; is it popular to change the greyish background color of the entire comment form to some thing else? Perhaps even to an image instead of a solid color?

  36. Mahesh

    I’m Loving Your Tuts It is very Easy to Understand and More Useful any Where.

    Thanks For Sharing Sir.

  37. Lisa Marten

    Can I put the comment box to be fill in above the list of posted comments instead of below?

  38. SiRetu

    Is there any complete tutorial? I mean start from scratch including creating comments.php file from the first time. Thanks, great tutorial as always

  39. Luis Izquierdo

    I am customizing my wp themes child theme and I was able to place the policy text above the comment form. But it only shows to logged out users. How do I get it to show to Logged in users?

  40. Luca Morelli

    Hello great tutorial: thanks!

    I keep improving my knowledge about WordPress thanks to your lessons. I have a question (I don’t know much about php): I managed to add the comment policy text before the submit button, but I noticed that if I click “reply” and see your codes, the php output is inside the paragraph tag together with a class named ”commentpolicy”. How did you achieve that (e.g. how to style the php output on an HTML webpage with a tag and a class, which can then be styled with CSS)?

    Hopefully I explained it correctly and my question makes sense.

    Again many thanks for all your tutorials.

    Luca

    • WPBeginner Support

      We are not sure what you are trying to ask. Can you please explain bit more? Thanks.

      Administratör

      • Jayanta

        I have the same question. Trying to clarify a bit.
        I have added your snippet to get the comment policy text before comment field. But This is only some text, no special div class is added for that text. So, I am not able to style it using css (I would like to make the text smaller, or may be put a border-box to it). Please guide us. Hope it makes sense now. Thank you so much.

  41. Erick

    How do you make comments look like this website?

  42. gift charles

    Thank you very much for this,i was looking for a long time for a way to make the built in comments look better because i prefer them to other services like facebook comments or disqus

  43. Adnan Bashir

    As you have noticed, the newest version of WP (4.4) is displaying Name and Email form below Text box, do you have any idea how to revert it to old style (Name and Email box above the Text box) ?
    Thanks

  44. mario

    Hello, great tutorial !
    But I’d like to know one more thing: is it possible to add a checkbox for the privacy policy? Since wordpress system collect the ip, I want my users to check teh box before sending the message. Any suggestion ? Thank you !

  45. Ramon

    I would like to have the input comments fields above the comments them self so my customers can leave a comment without the need to scroll all the way down the page.

    Is there an easy way to accomplish this?

    Thank you.

  46. dragons

    Is there any way to ad an EDIT button for the commenters? So they can fix typos and such? Also what if the site wants to allow commenters the ability to upload images in the comments? Is there a way to do that?

  47. Rick Hellewell

    Good tutorial. Used it to develop my own customized contact form
    plugin, where I re-define the $args for the comment form fields.

    But it turns out, while testing, that some themes create their own
    ‘textarea’ field, which adds to my ‘textarea’ field, resulting in two
    comment text fields. Not good.

    I have set my add_filter( ‘comment_form_default_fields’…. with a
    higher priority (99) so that it happens later in the ‘page build’ (after
    the theme does it’s comment_form_default_fields), but the duplicates
    comment text boxes are still there. Also tried a priority of 8, and that
    didn’t do it either.

    So, can you think of a generic (works for any theme) that can
    determine if the comment field has already been defined? And, if the
    duplicate is found, remove the one in the theme, so I can replace it
    with mine?

    I understand that the problem is caused by bad coding practices on the theme, but would like to find a workaround.

    Thanks….Rick…

  48. Larisa Frolova

    Thank you!

    I’ve searched the forums and Google for this, but I’m still a little confused as to what to do. If I just want to change the LOCATION of the comment/reply link that appears on posts, how do I do that? It’s not that I want to make it invisible, or change the wording – I just want it to be at the bottom of a post, not at the top.

    How do I go about doing that for the Twenty-Twelve theme?

  49. Mikael

    I like this layout!

  50. lflier

    Very helpful!

    I’m really liking the Disqus comment system you’re now using. It’s slick and very inviting. I find myself leaving more comments on sites using Disqus.

    But I’m discouraged from using it on my own site by the lack of integration with BuddyPress activity stream. So the more I can do to streamline the native WordPress comment system and make it as inviting as Disqus, the better. Thanks again for your tutorial.

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.