Type: Choose between Default and With Lines (title in the center, lines before and after title) types.
Default type provides the following settings:
Gap: Set a gap between comment title and comments for desktop, tablet and mobile.
Width Auto: Slide to YES to enable auto width for desktop, tablet and mobile.
You can see how it functions when Background Color is set.
Alignment: Choose between Left, Center and Right comment title alignment.
Typography: Set a Typography using settings from the dropdown.
Color: Choose a Color from a color palette or dynamic tags.
Background color: Choose a Background color from a color palette or dynamic tags.
Border Type: Choose desired Border Type from the dropdown and set it.
Title Icon: Choose the icon to be shown before title from Icon library or upload desired SVG and set it.
With Lines type provides the following settings:
Gap: Set a gap between comment title and comments for desktop, tablet and mobile.
Width: Set Title width for desktop, telegram and mobile.
Lines Type: Choose the Lines Type from the dropdown.
Lines Width: Set the Lines width for desktop, telegram and mobile.
Lines Color: Choose Lines Color from a color palette or dynamic tags.
Border Gap: Set a gap between lines and title for desktop, tablet and mobile.
Typography: Set a Typography using settings from the dropdown.
Title Color: Choose Title Color from a color palette or dynamic tags.
Title Icon: Choose the icon to be shown before title from Icon library or upload desired SVG and set it.
Categories
Post Comments Widget
The Post Comments widget is one of the available Single Post Template widgets that is used to dynamically display post’s user comments.
Content
Choose a Skin between Content Template, Custom and Facebook.
Content Template Skin uses the currently active theme comments design and layout to display the comment form and comments.
Custom Skin allows you to Search and Select the post comments to which you’d like to display.
Comment List
Avatar Position: Choose Avatar position between Aside (avatar stays aside from the content) and With Author (avatar is displaying in line with author and date)
Avatar Size: Set Avatar Size for desktop, tablet and mobile.
Author
Author Text After: Add a text that will be displayed after the author.
Highlight Post Author: Slide to YES to highlight post author.
Date
Position: Choose between Inline (date is displaying in line with author) and Block positions.
When Inline position is activated you can also choose where Date should be located between Start and End Position in Line.
Date Format: Choose a Date format from the dropdown.
Time Format: Choose Time format from the dropdown.
Icon: Choose the icon to be shown before date from Icon library or upload desired SVG.
Time Separator: Add desired separator between date and time (for example, ‘at’: July,24,2020 at 9:17 am)
Reply
Position: Choose between Inline (‘Reply’ is displaying in line with author) and Block positions.
When Inline position is activated you can also choose where ‘Reply’ should be located between Start and End Position in Line.
Type: Choose between Text, Text and Icon and Icon types.
Form
Gap: Set a gap between comments and form.
Separator: Slide to YES to enable separator between comments and form and set it.
View as: Switch between Logged in\Logged out options to see how the form is displaying for logged in\logged out users.
Comment Field
Direction: Choose between Row (textarea and inputs in one column) and Aside (separates textarea and inputs to columns) directions.
Position: Choose between Start and End position for Comment field.
Number of Rows: Choose a number of rows used on a Comment field.
Width: Set Comment field width for desktop, tablet and mobile.
Input
Gap: Set a Gap between Input and Comment fields.
Gap Between: Set a Gap between Input fields.
Form Button
Button Text: Add desired button text here.
Full Width: Slide to YES to make a button full width.
Alignment: Choose between Right, Center and Left button alignment.
Use Website Input: Slide to YES to add a Website input.
Advanced options
Leave a Reply Text: Add desired ‘Leave a Reply Text’ here.
Leave a Reply to Text: Add desired ‘Leave a Reply to Text’ here. (is used to answer to another comment)
Label
Use Label Instead of Placeholder: Slide to YES to use labels instead of placeholders.
Disable Comment Text: Slide to YES to disable the word ‘Comment’ in the form.
Comment: Add desired ‘Comment’ text here.
Name: Add desired ‘Name’ text here.
Email: Add desired ‘Email’ text here.
Enable Icon: Slide to YES to enable icons in labels.
Form Elements Gap
Comment Notes: Set a gap between Comment notes and Form.
Cookies Consent: Set a gap between Cookies and Form.
Button: Set a gap between Form and Button.
Navigation
Navigation can be set when ‘Break comments into pages’ option is enabled on Settings/Discussion/Other comment settings field.
Type: Choose navigation type between Text, Text+Icon or Icon and set it.
Text: Add desired text for ‘previous’ and ‘next’ links.
Style
Comments Title
Type: Choose between Default and With Lines (title in the center, lines before and after title) types.
Default type provides the following settings:
Gap: Set a gap between comment title and comments for desktop, tablet and mobile.
Width Auto: Slide to YES to enable auto width for desktop, tablet and mobile.
You can see how it functions when Background Color is set.
Alignment: Choose between Left, Center and Right comment title alignment.
Typography: Set a Typography using settings from the dropdown.
Color: Choose a Color from a color palette or dynamic tags.
Background color: Choose a Background color from a color palette or dynamic tags.
Border Type: Choose desired Border Type from the dropdown and set it.
Title Icon: Choose the icon to be shown before title from Icon library or upload desired SVG and set it.
With Lines type provides the following settings:
Gap: Set a gap between comment title and comments for desktop, tablet and mobile.
Width: Set Title width for desktop, telegram and mobile.
Lines Type: Choose the Lines Type from the dropdown.
Lines Width: Set the Lines width for desktop, telegram and mobile.
Lines Color: Choose Lines Color from a color palette or dynamic tags.
Border Gap: Set a gap between lines and title for desktop, tablet and mobile.
Typography: Set a Typography using settings from the dropdown.
Title Color: Choose Title Color from a color palette or dynamic tags.
Title Icon: Choose the icon to be shown before title from Icon library or upload desired SVG and set it.
Comment
Gap Between Comments: Set a gap between comments for desktop, tablet and mobile.
Level Gap: Set a gap for child comments’ levels for desktop, tablet and mobile.
Background Type: Choose a background type between Classic and Gradient and set it.
Comment Child
Avatar Size: Set the avatar size for desktop, tablet and mobile.
Background Type: Choose a background type between Classic and Gradient and set it.
Color: Choose a Color from a color palette or dynamic tags.
Border Type: Choose desired Border Type from the dropdown and set it.
Border Radius: Set a border radius to the field.
Padding: Set paddings to the field.
Box Shadow: Choose desired settings from the dropdown.
Thread Line
Width: Set desired width for desktop, tablet and mobile.
Color: Choose a Color from a color palette or dynamic tags.
Avatar
Gap: Set a gap between Avatar and other elements for desktop, tablet and mobile.
Border Type: Choose desired Border Type from the dropdown and set it.
Author
Gap: Set a gap between Author and other elements for desktop, tablet and mobile.
Typography: Set a Typography using settings from the dropdown.
Color: Choose a Color from a color palette or dynamic tags. (for Normal and Hover modes)
For Hover Mode you can also set Transition duration, i.e. choose the amount of time to transition from one filter setting to the other when hovering over the Author.
Reply
Gap: Set a gap between Reply and other elements for desktop, tablet and mobile.
Use as Button: Slide to YES to show ‘Reply’ as a button and set it.
Typography: Set a Typography using settings from the dropdown.
Color: Choose a Color from a color palette or dynamic tags. (for Normal and Hover modes)
For Hover Mode you can also set Transition duration, i.e. choose the amount of time to transition from one filter setting to the other when hovering over ‘Reply’.
Date
Typography: Set a Typography using settings from the dropdown.
Color: Choose a Color from a color palette or dynamic tags.
Date Icon
Gap: Set a gap between Icon and Date.
Size: Set desired Icon size here.
Color: Choose a Color from a color palette or dynamic tags.
Edit
Gap: Set a gap between ‘Edit’ and Date for desktop, tablet and mobile.
Hover Color: Choose a Hover Color from a color palette or dynamic tags.
Content
Gap: Set a gap between Content and other fields for desktop, tablet and mobile.
Typography: Set a Typography using settings from the dropdown.
Color: Choose a Color from a color palette or dynamic tags.
Navigation
Gap: Set a gap between navigation links and comments.
Text
Typography: Set a Typography using settings from the dropdown.
Use as Button: Slide to YES to show the navigation link as a button and set it.
Color: Choose a Color from a color palette or dynamic tags. (for Normal and Hover modes)
For Hover Mode you can also set Transition duration, i.e. choose the amount of time to transition from one filter setting to the other when hovering over the navigation link.
Form Title
Gap: Set a gap between Form title and form for desktop, tablet and mobile.
Alignment: Choose between Right, Center and Left button alignment.
Typography: Set a Typography using settings from the dropdown.
Color: Choose a Color from a color palette or dynamic tags.
Title Icon: Choose the icon to be shown before title from Icon library or upload desired SVG and set it.
Set Reply to and Cancel reply links. For both you can set
Gap: Set a gap between ‘Reply to/Cancel Reply’ and ‘Leave a Reply’ for desktop, tablet and mobile.
Typography: Set a Typography using settings from the dropdown.
Color: Choose a Color from a color palette or dynamic tags.
Hover Color: Choose a Hover Color from a color palette or dynamic tags.
Transition duration: Choose the amount of time to transition from one filter setting to the other when hovering over the ‘Reply to/Cancel Reply’.
Form
Background color: Choose a Background color from a color palette or dynamic tags.
Border Type: Choose desired Border Type from the dropdown and set it.
Border Radius: Set a border radius to the form.
Padding: Set paddings to the form.
Box Shadow: Choose desired settings from the dropdown.
Form Elements
Gap: Set a gap between Form and Comments.
Form Typography: Set a Typography using settings from the dropdown.
Border Type: Choose desired Border Type from the dropdown and set it.
Color: Choose a Color from a color palette or dynamic tags. (for Normal and Focus modes)
Background Color: Choose a Background Color from a color palette or dynamic tags. (for Normal and Focus modes)
For Focus Mode you can also set Transition duration, i.e. choose the amount of time to transition from one filter setting to the other.
Box Shadow: Choose desired settings from the dropdown.
Border Radius: Set a border radius to the field.
Padding: Set paddings to the field.
Input Icon
Size: Set desired Icon size here.
Color: Choose a Color from a color palette or dynamic tags.
Form Button
Typography: Set a Typography using settings from the dropdown.
Border Type: Choose desired Border Type from the dropdown and set it.
Color: Choose a Color from a color palette or dynamic tags. (for Normal and Hover modes)
Background Color: Choose a Background Color from a color palette or dynamic tags. (for Normal and Hover modes)
For Hover Mode you can also set Transition duration, i.e. choose the amount of time to transition from one filter setting to the other.
Box Shadow: Choose desired settings from the dropdown.
Border Radius: Set a border radius to the field.
Padding: Set paddings to the field.
Additional Form Elements
Color: Choose a Color from a color palette or dynamic tags.
Typography: Set a Typography using settings from the dropdown.
‘Logged in as’ Hover Color: Choose a Color from a color palette or dynamic tags.
Advanced
Set the Advanced options that are applicable to this widget
Related Articles