Kommentarer spelar en avgörande roll för att bygga en gemenskap på internet. Kommentarer utgör en plattform för interaktion för dina läsare där de kan dela sina tankar, vilket ofta gör att de vill komma tillbaka.

Det finns flera sätt att uppmuntra användare att lämna en kommentar på din blogg. Ett av dessa sätt är att skapa en vacker, användbar och tillgänglig kommentarformulär.

I den här guiden visar vi dig hur du utformar standardformuläret för WordPress-kommentarer, vi visar dig också hur du lägger till kommentarfunktionalitet via sociala media-ID och hur du skapar kommentarprenumerationsfunktionalitet och mycket mer. Mer.

Men tidigare, om du aldrig har installerat WordPress-upptäckt Hur man installerar en Wordpress-blogg 7 steg et Hur man hittar, installera och aktivera en Wordpress tema på din blogg 

Tillbaka till varför vi är här.

Hur man ändrar stilen på kommentarer Wordpress

När vi pratar om stil menar vi CSS-sida av saken. Nedan visar jag dig hur du anpassar utseendet på kommentarformuläret i WordPress. Varje element som standard på WordPress har en CSS-kod, detta är fallet med listan med kommentarer, navigationsmenyer, kommentarformuläret, Widgetar och mer.

Bland filerna av WordPress-teman, vi har en fil som heter comments.php som används för att visa kommentarer och kommentarformulär på blogginlägg och sidor. För att visa WordPress-formuläret, " comment_form () Används.

Upptäck Hur man hittar länken till Wordpress inloggningssidan

Som standard genererar denna funktion ditt kommentarformulär med tre textfält (namn, e-post och webbplats), en stor textruta för kommentarinnehållet och skicka-knappen.

Du kan enkelt ändra vart och ett av dessa element bara genom att manipulera standard CSS-klasser och identifierare. Här är en lista över standard CSS-klasser som WordPress lägger till i varje kommentarformulär.

#respond {#} svar-title {#} avbryta-how-svar-link {} {} #commentform #author #email {} {} {} #URL #comment #submit .comment Notes {} {} .required .Hur form av författarna {} .comment form e-post} {.Hur form-url} {.Hur form-how {} .form tillåtna-taggar {} .form lägga fram

Genom att helt enkelt justera dessa CSS-klasser kan du helt ändra utseendet på kommentarformuläret. Låt oss försöka ändra något för att ge dig en uppfattning om vad vi kan göra.

Upptäck Hur du byter ut bildlänkar efter att ha installerat SSL på WordPress

Först börjar vi med att markera det aktiva fältet i formuläret. Genom att markera de aktiva fälten kan användarna enkelt se vad de förändrar och det ger en lite dynamisk sida på din webbplats.

#respond {bakgrund: #ececec; padding: 0 5 0px 5px; } / * Markering den aktiva textfältet * / #respond input [type = text] textarea {-webkit-övergång: alla 0.30s enkel in-ut; -moz-övergången: alla 0.30s enkel in-out; -MS-övergången: alla 0.30s enkel in-out; -o-övergången: alla 0.30s enkel in-out; beskriva: none; padding: 3px 0px 3px 3px; marginal: 5px 1px 3px 0px; kant: fast 1px #dddddd; } #respond input [type = text]: fokus, textarea: fokus {box-shadow: 0 0 5px RGBA (81, 203, 238, 1); marginal: 5px 1px 3px 0px; kant: fast 1px RGBA (81, 203, 238, 1); }

Så här ser din kommentarformulär ut med Twenty Twelve.

Med hjälp av dessa klasser kan du ändra hur texten visas i fält. Detta är vad vi kommer att göra i följande exempel.

#author {font-family: hummer "Hummer 1.4", "Droid Sans", Arial; font-size: 16px; färg: #1d1d1d; knipning: .1em; #URL} {färg: #21759b; font-family: "Luicida Console", "Courier New", "Courier", minibuss; } 

Här är resultatet som den föregående koden kommer att producera.

Du kan också ändra stilen på knappen för kommentarformulär. I följande exempel ger vi en övertoningsbakgrund.

