Editing comment section in Twenty Twenty theme

  • Resolved stefansofronijevic

    (@stefansofronijevic)


    5 years, 3 months ago

    Hi all,

    Hoping someone may be able to help before I drive myself mad…

    Very new to both WP and any kind of development and I’m trying to set up a blog. I’ve been messing around with CSS and have changed some of the formatting of the search bar/button at the bottom of the page and WP Forms. However, I’m trying to do the same with the comments section, I.E. add a radius, capitalize etc but I can’t for the life of me find the classes I need to edit despite trawling through theme editor for hours.

    I’d like to change all input fields relating to comments and the ‘POST COMMENT’/ ‘REPLY’ button.

    Any help would be greatly appreciated!

    The page I need help with: [log in to see the link]

Viewing 11 replies - 1 through 11 (of 11 total)
  • Vlad

    (@vladytimy)

    5 years, 3 months ago

    Hi, @stefansofronijevic

    I recommend asking at https://wordpress.org/support/theme/twentytwenty so the theme’s developers and support community can help you with this.

    Also, make sure to use a child theme, so next time the theme gets an update you don’t loose your custom changes.

    Kind regards!

    Thread Starter stefansofronijevic

    (@stefansofronijevic)

    5 years, 3 months ago

    Thanks @vladytimy, I’ve added a post in there now!

    Dumb question, I’ve not been altering the code in Theme Editor, I’ve just been adding it under ‘Additional CSS’ in Customise. Will I still need to look in to using a child theme in this instance?

    Many thanks!

    Vlad

    (@vladytimy)

    5 years, 3 months ago

    If you used ‘Additional CSS’ then that code is stored in the database and will not go away when the theme gets an update. Regardless, it is always recommended to have backups – just in case.

    But no, in this case a child theme is not necessary. Just if you want to explore new things. 😊

    Vlad

    (@vladytimy)

    5 years, 3 months ago

    You can learn how to use the Chrome Developer Tools or Firefox Developer Tools to help you see and test changes to your CSS.

    Hope this helps.

    Thread Starter stefansofronijevic

    (@stefansofronijevic)

    5 years, 3 months ago

    Hi @vladytimy, you solved it!

    I inspected the fields using Chrome Developer Tools and through trial and error found the code I needed edit.

    Thanks a lot!

    Vlad

    (@vladytimy)

    5 years, 3 months ago

    Awesome! Happy to help!
    I’m glad you now know how to use Developer Tools – that can help you a lot with any future CSS modifications.
    Regards!

    Thread Starter stefansofronijevic

    (@stefansofronijevic)

    5 years, 3 months ago

    @vladytimy sorry to bother you again, but I’m not having luck on my other threads…

    I want to change the divider on the blog posts and the comments section to a straight solid line.

    I’ve managed to get the straight line in by adding in the below but I can’t get rid of the two centred forward slashes?

    hr.styled-separator {
    border-top: 1px solid;

    The page I need help with: https://thenewanalysts.com/?page_id=14

    Any thoughts/help would be greatly appreciated!

    Thread Starter stefansofronijevic

    (@stefansofronijevic)

    5 years, 3 months ago

    @vladytimy as a point I used your tip on Developer Tools to find hr.styled-separator! I just can’t find out how to get rid of the slashes 🙁

    Vlad

    (@vladytimy)

    5 years, 3 months ago

    CSS has some pseudo-elements that aren’t so obvious.
    You can read about them here: https://www.w3schools.com/css/css_pseudo_elements.asp
    I’m talking about :before and :after

    Try this to hide the slashes:

    
hr.post-separator:before, hr.post-separator:after {display:none;}
    Thread Starter stefansofronijevic

    (@stefansofronijevic)

    5 years, 3 months ago

    @vladytimy again life saver! Thank you so much!

    I had to adjust it to:

    hr.styled-separator:before, hr.styled-separator:after {display:none;}

    Because I wanted the slashes removed throughout the site as they were being used in the comments section etc. But otherwise worked perfectly!

    I’ll have a read about the pseudo-elements as well, thanks again!

    Vlad

    (@vladytimy)

    5 years, 3 months ago

    Sounds great! Good luck exploring that theme 😊

Viewing 11 replies - 1 through 11 (of 11 total)

The topic ‘Editing comment section in Twenty Twenty theme’ is closed to new replies.