現在、個別投稿は3つ作ってあるので、もしメインループで投稿の情報を取得できているなら、3つのa class="work"が表示されるはずです。アイキャッチに設定した画像も表示されません。
ちなみに、the_title();とすると、index.php(表示設定でホームのページにした固定ページ)のタイトルが表示されます。
whileやifなどのコードは、実際に表示に成功してるページの物をコピーしているので、コードのスペルミスではないと思います。
今あるページ表示用のファイルは、index.phpとsingle.phpで、index.phpをトップページの表示に使っています。
固定ページは、トップページとworksという名前の物を作り、表示設定では、ホームにトップページを設定し、workは投稿ページに設定しています。
↓index.php
php
1<?php get_header(); ?> 2<body> 3 <div class="loadingAnim" id="loadingAnim"><!-- ローディング --> 4 <i class="loadingAnim_line"></i> 5 </div> 6 <div class="page-top" id="back-to-top"> 7 <i class="fas fa-chevron-up page-top-icon"></i> 8 </div> 9 <header id="header"> 10 <ul> 11 <li><a href="#service" id="service-jump">Service</a></li> 12 <li><a href="#about" id="about-jump">About Me</a></li> 13 <li><a href="#works" id="works-jump">Works</a></li> 14 <li class="li-last"><a href="#contact" id="contact-jump">Contact</a></li> 15 </ul> 16 </header><!-- /header --> 17 <i class="fas fa-bars menu-bar"></i> 18 <div class="menu-res" id="menu-res"><!-- /responsive-menu --> 19 <ul> 20 <li><a href="#service" id="service-jump-res">Service</a></li> 21 <li><a href="#about" id="about-jump-res">About Me</a></li> 22 <li><a href="#works" id="works-jump-res">Works</a></li> 23 <li class="li-last"><a href="#contact" id="contact-jump-res">Contact</a></li> 24 </ul> 25 </div><!-- /responsive-menu ここまで --> 26 <section class="top"> 27 <div class="ttl" id="ttl"> 28 <h1>テスト</h1> 29 <h2>テスト</h2> 30 </div> 31 <div class="scroll-btn" id="scroll-btn"> 32 <span></span> 33 Scroll 34 </div> 35 </section> 36 <section class="service" id="service"> 37 <h1>Service</h1> 38 <p class="ttl-txt">テスト<br>テスト</p> 39 <div class="row"> 40 <div class="service-card col-lg-4 col-xs-11"> 41 <h1>Webサイト制作</h1> 42 <i class="fas fa-laptop"></i> 43 <p >テスト</p> 44 </div> 45 <div class="service-card col-lg-4 col-xs-11"> 46 <h1>スマホ対応</h1> 47 <i class="fas fa-mobile-alt"></i> 48 <p>テスト</p> 49 </div> 50 <div class="service-card col-lg-4 col-xs-12"> 51 <h1>Wordpress化</h1> 52 <i class="fas fa-cogs"></i> 53 <p>テスト</p> 54 </div> 55 </div> 56 </section> 57 <section class="about" id="about"> 58 <h1>About Me</h1> 59 <div class="row"> 60 <div class="txt-abv about-fadein-l col-lg-5 ml-lg-5 col-xs-12"> 61 <p class="txt-1">テスト <span>テスト</span></p> 62 <p class="txt-2">テスト<br>テスト</p> 63 <p class="txt-3">テスト</p> 64 </div> 65 </div> 66 <div class="row"> 67 <div class="txt-bot about-fadein-r col-lg-6 offset-lg-6 col-xs-12 mt-5"> 68 <p class="txt-1">テスト</p> 69 <div class="skill"> 70 <div class="txt-2"> 71 <div class="about-card"> 72 <i class="fab fa-html5"></i> 73 <p>HTML</p> 74 </div> 75 <div class="about-card"> 76 <i class="fab fa-css3-alt"></i> 77 <p>CSS</p> 78 </div> 79 <div class="about-card"> 80 <i class="fab fa-sass"></i> 81 <p>Sass</p> 82 </div> 83 </div> 84 <div class="txt-3"> 85 <div class="about-card"> 86 <p>Bootstrap</p> 87 </div> 88 <div class="about-card"> 89 <p>jQuery</p> 90 </div> 91 </div> 92 <div class="txt-4"> 93 <div class="about-card"> 94 <i class="fab fa-wordpress"></i> 95 <p class="wordpress">Wordpress</p> 96 </div> 97 <div class="about-card"> 98 <p>Xd</p> 99 </div> 100 <div class="about-card"> 101 <p>Photoshop</p> 102 </div> 103 </div> 104 </div> 105 </div> 106 </div> 107 </section> 108 <section class="works" id="works"> 109 <h1>Works</h1> 110 <?php if(have_posts()): ?> 111 <div class="row"> 112 <?php while ( have_posts() ) : the_post(); ?> 113 <a href="<?php the_permalink(); ?>" class="work col-lg-4 mt-5"> 114 <?php the_post_thumbnail(); ?> 115 </a> 116 <?php endwhile; ?> 117 </div> 118 <?php endif; ?> 119 </section> 120 <section class="contact" id="contact"> 121 <h1>Contact</h1> 122 <form method="post"> 123 <p>名前:</p><br> 124 <input type="text" name="name"> <br> 125 <p>メールアドレス:</p><br> 126 <input type="text" name="mail"><br> 127 <p>問い合わせ内容:</p><br> 128 <textarea name="inquiry"></textarea> 129 <input class="submit" type="submit" value="送信"> 130 </form> 131 </section> 132<?php get_footer(); ?>
よろしくお願いします。
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。