Домой Оптимизация и учебники по WordPress Как стилизовать и настроить форму комментариев WordPress? Кроме того, изменить внешний вид...

Оптимизация и учебники по WordPress

Как стилизовать и настроить форму комментариев WordPress? Кроме того, изменить внешний вид комментариев с помощью CSS

07.09.2019

1741

Содержание

1 Давайте начнем:
2 Способ-1) Использование файла functions.php — только для Genesis
3 Нет ответов ' , ' 1 ответ ' , ' % ответов … ' ) , «генезис» ) ; } // Удалить URL из формы комментария функция crunchify_move_comment_form_below ( $ поля ) { $ comment_field знак равно $ fields [ 'comment' ] ; unset ( $ fields [ 'comment' ] ) ; $ fields [ 'comment' ] знак равно $ comment_field ; вернуть $ поля ; } add_filter ( 'comment_form_fields' , 'crunchify_move_comment_form_below' ) ; // Добавить заполнитель для имени и адреса электронной почты функция modify_comment_form_fields ( $ fields ) { $ fields [ 'author' ] знак равно ' ' , '' . ' , __ ( 'Ваше имя' ) , ' , ( $ req ? ' * ' : «» ) , '' ; $ fields [ 'email' ] знак равно ' ' , '' , ' , __ ( 'Ваш адрес электронной почты' ) , ' , ( $ req ? ' * ' : «» ) , '' ; $ fields [ 'url' ] знак равно ' ' , '' , '' , __ ( «Сайт» , 'domainreference' ) , ' , '' ; вернуть $ поля ; } add_filter ( 'comment_form_default_fields' , 'modify_comment_form_fields' ) ; Способ-2) Для любой другой темы WordPress
4 Форма комментария — До :
5 Форма комментария — после :
6 Что теперь? Хотите изменить CSS с помощью внешнего вида?

comment_form() выводит полную форму комментариев для использования в шаблоне WordPress .

Большинство строк и полей формы могут управляться через $args массив передается в функцию, в то время как вы также можете использовать comment_form_default_fields Фильтр для изменения массива полей по умолчанию, если вы просто хотите добавить новое или удалить одно поле.

Все поля также индивидуально проходят через фильтр формы comment_form_field_$name где $name это ключ, используемый в массиве полей.

Функция WordPress 3.0+ — comment_form() имеет 2 параметра, которые можно по желанию изменить.

Вот пример аргументов, которые можно использовать:

1	comment_form ( $ args , $ post_id ) ; ?>

$args: Это содержит наши параметры для наших строк и полей в форме и т. Д.
$post_id: Идентификатор поста используется для генерации формы, если ноль, он будет использовать текущее сообщение.

Сегодня я изменил форму комментария, добавил немного CSS и заметил очень большую разницу в форме комментария.

Хотел бы поделиться с вами своими изменениями.

Давайте начнем:

Способ-1) Использование файла functions.php — только для Genesis

Идти к Appearance
Нажмите Editor
открыто functions.php файл и поставить ниже код.

Это то, что у меня есть на Crunchify, так как я использую фреймворк Genesis WordPress .

functions.php

// Изменить текст заголовка комментария в комментариях

add_filter ( 'genesis_title_comments' , 'child_title_comments' ) ;

