How to remove "Liquid syntax error" message on shopify comment section

[lunahlife]

Need help please.

We are facing some issue in our Shopify blog page as below:

• How to remove “Liquid syntax error” message on shopify comment section

• How to add square box on the leave comment section for Name, Email & Message

Here is our website and attached for your reference.
https://lunahlife.com/blogs/news/how-to-prep-your-skin-for-outside-elements

Thank you so much

[Zworthkey]

@lunahlife
Welcome to Shopify Community.
Kindly share the code of the 'main-article.liquid’ file.
So that we can help you.

How to Send this code? kindly Follow this instruction:

1. Navigate to Online Store->Theme->Edit code
2. sections->/main-article.liquid ->Copy the whole code and it to us.

thank you

[oscprofessional]

@lunahlife

The error is caused by the included ‘form-status.liquid’ file, change the following line:

{%- if form.errors.translated_fields | size == 1 and form.errors.first == 'form' -%}

To this:

{%- if form.errors.translated_fields and form.errors.translated_fields.size == 1 and form.errors.first == 'form' -%}

[lunahlife]

Hi @oscprofessional

Thank you so much. Its working now

Do you know how to add square box on the leave comment section? Please see attached

Best

[oscprofessional]

@lunahlife ,

form#comment_form input, textarea#CommentForm-body {
    border: 1px solid #000;
}

Add this css at the bottom of Online Store->Theme->Edit code->Assets->theme.scss.liquid

[lunahlife]

Hi @oscprofessional

Thanks again for your reply.

I cant find “theme.scss.liquid” on the Assets. Only “theme.css.liquid” is available. Tried to add that code here, but still not working. Do you know where I can find that code? please see attached.

Thanks so much

[oscprofessional]

@lunahlife ,

Theme.css.liquid

form#comment_form input, textarea#CommentForm-body {
    border: 1px solid #000 !important;
}

now add in theme.css

[lunahlife]

Hi @oscprofessional

Thanks again for your reply.

I try to added the code in the bottom of Theme.css.liquid, but still look the same. Do you know why?

Please see attached. thanks

[oscprofessional]

Hi @lunahlife ,

.comment-form form-vertical textarea#CommentForm-body, input#CommentForm-author, input#CommentForm-email {
    border: 1px solid #000;
}

Add this css at the bottom of Online Store->Theme->Edit code->Assets->theme.scss.liquid

You are adding in media query… add at the bottom

[Zworthkey]

@lunahlife

.disclosure__toggle, input, select, textarea {
    border: 1px solid black !important;
}

Add this code in the theme.scss file

[oscprofessional]

@lunahlife ,

Or try to add at the top…

[lunahlife]

Hi @oscprofessional @Zworthkey

I did add at the bottom (tried both codes that advise), But still look the same.

Do you think its because need to add at Online Store->Theme->Edit code->Assets->theme.scss.liquid ?

In our Shopify, I only can find Online Store->Theme->Edit code->Assets->theme.css.liquid (please see attached)

Thanks

[oscprofessional]

@lunahlife ,

your file is correct.

.comment-form form-vertical textarea#CommentForm-body, input#CommentForm-author, input#CommentForm-email {
    border: 1px solid #000 !important;
}

try to add at the top of the file…

[lunahlife]

Yay! Thanks @oscprofessional

But, only 2 sections have square box now: name & email

How to add the box on the “comment” section too?

[oscprofessional]

@lunahlife ,

textarea#CommentForm-body {
    border: 1px solid #000;
}

[lunahlife]

Perfect. all good now. Thank you so much @oscprofessional

[oscprofessional]

@lunahlife ,

If the solution is helpful to you please give likes and accept it !