#submit {font-family: Arial; färg: #ffffff; font-size: 20px; padding: 10px; text-decoration: none; box-shadow: 0px 1px 3px #666666; -webkit-box-shadow: 0px 1px 3px #666666; -moz-box-shadow: 0px 1px 3px #666666; text-shadow: 1px 1px 3px #666666; bakgrund: -webkit-gradient (linjär, 0 0, 0 100%, från (#006ad4) till (#003366)); bakgrund: -moz-linjär-gradient (topp, #006ad4, #003366); } #submit: hover {bakgrund: -webkit-gradient (linjär, 0 0, 0 100%, från (#003366) till (#006ad4)); bakgrund: -moz-linjär-gradient (topp, #003366, #006ad4)}

Här är resultatet som kommer att visas.

Hur man lägger till social interaktion i kommentarer

Låt oss börja med att lägga till sociala inloggningar i WordPress-kommentarformuläret. Det första du behöver göra är att installera och aktivera plugin social Login

Upptäck Hur man installerar en plugin i Wordpress För att aktivera detta plugin måste du skapa ett gratis konto genom att gå till följande adress: https://app.oneall.com

När det är klart behöver du inte konfigurera ett API för varje nätverk du vill använda för att låta dina användare ansluta via dem.

Även om API: erna för de olika sociala nätverken ständigt förändras behöver du inte göra någonting, utvecklarna av detta plugin kommer att uppdatera sina API: er åt dig. Allt du behöver göra är att logga in i OneAll API.

Så här visas dina formulär.

Upptäck också några premium WordPress-plugins  

Du kan använda andra Wordpress plugins för att ge ett modernt utseende och för att optimera hanteringen av din blogg eller hemsida.

Vi erbjuder dig här några premium WordPress-plugins som hjälper dig att göra det.

1. WP Instant Search & Auto Suggest

Pluginprogrammet "WP Instant Search & Auto Suggest" låter dig omedelbart få förslag på artiklar, sidor och anpassade inläggstyper när du söker i din WordPress-blogg. Det fungerar med WPBakery et Cornerstone.

Dess funktioner inkluderar: rsök i helskärmsläge, rOmedelbar sökning efter anpassade typer av publikationer, kompatibilitet med Visual Composer, Ttre integrerade designstilar, 5 färgscheman att välja mellan, ptangentbord och mus stöd, ehelt anpassningsbar via parametrar etc ...

Ladda ner | demo | webbhotell

2. 404 Error Page Omdirigera till hemsida eller anpassad sida

Här är ett av de bästa sätten att enkelt lägga till en 404-felsida som omdirigerar besökaren till hemsidan eller anpassad sida efter att ha aktiverat detta Wordpress plugin.

Alla 404-felsidor omdirigeras till startsidan eller en anpassad URL. Genom att använda detta Wordpress plugin, tillåter du Google att minska sidrankningen på din webbplats om den har många 404-felsidor.

Ce Wordpress plugin gör inte bara omdirigering utan det kan också vara en lämplig lösning för att förbättra rankningen av din webbplats i sökmotorernas resultat.

Ladda ner | demo | webbhotell

3. Liknande inlägg Pro 

Related Posts Pro ger en enkel men ändå kraftfull lösning för alla slags liknande innehåll på WordPress. Den stöder anpassade inläggstyper, multisite, kategorier, blandat innehåll, anpassat innehåll och mer ...

Som funktioner erbjuder det bland annat: 3 olika typer av layouter, 65 fördefinierade mallar för varje layout, aingen kodning kommer att behövas, stödet av tsurfning och Autoplay, kompatibilitet med de anpassade inläggstyperna som används av plugins WooCommerce, WP e-handel, bbPress etc ..., a sökfält med filter, en dmycket beskrivande dokumentation och mycket mer.

Ladda ner | demo | webbhotell

Rekommenderade resurser

Ta reda på om andra rekommenderade resurser som hjälper dig att bygga och hantera din webbplats.

• Så här visar beskrivningen av kategorierna på Wordpress
• Hur du optimerar din WordPress Robots.txt-fil för en perfekt SEO
• Hur man skapar en marknadsplats med WordPress
• Hur man lägger till en widget på rubriken på din Wordpress blogg

Slutsats

Här! Det är det för denna handledning. Vi hoppas att den här artikeln har hjälpt dig att göra dina feedbackformulär mer engagerande. Tveka inte att också ge oss dina tips om hur du anpassar WordPress, och särskilt dela den här artikeln med dina vänner på dina favorit sociala nätverk. 

Du kommer dock också att kunna konsultera vår medel, om du behöver fler element för att genomföra dina projekt för att skapa webbplatser, genom att konsultera vår guide om WordPress blogg skapande.

Om du har förslag eller kommentarer, lämna dem i vårt avsnitt commentaires.

.