функция child_title_comments ( ) {

вернуть __ ( comments_number ( '

Нет ответов ' , '

1 ответ ' , '

% ответов … ' ) , «генезис» ) ;

}

// Удалить URL из формы комментария

функция crunchify_move_comment_form_below ( $ поля ) {

$ comment_field знак равно $ fields [ 'comment' ] ;

unset ( $ fields [ 'comment' ] ) ;

$ fields [ 'comment' ] знак равно $ comment_field ;

вернуть $ поля ;

}

add_filter ( 'comment_form_fields' , 'crunchify_move_comment_form_below' ) ;

// Добавить заполнитель для имени и адреса электронной почты

функция modify_comment_form_fields ( $ fields ) {

$ fields [ 'author' ] знак равно '

' , ' ,

esc_attr ( $ commenter [ 'comment_author' ] ) , 'size = 30 ' , $ aria_req , '/>' .

' , __ ( 'Ваше имя' ) , ' ,

( $ req ? ' * ' : «» ) ,

'' ;

$ fields [ 'email' ] знак равно '

' , ' , esc_attr ( $ commenter [ 'comment_author_email' ] ) ,

'size = 30 ' , $ aria_req , '/>' ,

' , __ ( 'Ваш адрес электронной почты' ) , ' ,

( $ req ? ' * ' : «» )

'' ;

$ fields [ 'url' ] знак равно '

' ,

' , esc_attr ( $ commenter [ 'comment_author_url' ] ) , 'size = 30 />' ,

'' , __ ( «Сайт» , 'domainreference' ) , ' ,

'' ;

вернуть $ поля ;

}

add_filter ( 'comment_form_default_fields' , 'modify_comment_form_fields' ) ;

Способ-2) Для любой другой темы WordPress

Просто открой comments.php подать и заменить $args с кодом ниже, чтобы украсить код комментария с заполнителями.

PHP

$ арг знак равно массив (

«поле» = > apply_filters (

'comment_form_default_fields' , массив (

«автор» = > '

' , ' ,

esc_attr ( $ commenter [ 'comment_author' ] ) , 'size = 30 ' , $ aria_req , '/>' .

' , __ ( 'Ваше имя' ) , ' ,

( $ REQ ? ' * ' : «» ) ,

'Эл. адрес' = > '

' , ' , esc_attr ( $ commenter [ 'comment_author_email' ] ) ,

'size = 30 ' , $ aria_req , '/>' ,

' , __ ( 'Ваш адрес электронной почты' ) , ' ,

( $ REQ ? ' * ' : «» )

'URL' = > '

' ,

' , esc_attr ( $ commenter [ 'comment_author_url' ] ) , 'size = 30 />' ,

'' , __ ( «Сайт» , 'domainreference' ) , ' ,

)

) ,

'comment_field' = > '

' ,

' , __ ( «Дайте нам знать, что вы должны сказать: ) , ' ,

</ TextArea>»</span> <span> </span> <span>,</span> </div>
<div><span>        </span> <span></ p> <span>',</span></span> </div>
<div><span>    </span> <span>'comment_notes_after'</span> <span> </span> = <span>></span> <span> </span> <span>''</span> <span>,</span> </div>
<div><span>    </span> <span>'title_reply'</span> <span> </span> = <span>></span> <span> </span> <span>'</p>
<div class = crunchify-text>
<h5> Пожалуйста, оставьте свои комментарии и отзывы </ h5> </ div>'</span> </div>
<div> <span>)</span> <span>;</span> </div>
</div>
</td>
</tr>
</table>
</div>
</div>
<p> Чтобы настроить <a>форму комментария</a> , вы можете использовать любые HTML-теги / элементы, как вы можете видеть, я разместил дополнительные <code>placeholder</code> HTML-тег выше. </p>
<h3><span id="_8212"> <strong>Форма комментария — До</strong> : </span></h3>
<p> <a><img src=http://csharpcoderr.com/images/Crunchify-WordPress-Comment-Form-Magaziene-Premium-Before.png /></a> </p>
<h3><span id="_8212-2"> <strong>Форма комментария — после</strong> : </span></h3>
<p> <a><img src=http://csharpcoderr.com/images/Updated-WordPress-Comment-form-after-modified-CSS-and-Field-arguments.png /></a> </p>
<p> Существует несколько способов изменить форму комментария. Просто продолжайте добавлять разные тексты и <a>HTML-стили,</a> чтобы изменить его. </p>
<h3><span id="__CSS"> Что теперь? Хотите изменить CSS с помощью внешнего вида? </span></h3>
<p> <a><img src=http://csharpcoderr.com/images/Modify-WordPress-comments-Look-and-Feel-with-CSS.png /></a> </p>
<p> Если вы хотите <a>изменить CSS</a> вашей формы комментариев, то вот <code>handy code</code> которые вы могли бы добавить к вашей теме <code>style.css</code> файл. </p>
<div>
<div> <span>style.css — изменяет внешний вид комментариев WordPress</span> </p>
<div></div>
</div>
<div></div>
<div></div>
<div>
<table>
<tr>
<td>
<div>
<div> 1 </div>
<div> 2 </div>
<div> 3 </div>
<div> 4 </div>
<div> 5 </div>
<div> 6 </div>
<div> 7 </div>
<div> 8 </div>
<div> 9 </div>
<div> 10 </div>
<div> 11 </div>
<div> 12 </div>
<div> 13 </div>
<div> 14 </div>
<div> 15 </div>
<div> 16 </div>
<div> 17 </div>
<div> 18 </div>
<div> 19 </div>
<div> 20 </div>
<div> 21 </div>
<div> 22 </div>
<div> 23 </div>
<div> 24 </div>
<div> 25 </div>
<div> 26 </div>
<div> 27 </div>
<div> 28 </div>
<div> 29 </div>
<div> 30 </div>
<div> 31 </div>
<div> 32 </div>
<div> 33 </div>
<div> 34 </div>
<div> 35 </div>
<div> 36 </div>
<div> 37 </div>
<div> 38 </div>
<div> 39 </div>
<div> 40 </div>
<div> 41 </div>
<div> 42 </div>
<div> 43 </div>
<div> 44 </div>
<div> 45 </div>
<div> 46 </div>
<div> 47 </div>
<div> 48 </div>
<div> 49 </div>
<div> 50 </div>
<div> 51 </div>
<div> 52 </div>
<div> 53 </div>
<div> 54 </div>
<div> 55 </div>
<div> 56 </div>
<div> 57 </div>
<div> 58 </div>
<div> 59 </div>
<div> 60 </div>
<div> 61 </div>
<div> 62 </div>
<div> 63 </div>
<div> 64 </div>
<div> 65 </div>
<div> 66 </div>
<div> 67 </div>
<div> 68 </div>
<div> 69 </div>
<div> 70 </div>
<div> 71 </div>
<div> 72 </div>
<div> 73 </div>
<div> 74 </div>
<div> 75 </div>
<div> 76 </div>
<div> 77 </div>
<div> 78 </div>
<div> 79 </div>
<div> 80 </div>
<div> 81 </div>
<div> 82 </div>
<div> 83 </div>
<div> 84 </div>
<div> 85 </div>
<div> 86 </div>
<div> 87 </div>
<div> 88 </div>
<div> 89 </div>
<div> 90 </div>
<div> 91 </div>
<div> 92 </div>
<div> 93 </div>
<div> 94 </div>
<div> 95 </div>
<div> 96 </div>
<div> 97 </div>
<div> 98 </div>
<div> 99 </div>
<div> 100 </div>
<div> 101 </div>
<div> 102 </div>
<div> 103 </div>
<div> 104 </div>
<div> 105 </div>
<div> 106 </div>
<div> 107 </div>
<div> 108 </div>
<div> 109 </div>
<div> 110 </div>
<div> 111 </div>
<div> 112 </div>
<div> 113 </div>
<div> 114 </div>
<div> 115 </div>
<div> 116 </div>
</div>
</td>
<td>
<div>
<div> <span>/* ## Комментарии</span> </div>
<div> <span>——————————————— * /</span> </div>
<div> <span>,</span> <span>комментировать</span> — <span>отвечать</span> <span>,</span> </div>
<div> <span>,</span> <span>вход</span> — <span>пинги</span> <span>,</span> </div>
<div> <span>,</span> <span>запись</span> — <span>комментарии</span> <span> </span> <span>{</span> </div>
<div><span>    </span> <span>цвет</span> <span>:</span> <span> </span> <span># 444;</span> </div>
<div><span>    </span> <span>набивка</span> <span>:</span> <span> </span> <span>20px</span> <span> </span> <span>45px</span> <span> </span> <span>40px</span> <span> </span> <span>45 пикселей</span> <span>;</span> </div>
<div><span>    </span> <span>граница</span> <span>:</span> <span> </span> <span>1px</span> <span> </span> <span>твердый</span> <span> </span> <span>#ccc;</span> </div>
<div><span>    </span> <span>переполнение</span> <span>:</span> <span> </span> <span>скрытый</span> <span>;</span> </div>
<div><span>    </span> <span>фон</span> <span>:</span> <span> </span> <span>#fff;</span> </div>
<div><span>    </span> — <span>webkit</span> — <span>коробка</span> — <span>shadow</span> <span>:</span> <span> </span> <span>0px</span> <span> </span> <span>0px</span> <span> </span> <span>8px</span> <span> </span> <span>rgba</span> <span>(</span> <span>0</span> <span>,</span> <span>0</span> <span>,</span> <span>0</span> <span>,</span> <span>0,3</span> <span>)</span> <span>;</span> </div>
<div><span>    </span> — <span>моз</span> — <span>коробка</span> — <span>тень</span> <span>:</span> <span> </span> <span>0px</span> <span> </span> <span>0px</span> <span> </span> <span>8px</span> <span> </span> <span>rgba</span> <span>(</span> <span>0</span> <span>,</span> <span>0</span> <span>,</span> <span>0</span> <span>,</span> <span>0,3</span> <span>)</span> <span>;</span> </div>
<div><span>    </span> <span>коробка</span> — <span>тень</span> <span>:</span> <span> </span> <span>0px</span> <span> </span> <span>0px</span> <span> </span> <span>8px</span> <span> </span> <span>rgba</span> <span>(</span> <span>0</span> <span>,</span> <span>0</span> <span>,</span> <span>0</span> <span>,</span> <span>0,3</span> <span>)</span> <span>;</span> </div>
<div><span>    </span> <span>граница</span> — <span>слева</span> <span>:</span> <span> </span> <span>4px</span> <span> </span> <span>твердый</span> <span> </span> <span># 444;</span> </div>
<div> <span>}</span> </div>
<div> <span>,</span> <span>запись</span> — <span>комментарии</span> <span> </span> <span>h3</span> <span>{</span> </div>
<div><span>    </span> <span>размер</span> <span>шрифта</span> <span>:</span> <span> </span> <span>30 пикселей</span> <span>;</span> </div>
<div><span>    </span> <span>поле</span> — <span>снизу</span> <span>:</span> <span> </span> <span>30 пикселей</span> <span>;</span> </div>
<div> <span>}</span> </div>
<div> <span>,</span> <span>комментируйте</span> — <span>отвечайте</span> <span>h3</span> <span>,</span> </div>
<div> <span>,</span> <span>вход</span> — <span>пинг</span> <span> </span> <span>h3</span> <span>{</span> </div>
<div><span>    </span> <span>размер</span> <span>шрифта</span> <span>:</span> <span> </span> <span>20 пикселей</span> <span>;</span> </div>
<div><span>    </span> <span>поле</span> — <span>снизу</span> <span>:</span> <span> </span> <span>30 пикселей</span> <span>;</span> </div>
<div> <span>}</span> </div>
<div> <span>,</span> <span>комментировать</span> — <span>отвечать</span> <span> </span> <span>{</span> </div>
<div><span>    </span> <span>обивка</span> — <span>снизу</span> <span>:</span> <span> </span> <span>5</span> <span>%</span> <span>;</span> </div>
<div><span>    </span> <span>поле</span> <span>:</span> <span> </span> <span>20px</span> <span> </span> <span>1px</span> <span> </span> <span>20px</span> <span> </span> <span>1px</span> <span>;</span> </div>
<div><span>        </span> <span>граница</span> — <span>слева</span> <span>:</span> <span> </span> <span>никто</span> <span> </span> <span>!</span> <span>важно</span> <span>;</span> </div>
<div> <span>}</span> </div>
<div> <span>,</span> <span>комментарий</span> — <span>заголовок</span> <span> </span> <span>{</span> </div>
<div><span>    </span> <span>цвет</span> <span>:</span> <span> </span> <span># adaeb3;</span> </div>
<div><span>    </span> <span>размер</span> <span>шрифта</span> <span>:</span> <span> </span> <span>14px</span> <span>;</span> </div>
<div><span>    </span> <span>поле</span> — <span>снизу</span> <span>:</span> <span> </span> <span>20 пикселей</span> <span>;</span> </div>
<div> <span>}</span> </div>
<div> <span>,</span> <span>комментарий</span> — <span>заголовок</span> <span> </span> <span>цитировать</span> <span> </span> <span> </span> <span>{</span> </div>
<div><span>    </span> <span>граница</span> <span>:</span> <span> </span> <span>нет</span> <span>;</span> </div>
<div><span>    </span> <span>стиль</span> <span>шрифта</span> <span>:</span> <span> </span> <span>нормальный</span> <span>;</span> </div>
<div><span>    </span> <span>размер</span> <span>шрифта</span> <span>:</span> <span> </span> <span>16 пикселей</span> <span>;</span> </div>
<div><span>    </span> <span>шрифт</span> — <span>вес</span> <span>:</span> <span> </span> <span>жирный</span> <span>;</span> </div>
<div> <span>}</span> </div>
<div> <span>,</span> <span>комментарий</span> — <span>заголовок</span> <span> </span> <span>,</span> <span>комментарий</span> — <span>мета</span> <span> </span> <span> </span> <span>{</span> </div>
<div><span>    </span> <span>граница</span> <span>:</span> <span> </span> <span>нет</span> <span>;</span> </div>
<div><span>    </span> <span>цвет</span> <span>:</span> <span> </span> <span># adaeb3;</span> </div>
<div> <span>}</span> </div>
<div> <span><span>ли.</span></span> <span>комментарий</span> <span> </span> <span>{</span> </div>
<div><span>    </span> <span>цвет</span> <span>фона</span> <span>:</span> <span> </span> <span>#fff;</span> </div>
<div><span>    </span> <span>граница</span> — <span>справа</span> <span>:</span> <span> </span> <span>нет</span> <span>;</span> </div>
<div> <span>}</span> </div>
<div> <span>,</span> <span>комментарий</span> — <span>содержание</span> <span> </span> <span>{</span> </div>
<div><span>    </span> <span>ясно</span> <span>:</span> <span> </span> <span>оба</span> <span>;</span> </div>
<div><span>    </span> <span>переполнение</span> <span>:</span> <span> </span> <span>скрытый</span> <span>;</span> </div>
<div> <span>}</span> </div>
<div> <span>,</span> <span>комментарий</span> — <span>список</span> <span> </span> <span>литий</span> <span> </span> <span>{</span> </div>
<div><span>    </span> <span>размер</span> <span>шрифта</span> <span>:</span> <span> </span> <span>14px</span> <span>;</span> </div>
<div><span>    </span> <span>набивка</span> <span>:</span> <span> </span> <span>20px</span> <span> </span> <span>30px</span> <span> </span> <span>20px</span> <span> </span> <span>50 пикселей</span> <span>;</span> </div>
<div> <span>}</span> </div>
<div> <span>,</span> <span>комментарий</span> — <span>список</span> <span> </span> <span>,</span> <span>дети</span> <span> </span> <span>{</span> </div>
<div><span>    </span> <span>поле</span> — <span>верх</span> <span>:</span> <span> </span> <span>40px</span> <span>;</span> </div>
<div><span>    </span> <span>граница</span> <span>:</span> <span> </span> <span>1px</span> <span> </span> <span>твердый</span> <span> </span> <span>#ccc;</span> </div>
<div> <span>}</span> </div>
<div> <span>,</span> <span>комментарий</span> — <span>список</span> <span> </span> <span>литий</span> <span> </span> <span>литий</span> <span> </span> <span>{</span> </div>
<div><span>    </span> <span>цвет</span> <span>фона</span> <span>:</span> <span> </span> <span># f5f5f6;</span> </div>
<div> <span>}</span> </div>
<div> <span>,</span> <span>комментарий</span> — <span>список</span> <span> </span> <span>литий</span> <span> </span> <span>литий</span> <span> </span> <span>литий</span> <span> </span> <span>{</span> </div>
<div><span>    </span> <span>цвет</span> <span>фона</span> <span>:</span> <span> </span> <span>#fff;</span> </div>
<div> <span>}</span> </div>
<div> <span>,</span> <span>комментарий</span> — <span>ответный</span> <span>ввод</span> <span>[</span> <span>type</span> = <span>email</span> <span>]</span> <span>,</span> </div>
<div> <span>,</span> <span>комментарий</span> — <span>ответный</span> <span>ввод</span> <span>[</span> <span>type</span> = <span>text</span> <span>]</span> <span>,</span> </div>
<div> <span>,</span> <span>комментарий</span> — <span>ответный</span> <span>ввод</span> <span>[</span> <span>type</span> = <span>url</span> <span>]</span> <span> </span> <span>{</span> </div>
<div><span>    </span> <span>ширина</span> <span>:</span> <span> </span> <span>50</span> <span>%</span> <span>;</span> </div>
<div> <span>}</span> </div>
<div> <span>,</span> <span>комментировать</span> — <span>отвечать</span> <span> </span> <span>этикетка</span> <span> </span> <span>{</span> </div>
<div><span>    </span> <span>дисплей</span> <span>:</span> <span> </span> <span>блок</span> <span>;</span> </div>
<div><span>    </span> <span>поле</span> — <span>справа</span> <span>:</span> <span> </span> <span>12 пикселей</span> <span>;</span> </div>
<div> <span>}</span> </div>
<div> <span>,</span> <span>запись</span> — <span>комментарии</span> <span> </span> <span>,</span> <span>комментарий</span> — <span>автор</span> <span> </span> <span>{</span> </div>
<div><span>    </span> <span>поле</span> — <span>снизу</span> <span>:</span> <span> </span> <span>0</span> <span>;</span> </div>
<div><span>    </span> <span>положение</span> <span>:</span> <span> </span> <span>родственник</span> <span>;</span> </div>
<div> <span>}</span> </div>
<div> <span>,</span> <span>запись</span> — <span>комментарии</span> <span> </span> <span>,</span> <span>комментарий</span> — <span>автор</span> <span> </span> <span>IMG</span> <span> </span> <span>{</span> </div>
<div><span>    </span> <span>граница</span> — <span>радиус</span> <span>:</span> <span> </span> <span>50</span> <span>%</span> <span>;</span> </div>
<div><span>    </span> <span>граница</span> <span>:</span> <span> </span> <span>5px</span> <span> </span> <span>твердый</span> <span> </span> <span>#fff;</span> </div>
<div><span>    </span> <span>слева</span> <span>:</span> <span> </span> — <span>80 пикселей</span> <span>;</span> </div>
<div><span>    </span> <span>верх</span> <span>:</span> <span> </span> — 5 <span>пикселей</span> <span>;</span> </div>
<div><span>    </span> <span>положение</span> <span>:</span> <span> </span> <span>абсолютный</span> <span>;</span> </div>
<div><span>    </span> <span>ширина</span> <span>:</span> <span> </span> <span>60px</span> <span>;</span> </div>
<div> <span>}</span> </div>
<div> <span>,</span> <span>вход</span> — <span>пинг</span> <span> </span> <span>,</span> <span>Ответить</span> <span> </span> <span>{</span> </div>
<div><span>    </span> <span>дисплей</span> <span>:</span> <span> </span> <span>нет</span> <span>;</span> </div>
<div> <span>}</span> </div>
<div> <span>,</span> <span>bypostauthor</span> <span> </span> <span>{</span> </div>
<div> <span>}</span> </div>
<div> <span>,</span> <span>форма</span> — <span>разрешено</span> — <span>теги</span> <span> </span> <span>{</span> </div>
<div><span>    </span> <span>цвет</span> <span>фона</span> <span>:</span> <span> </span> <span># f5f5f5;</span> </div>
<div><span>    </span> <span>размер</span> <span>шрифта</span> <span>:</span> <span> </span> <span>16 пикселей</span> <span>;</span> </div>
<div><span>    </span> <span>набивка</span> <span>:</span> <span> </span> <span>24px</span> <span>;</span> </div>
<div> <span>}</span> </div>
<div> <span>,</span> <span>комментарий</span> — <span>ответ</span> — <span>ссылка</span> <span>{</span> </div>
<div><span>    </span> <span>курсор</span> <span>:</span> <span> </span> <span>указатель</span> <span>;</span> </div>
<div><span>    </span> <span>цвет</span> <span>фона</span> <span>:</span> <span> </span> <span># 444;</span> </div>
<div><span>    </span> <span>граница</span> <span>:</span> <span> </span> <span>нет</span> <span>;</span> </div>
<div><span>    </span> <span>граница</span> — <span>радиус</span> <span>:</span> <span> </span> <span>3 пикселя</span> <span>;</span> </div>
<div><span>    </span> <span>цвет</span> <span>:</span> <span> </span> <span>#fff;</span> </div>
<div><span>    </span> <span>размер</span> <span>шрифта</span> <span>:</span> <span> </span> <span>12 пикселей</span> <span>;</span> </div>
<div><span>    </span> <span>шрифт</span> — <span>вес</span> <span>:</span> <span> </span> <span>300</span> <span>;</span> </div>
<div><span>    </span> <span>межбуквенный</span> <span>интервал</span> <span>:</span> <span> </span> <span>1px</span> <span>;</span> </div>
<div><span>    </span> <span>набивка</span> <span>:</span> <span> </span> <span>4px</span> <span> </span> <span>10px</span> <span> </span> <span>4 пикселя</span> <span>;</span> </div>
<div><span>    </span> <span>текст</span> — <span>преобразование</span> <span>:</span> <span> </span> <span>прописные буквы</span> <span>;</span> </div>
<div><span>    </span> <span>ширина</span> <span>:</span> <span> </span> <span>авто</span> <span>;</span> </div>
<div> <span>}</span> </div>
<div> <span>,</span> <span>комментарий</span> — <span>ответ</span> — <span>ссылка</span> <span>:</span> <span>hover</span> <span>{</span> </div>
<div><span>    </span> <span>цвет</span> <span>:</span> <span> </span> <span>#fff;</span> </div>
<div> <span>}</span> </div>
<div> <span>,</span> <span>комментарий</span> — <span>заметки</span> <span>{</span> </div>
<div><span>    </span> <span>дисплей</span> <span>:</span> <span>нет</span> <span>;</span> <span>   </span></div>
<div> <span>}</span> </div>
</div>
</td>
</tr>
</table>
</div>
</div>
<blockquote>
<p> В настоящее время мы используем плагин <a>комментариев Disqus</a> . Пока нам это нравится, и мы будем продолжать его использовать. </p>
</blockquote>
<div id="google-rating-element" data-id="1698" data-enabled="1" data-value="0"></div>
<div id="google-rating-element-hint" itemprop="aggregateRating" itemscope="" itemtype="http://schema.org/AggregateRating">
<div itemprop="name" class="google-rating-title">Как стилизовать и настроить форму комментариев WordPress? Кроме того, изменить внешний вид комментариев с помощью CSS</div>
<p><span itemprop="ratingValue">0.00</span> (0%) <span itemprop="ratingCount">0</span> votes<meta itemprop="bestRating" content="0"><meta itemprop="worstRating" content="0"></p>
<div itemprop="itemReviewed" itemscope="" itemtype="http://schema.org/CreativeWork"></div>
</div>
<div style="clear:both; margin-top:0em; margin-bottom:1em;"><a href="https://csharpcoderr.com/2021/" target="_blank" rel="nofollow" class="u3b37e7f57e75a67ada27c7bb6aeacf71"><style> .u3b37e7f57e75a67ada27c7bb6aeacf71 , .u3b37e7f57e75a67ada27c7bb6aeacf71 .postImageUrl , .u3b37e7f57e75a67ada27c7bb6aeacf71 .centered-text-area { min-height: 80px; position: relative; } .u3b37e7f57e75a67ada27c7bb6aeacf71 , .u3b37e7f57e75a67ada27c7bb6aeacf71:hover , .u3b37e7f57e75a67ada27c7bb6aeacf71:visited , .u3b37e7f57e75a67ada27c7bb6aeacf71:active { border:0!important; } .u3b37e7f57e75a67ada27c7bb6aeacf71 .clearfix:after { content: ""; display: table; clear: both; } .u3b37e7f57e75a67ada27c7bb6aeacf71 { display: block; transition: background-color 250ms; webkit-transition: background-color 250ms; width: 100%; opacity: 1; transition: opacity 250ms; webkit-transition: opacity 250ms; background-color: #95A5A6; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.17); -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.17); -o-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.17); -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.17); } .u3b37e7f57e75a67ada27c7bb6aeacf71:active , .u3b37e7f57e75a67ada27c7bb6aeacf71:hover { opacity: 1; transition: opacity 250ms; webkit-transition: opacity 250ms; background-color: #7F8C8D; } .u3b37e7f57e75a67ada27c7bb6aeacf71 .centered-text-area { width: 100%; position: relative; } .u3b37e7f57e75a67ada27c7bb6aeacf71 .ctaText { border-bottom: 0 solid #fff; color: #ECF0F1; font-size: 16px; font-weight: bold; margin: 0; padding: 0; text-decoration: underline; } .u3b37e7f57e75a67ada27c7bb6aeacf71 .postTitle { color: #2C3E50; font-size: 16px; font-weight: 600; margin: 0; padding: 0; width: 100%; } .u3b37e7f57e75a67ada27c7bb6aeacf71 .ctaButton { background-color: #7F8C8D!important; color: #ECF0F1; border: none; border-radius: 3px; box-shadow: none; font-size: 14px; font-weight: bold; line-height: 26px; moz-border-radius: 3px; text-align: center; text-decoration: none; text-shadow: none; width: 80px; min-height: 80px; background: url(https://csharpcoderr.com/wp-content/plugins/intelly-related-posts/assets/images/simple-arrow.png)no-repeat; position: absolute; right: 0; top: 0; } .u3b37e7f57e75a67ada27c7bb6aeacf71:hover .ctaButton { background-color: #95A5A6!important; } .u3b37e7f57e75a67ada27c7bb6aeacf71 .centered-text { display: table; height: 80px; padding-left: 18px; top: 0; } .u3b37e7f57e75a67ada27c7bb6aeacf71 .u3b37e7f57e75a67ada27c7bb6aeacf71-content { display: table-cell; margin: 0; padding: 0; padding-right: 108px; position: relative; vertical-align: middle; width: 100%; } .u3b37e7f57e75a67ada27c7bb6aeacf71:after { content: ""; display: block; clear: both; } </style><div class="centered-text-area"><div class="centered-text" style="float: left;"><div class="u3b37e7f57e75a67ada27c7bb6aeacf71-content"><span class="ctaText">ЧИТАТЬ ТАКЖЕ:</span>  <span class="postTitle">Как исправить ошибку 404 Page Not Found, добавив 301 Redirect с помощью метода .htaccess?</span></div></div></div><div class="ctaButton"></div></a></div>        </div>

<div class="td-post-sharing-bottom td-pb-padding-side"></div>            <div class="td-block-row td-post-next-prev"><div class="td-block-span6 td-post-prev-post"><div class="td-post-next-prev-content"><span>Предыдущая статья</span><a href="https://csharpcoderr.com/1697/">Настройка JVM: фундаментальный размер, размер стека и сборка мусора</a></div></div><div class="td-next-prev-separator"></div><div class="td-block-span6 td-post-next-post"><div class="td-post-next-prev-content"><span>Следующая статья</span><a href="https://csharpcoderr.com/1699/">Файл Ads.txt (авторизованных цифровых продавцов) и доход Google Adsense [все в одном руководстве]</a></div></div></div>            <div class="td-author-name vcard author" style="display: none"><span class="fn"><a href="https://csharpcoderr.com/author/admin/">admin</a></span></div>	        <span class="td-page-meta" itemprop="author" itemscope itemtype="https://schema.org/Person"><meta itemprop="name" content="admin"><meta itemprop="url" content="https://csharpcoderr.com/author/admin/"></span><meta itemprop="datePublished" content="2019-09-07T05:16:45+03:00"><meta itemprop="dateModified" content="2019-09-07T05:16:45+03:00"><meta itemscope itemprop="mainEntityOfPage" itemType="https://schema.org/WebPage" itemid="https://csharpcoderr.com/1698/"/><span class="td-page-meta" itemprop="publisher" itemscope itemtype="https://schema.org/Organization"><span class="td-page-meta" itemprop="logo" itemscope itemtype="https://schema.org/ImageObject"><meta itemprop="url" content="https://csharpcoderr.com/wp-content/uploads/2021/01/banner-news-ged.jpg"></span><meta itemprop="name" content="Актуальный новостной блог"></span><meta itemprop="headline " content="Как стилизовать и настроить форму комментариев WordPress? Кроме того, изменить внешний вид комментариев с помощью CSS"><span class="td-page-meta" itemprop="image" itemscope itemtype="https://schema.org/ImageObject"><meta itemprop="url" content="https://csharpcoderr.com/wp-content/themes/Newsmag/images/no-thumb/td_meta_replacement.png"><meta itemprop="width" content="1068"><meta itemprop="height" content="580"></span>        </footer>

</article>

<div class="td_module_related_posts td-animation-stack td_mod_related_posts td-cpt-post">
            <div class="td-module-image">
                <div class="td-module-thumb"><a href="https://csharpcoderr.com/2342/"  rel="bookmark" class="td-image-wrap " title="Многофункциональный плагин для веб-мастеров в репозитории WordPress.org" ><img class="entry-thumb" src=""alt="" data-type="image_tag" data-img-url="https://csharpcoderr.com/wp-content/plugins/td-composer/legacy/Newsmag/assets/images/no-thumb/td_238x178.png"  width="238" height="178" /></a></div>                <a href="https://csharpcoderr.com/category/optimizacija-i-uchebniki-po-wordpress/" class="td-post-category">Оптимизация и учебники по WordPress</a>            </div>
            <div class="item-details">
                <h3 class="entry-title td-module-title"><a href="https://csharpcoderr.com/2342/"  rel="bookmark" title="Многофункциональный плагин для веб-мастеров в репозитории WordPress.org">Многофункциональный плагин для веб-мастеров в репозитории WordPress.org</a></h3>            </div>
        </div>
        
	</div> </div></div><div class="td-next-prev-wrap"><a href="#" class="td-ajax-prev-page ajax-page-disabled" aria-label="prev-page" id="prev-page-tdi_3" data-td_block_id="tdi_3"><i class="td-next-prev-icon td-icon-font td-icon-menu-left"></i></a><a href="#"  class="td-ajax-next-page" aria-label="next-page" id="next-page-tdi_3" data-td_block_id="tdi_3"><i class="td-next-prev-icon td-icon-font td-icon-menu-right"></i></a></div></div> 
    <div class="comments" id="comments">
        	<div id="respond" class="comment-respond">
		<h3 id="reply-title" class="comment-reply-title">ОСТАВЬТЕ ОТВЕТ <small><a rel="nofollow" id="cancel-comment-reply-link" href="/1698/#respond" style="display:none;">Отменить ответ</a></small></h3><form action="https://csharpcoderr.com/wp-comments-post.php" method="post" id="commentform" class="comment-form"><div class="clearfix"></div>
            <div class="comment-form-input-wrap td-form-comment">
                <textarea autocomplete="new-password"  placeholder="Комментарий:" id="f76bb50600"  name="f76bb50600"   cols="45" rows="8" aria-required="true">

Пожалуйста, введите ваш комментарий!

пожалуйста, введите ваше имя здесь

Вы ввели неверный адрес электронной почты!

пожалуйста, введите свой адрес электронной почты здесь

Как стилизовать и настроить форму комментариев WordPress? Кроме того, изменить внешний вид комментариев с помощью CSS

Давайте начнем:

Способ-1) Использование файла functions.php — только для Genesis

Нет ответов ' , '

1 ответ ' , '

% ответов … ' ) , «генезис» ) ;

1 ответ ' , '

% ответов … ' ) , «генезис» ) ;

% ответов … ' ) , «генезис» ) ;

Способ-2) Для любой другой темы WordPress

ЭТО ИНТЕРЕСНО

Как правильно обменять Биткоин (BTC) на Сбербанк (Рубли)

Оптовая продажа металлопроката: кому и когда может быть интересна

Биржа криптовалют: что это и как работает

Маска REJURAN Skin Protection Mask — как работает «восстановление кожи»

Мирный договор или судебная война? Как правильно оформить раздел имущества и...

Альбомы и листы для монет: выбор и хранение

ЕЩЁ БОЛЬШЕ НОВОСТЕЙ

Альбомы и листы для монет: выбор и хранение

Стадии врастания ногтя: когда обращаться к подологу

Мирный договор или судебная война? Как правильно оформить раздел имущества и...

ПОПУЛЯРНЫЕ КАТЕГОРИИ

Давайте начнем:

Способ-1) Использование файла functions.php — только для Genesis

Нет ответов ' , ' 1 ответ ' , ' % ответов … ' ) , «генезис» ) ;

1 ответ ' , ' % ответов … ' ) , «генезис» ) ;

% ответов … ' ) , «генезис» ) ;

Способ-2) Для любой другой темы WordPress

ЭТО ИНТЕРЕСНО

ЕЩЁ БОЛЬШЕ НОВОСТЕЙ

ПОПУЛЯРНЫЕ КАТЕГОРИИ

Нет ответов ' , '

1 ответ ' , '

% ответов … ' ) , «генезис» ) ;

1 ответ ' , '

% ответов … ' ) , «генезис» ) ;