【Laravel】bootstrapのタブの導入ができない。

Question

こんにちは。

Laravelで商品の一覧表示をする際にbootstrapのタブを導入したいのですが、

syntax error, unexpected 'else' (T_ELSE), expecting end of file

というエラーが表示されます。商品にcategory_idが1~4までついていて、if文で表示される商品を数字によって切り替えたいです。

if文のところでエラーが出ているようなので、bootstrapの問題ではない気がするのですが、答えが出せず質問させていただきました。

以下コードになります。

                        @if(count($products) > 0)
                            <div class="col-md-9">
                                @if (session()->has('message'))
                                <div class="alert alert-success mt-3">
                                    <ul>
                                        <li>{{ session()->get('message') }}</li>
                                    </ul>
                                </div>
                                @endif
                                <!-- 4個分のタブ -->
                                <ul class="nav nav-tabs">
                                    <li class="nav-item">
                                        <a href="#photo1" class="nav-link active" data-toggle="tab">メインメニュー</a>
                                    </li>
                                    <li class="nav-item">
                                        <a href="#photo2" class="nav-link" data-toggle="tab">ランチメニュー</a>
                                    </li>
                                    <li class="nav-item">
                                        <a href="#photo3" class="nav-link" data-toggle="tab">ドリンク</a>
                                    </li>
                                    <li class="nav-item">
                                        <a href="#photo4" class="nav-link" data-toggle="tab">デザート</a>
                                    </li>
                                </ul>
                                <!-- 写真部分 -->
                                <div class="tab-content">
                                    <div id="photo1" class="tab-pane active">
                                        @foreach($products as $product)
                                        @if($product->category_id == 1)
                                        <li class="list-group-item border rounded">
                                            <!-- Custom content-->
                                            <div class="media align-items-lg-center flex-column flex-lg-row p-3">
                                                <div class="media-body order-2 order-lg-1">
                                                    <h5 class="mt-0 font-weight-bold mb-2">{{$product->name}}</h5>
                                                    <p class="font-italic text-muted mb-0 small">{{$product->description}}</p>
                                                    <div class="d-flex align-items-center justify-content-between mt-1">
                                                        <h5 class="font-weight-bold my-2">￥{{$product->price}}</h5>
                                                        <div>
                                                            <a href='product/edit/{{$product->id}}' class="btn btn-primary mt-3">編集</a>
                                                        </div>
                                                    </div>
                                                </div>
                                                @if($product->image == null)
                                                <img src="/storage/image/no_image.png" alt="{{$product->name}}" width="200" class="ml-lg-5 order-1 order-lg-2">
                                                @else
                                                <img abc1 src="/storage/product/{{$product->image}}" alt="{{$product->name}}" width="200" class="ml-lg-5 order-1 order-lg-2">
                                                @endif
                                            </div>
                                            <!-- End -->
                                        </li>
                                        <!-- End -->
                                        @endif
                                        @endforeach
                                        @else
                                        <div class="alert alert-primary col-md-9">
                                            <ul>
                                                <li>表示するメニューがありません。</li>
                                            </ul>
                                        </div>
                                        @endif
                                    </div>

                                    <div id="photo1" class="tab-pane active">
                                        @foreach($products as $product)
                                        @if($product->category_id == 2)
                                        <li class="list-group-item border rounded">
                                            <!-- Custom content-->
                                            <div class="media align-items-lg-center flex-column flex-lg-row p-3">
                                                <div class="media-body order-2 order-lg-1">
                                                    <h5 class="mt-0 font-weight-bold mb-2">{{$product->name}}</h5>
                                                    <p class="font-italic text-muted mb-0 small">{{$product->description}}</p>
                                                    <div class="d-flex align-items-center justify-content-between mt-1">
                                                        <h5 class="font-weight-bold my-2">￥{{$product->price}}</h5>
                                                        <div>
                                                            <a href='product/edit/{{$product->id}}' class="btn btn-primary mt-3">編集</a>
                                                        </div>
                                                    </div>
                                                </div>
                                                @if($product->image == null)
                                                <img src="/storage/image/no_image.png" alt="{{$product->name}}" width="200" class="ml-lg-5 order-1 order-lg-2">
                                                @else
                                                <img abc1 src="/storage/product/{{$product->image}}" alt="{{$product->name}}" width="200" class="ml-lg-5 order-1 order-lg-2">
                                                @endif
                                            </div>
                                            <!-- End -->
                                        </li>
                                        <!-- End -->
                                        @endif
                                        @endforeach
                                        @else
                                        <div class="alert alert-primary col-md-9">
                                            <ul>
                                                <li>表示するメニューがありません。</li>
                                            </ul>
                                        </div>
                                        @endif
                                    </div>
                                </div>
                            </div>

Laravelのバージョンは7.15.0です。

説明が拙いところもあると思いますが、もし解決策をご存知の方がいらっしゃいましたらご教授お願いいたします。

よろしくお願いいたします。

Comments

[m.ts10806]

タイトルと起きてる現象が離れてます。
起きてる問題（要件）をタイトルにしてください。

Answer 1

どこかでifとelseの対応を間違えてるだけだろうから
複雑化したらまずファイルを分割。

<div id="photo1" class="tab-pane active">
@foreach($products as $product)
    @include('photo1')
@endforeach

自分が理解できる規模に整理すれば間違いに気付ける。