I'm building a news site. I want to get 6 latest posts by 3 specific categories, lets say id 2, 3, 4, and display them in 3 tabs on homepage.
Each tab is divided in 2 column, col-6. one col-6 display the latest record, the other display a list of another 5 records after the latest one.
Here's my controller, I get 6 latest records from database
$post_tabs = Post::with('categories')->latest()->limit(6)->get();
this I get 3 categories that have id 2, 3, 4
$category_tabs = Category::with('posts')->whereIn('id', [2, 3, 4])->get();
In blade view, I managed to display that 3 categories, like so
<div class="collapse navbar-collapse justify-content-between" id="navbarToggler1">
<ul class="nav nav-sm navbar-nav mr-md-auto mr-lg-0 mt-2 mt-lg-0 align-self-end" role="tablist">
@foreach($category_tabs as $tab_category)
<li class="nav-item">
<a class="nav-link bg-color-tech active" id="nav-outdoor-tab-" data-toggle="tab" href="#nav-outdoor-" role="tab" aria-selected="true">
</a>
</li>
@endforeach
</ul></div>
Now I don't know how to display posts of those categories by tabs, this is what i 've got so far, which only display 6 latest post and I don't know how to make tabs work either
@foreach($post_tabs as $key => $post_tab)
<div class="tab-content" id="nav-tabContent">
<div class="tab-pane fade show active" id="nav-outdoor- --}}" role="tabpanel">
<div class="row clearfix">
<div class="col-lg-6">
@if ($loop->first)
<article>
<div class="entry-image mb-3">
<a href=""><img src="" alt=""></a>
@foreach($post_tab->categories as $category)
<div class="entry-categories"><a href="#" class="bg-tech"></a></div>
@endforeach
</div>
<div class="entry-title">
<h3><a target="_blank" href=""></a></h3>
</div>
<div class="entry-content clearfix">
<p></p>
</div>
</article>
</div>
<div class="col-lg-6">
@foreach($post_tabs as $key => $post_tab)
@if($key > 0)
<article>
<div class="entry-image">
<a href="#"><img src="" alt=""></a>
</div>
<div class="entry-c">
<div class="entry-title">
<h4><a href="#"></a></h4>
</div>
</div>
</article>
@endif
@endforeach
@endif
</div>
</div>
</div>
</div>
@endforeach
Thank you so much.
via Chebli Mohamed
Aucun commentaire:
Enregistrer un commentaire