2

I created html template using radio buttons as tabs as you can see in the picture. When user click on any of the tabs the relevant entries for that month display and the rest hidden.

I created matrix field to group the calendar field and other text fields but my question is how to dynamic display all entries for each month? So that I can use CSS to hide other entries and show entries when tab are selected.

enter image description here enter image description here

3

You could do this multiple ways.

One you could create a category with each month and an input for your entries and assign that month to each category. Then it would be a matter of calling that categories relatedTo param using each Month Category ID.

{% set monthIds = craft.categories.group('months').ids() %}

{% for monthId in monthIds %}
    <div>
        {# group each months entries #}
        {% for item in craft.entries.section('sectionName').relatedTo({targetElement:monthId}) %}
            {# content for each entry. #}
        {% endfor %}
    </div>
{% endfor %}

Two you could use your eventStart field.

{# 1 == January #}
{% set months  = ["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"] %}
{% for month in 1..12 %}
    <div>
        {# group each months entries #}
        {% set idx = month - 1%}
        <h3>{{ months[idx] }}</h3>
        {% for item in craft.entries.section('blog') if item.eventStart|date("n") == month %}
            {# content for each entry. #}
            <h3>{{item.title}}</h3>
        {% endfor %}
    </div>
{% endfor %}
| improve this answer | |
  • Thank aran for the codes. I tried the last option you provided. It works perfectly but it repeat the word Month twelve times Month 1, Month 2 etc. How to use the month name instead? (Jan, Feb etc) do I have to create array name like 1 = Jan, 2 = Feb etc? – William Spark Feb 20 '17 at 4:54
  • I have updated the answer to help you with that. – aran Feb 20 '17 at 4:58
  • Thank for the update. I test it and return error Internal Server Error Unexpected character "#". – William Spark Feb 20 '17 at 5:21
  • I have updated the answer it was missing closing brackets for month name. – aran Feb 20 '17 at 5:38

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.