Show one blog post on mobile, and 3 on pc

Hi, I want my store (https://gemdrives.co.il) to show the blog posts in the homepage just the way it is now, but on mobile, to show only one featured blog post, and a button for more articles.

I know I can hire a Shopify expert, but I am trying to do it by myself, I have a little background in coding.

So in my featured-blog file, I was trying to replace


      {% for article in blog.articles limit: section.settings.post_limit %}
        - ... and on and on

with


        - ... and on and on

and it isn’t working, I guess I implemented the idea the wrong way, and also, this code doesn’t provide the button for all of the blog posts, but I guess i will be able to add it easily once I understand the idea.

Would appreciate any help. Thank you, Ishay.

What I believe you are missing is that the liquid is running on the server, while the javascript is running on the client, making for a bit of a mess.

The one thing you could do is add css classes and go from there.

I would prefer it to load or not load rather than hide or show in CSS,

rather case, I need to see the practical way to do it.

Thank you though.