0

I am new to OctoberCMS and I am stuck now, I am facing issue to use my custom blog posts component (which overrides Rainlab blog posts) in the same page multiple times.

Say I have created an alias of default blogPosts to postLists and I defined my custom HTML structure and it is working well, no issues.

Now what I want is to use the postLists post structure in my page for three different categories and here I am stuck because when I pass variable to component like this - { % component 'postLists' categoryFilter='news' %} it does not work for the category filter and if I select a category from drag drop component UI it becomes global categoryFilter setting for the page.

screenshot

This is my requirement.

requirements

My postList component code:-

{% set posts = __SELF__.posts %}
{% for post in posts %}

<div class="col-sm-6">
      <div class="row">
        <div class="col-sm-4 col-4 content_body_img">
            <a href="{{ post.url }}">
        {% if post.featured_images.count > 0 %}
            <img class="media-object" src="{{ post.featured_images.first.getThumb(108, 108) }}" />
        {% else %}
            <img class="media-object" src="http://placehold.it/108x108" />
        {% endif %}
    </a>
        </div>
        <div class="col-sm-8 col-8">
          <p><a href="{{ post.url }}">{{ post.title }}</a></p>
          <!--location_date-->
          <div class="location_date">
            <ul>
              <li><i class="fa fa-calendar"></i><span> {{ post.published_at|date('j F, Y') }}<span></li>
              <li><i class="fa fa-map-marker"></i>Dubai</li>
            </ul>
          </div>
          <!--location_date end -->
        </div>
      </div>
    </div>
    <!--content_body_img end -->
{% else %}
<div class="col-sm-6 col-6 col-lg-3">{{ noPostsMessage }}</div>
{% endfor %}

Please help me, any help will be very much appreciated.

Thanks Sanny

Hardik Satasiya
  • 9,547
  • 3
  • 22
  • 40
Sanny
  • 3
  • 3

1 Answers1

0

This is static Approach - I will post dynamic Approach as well give me some time

Best and possibly easy solution will be ( in case you just intend to show posts ) is to add 3 Post List component with Different Category filter option for each tab.

enter image description here

It should do your work

make sure this is optimal solution if you just need to show lists nothing else.

Hardik Satasiya
  • 9,547
  • 3
  • 22
  • 40
  • Thanks for your time and response, this was the first thing hit in my mind but I can not use this method because I have created a partial (which overrides default blogPosts partial html) for blogPosts and its alias is postList (blogPostsFood in your example), if I change alias I can not use my custom post loop structure. Please let me know if it make sense to you or you have a solution for this senario. – Sanny Jan 31 '19 at 10:42
  • yes i got that too so checking if we can make it dynamic Approach – Hardik Satasiya Jan 31 '19 at 10:46
  • any luck @Hardik? – Sanny Feb 01 '19 at 05:08
  • sorry i tried but no luck, I need to work on it but no time at the moment :( – Hardik Satasiya Feb 01 '19 at 11:37