elseとendwhileにエラーが出てしまう

Question

前提・実現したいこと

WordPressで、アイキャッチ画像がある場合はそれを表示して、無い場合は指定した画像を表示させたいです。
ですが、else:の部分とendwhile;の部分にエラーが出てしまいます。

ご教示いただけますと幸いです。

発生している問題・エラーメッセージ

vscode側

Unexpected 'else'.intelephense(1001)

WordPress側

 Parse error: syntax error, unexpected token "else" in /Users/sawaikai/Local Sites/engress/app/public/wp-content/themes/heighter/index.php on line 223

該当のソースコード

<section class="blog">
        <h3 class="blog_title">ブログ</h3>
        <div class="blog_articles">
          <?php if (have_posts()) : ?>
          <?php while (have_posts()) : the_post(); ?>
          <a href="<?php the_permalink() ;?>">
            <article class="blog_article">
              <figure class="blog_article-img-box">
                <?php the_post_thumbnail( 'thumbnail' ); ?>
                <?php else:?>
                <img src="<?php get_template_directory_uri() ; ?>img/sample01.svg" />
                <small class="blog_category">カテゴリー</small>
              </figure>
              <div class="blog_article-text-box">
                <p class="blog_article-title"><?php the_title(); ?>
                </p>
                <small class="blog_article-date">
                  <?php the_date(); ?></small>
                </small>
              </div>
            </article>
          </a>
          <?php endwhile; ?>
          <?php endif; ?>
        </div>
      </section>

試したこと

このサイトを参考にしてみました。
参考サイト

補足情報（FW/ツールのバージョンなど）

vscodeを使用しています。

Answer 1

最小限にしてインデントつけるとわかりますが、現状だと

if
  while
    else
  endwhile
endif

という構成になっていて、対応があっていません。何にも所属しないelseがいきなり出ています。

参考先は下記のようになっています。

if
  while
    if
    endif
  endwhile
else
endif

まずはhtmlを必要最小限にして動作確認されることを強くすすめます。

Comments

[seakai]

よく見直してコードを変更するとできました。
ありがとうございました。

[m.ts10806]

「構造だけ抜き出す」「最小構成にする」はあらゆる場面で採用できる問題切り分け方法です。

Answer 2

<?php else:?>を削除するか、参考サイトを読み直して必要なifを追加する。

Comments

[seakai]

参考サイトと照らし合わせてifを追加するとできました。
ありがとうございました。