サポート » 使い方全般 » 子テーマ内のカスタム投稿記事のレイアウトが崩れる

  • 解決済 yaneyoshi

    (@yaneyoshi)


    初めまして。
    初心者のためどうしても自己解決できず質問させていただきます。

    ■使用テーマ
    Lightning14.23.3(子テーマを作成し編集しています)

    ■やりたいこと
    Advanced Custom Fieldsを使用しカスタムフィールドに入力した内容を表示させたい

    ■現在の状態
    子テーマにsingle-works_example.phpを作成し、カスタムフィールドに入力した内容を表示させることには成功したのですが、ヘッダーやフッターが表示されず、レイアウトが崩れてしまいます。
    このページ以外は正常に表示されており、phpファイルの書き換えによりエラーが起きても、表示されなくなるのはこのページのみです。

    試しに「<?php get_header();?>」と「<?php get_footer();?>」以外の記述を削除してみたところ、wordpressの上部の黒いバー以外真っ白になりました。
    また、子テーマ内にheader.phpが無いことが原因かと思い、一度親テーマ内にsingle-works_example.phpをアップロードしてみましたが、同様に表示が崩れてしまいました。
    このことから、おそらく表記自体に誤りがあるのではないかと考えているのですが、どこを直せばいいのかが分かりません。

    ▼single-works_example.php

    <?php get_header();?>
    <div role="main">
      <div class="container-worksexample">
        <div class="box-worksexample">
        <?php if (have_posts()) :
          while (have_posts()) : the_post(); ?>
          <?php if( get_field('work-example_address') ) { ?>
          <p class="worksexample-area"><?php the_field('work-example_address'); ?>
    
          <?php } ?>
          <?php if( get_field('work-example_about') ) { ?>
          <p class="worksexample-title"><?php the_field('work-example_about'); ?>
    
          <?php } ?>
          <div class="works-pic">
          <p class="works-title">BEFORE
    
          <?php if( get_field('work-example_before') ): ?>
          	<img src="<?php the_field('work-example_before'); ?>" width="50%" />
          <?php endif; ?>
          </div>
          <div class="works-pic_after">
          <p class="works-title">AFTER
    
          <div id="mainImage">
            <?php if( get_field('work-example_after') ): ?>
            	<img src="<?php the_field('work-example_after'); ?>" width="50%" />
            <?php endif; ?>
          </div>
          </div>
          <p class="btm"><?php the_field('after_txt'); ?>
    
          <div class="works-box">
            <table class="works-tb">
              <tr>
                <th>工事内容</th>
                <td><?php if( get_field('work-example_content') ) { ?><?php the_field('work-example_content'); ?><?php } ?></td>
              </tr>
              <tr>
                <th>築年数</th>
                <td><?php if( get_field('work-example_age') ) { ?><?php the_field('work-example_age'); ?><?php } ?></td>
              </tr>		  
              <tr>
                <th>数量</th>
                <td><?php if( get_field('work-example_quantity') ) { ?><?php the_field('work-example_quantity'); ?><?php } ?></td>
              </tr>
              <tr>
                <th>費用</th>
                <td><?php if( get_field('work-example_cost') ) { ?><?php the_field('work-example_cost'); ?><?php } ?></td>
              </tr>
            </table>
          </div>
          </div>
          <?php the_content(); ?>
        <?php endwhile; ?>
        <?php else : ?>
          お探しの記事は見つかりませんでした。
    
        <?php endif; ?>
        <a href="<?php echo home_url() ?>/works"><p class="backlink">実績一覧に戻る
    </a>
       </div>
    </div>
    <?php get_footer(); ?>

    子テーマ内にあるのはstyle.cssとfunction.phpと今回作成したsingle-***.phpの3ファイルのみです。

    初歩的な内容でしたら申し訳ございません。
    ご指南いただけますと幸いです。

1件の返信を表示中 - 1 - 1件目 (全1件中)
  • トピック投稿者 yaneyoshi

    (@yaneyoshi)

    自己解決しました。
    <?php get_header();?>ではなく、親テーマのindexより
    <div class=”<?php lightning_the_class_name( ‘main-section’ ); ?>” id=”main” role=”main”>
    以前と
    <?php do_action( ‘lightning_main_section_append’, ‘lightning_main_section_append’ ); ?>
    以降をコピペしたところ正常に表示されました。

1件の返信を表示中 - 1 - 1件目 (全1件中)
  • トピック「子テーマ内のカスタム投稿記事のレイアウトが崩れる」には新たに返信することはできません。