前回、回答やアカウントの削除、ユーザーアイコンの追加、変更のページについてまとめました。↓
今回は過去のお題の一覧表示(アーカイブ)ページについてまとめたいと思います。
アーカイブの内容については、
①メニュー画面から全期間か月別の過去お題閲覧ページに遷移できるようにしておく。
②遷移したページで、お題のアイコン一覧を最大で4つ程表示させる。つまり、月別では1ページが1月分のお題となる。
③全期間にはページネーションをつけておく。
④お題のアイコンクリックで、お題、結果、回答が閲覧できるようにしておく。
⑤表示された過去回答ページにもページネーションをつけておく。
こんな感じにしたいと思います。
メニュー表示
月別の自動表示
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 |
<?php try { $dsn = "mysql:host=localhost;dbname=oogiri;charset=utf8"; $user = "root"; $password = ""; $dbh = new PDO($dsn, $user, $password); $dbh -> setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION); $sql = "SELECT stamp FROM toukou WHERE stamp LIKE '20%' ORDER BY stamp DESC"; $stmt = $dbh -> prepare($sql); $stmt -> execute(); $dbh = null; while(true) { $rec = $stmt -> fetch(PDO::FETCH_ASSOC); if(empty($rec) === true) { break; } print "<li><a href='kako_tukibetu.php?stamp=".$rec['stamp']."'>"; print $rec["stamp"]; print "</a></li>"; // print "<br>"; } |
メニュー画面のアーカイブ、月別のリンクは自動で表示される仕組みにしています。
サイドナビの記述部分になります。投稿テーブルから”20”で始まる文字列をstampカラムで走査し、該当するレコードを抜き出します。
stampカラムには、月初めのお題にだけ”2022年4月”のように情報を登録しておきます(cmsで)。これで過去お題の月別数が分かるので、あとはリンクを貼るだけです。
アーカイブ
全期間
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 |
<warapper> <main> <h2>過去のお題</h2> <br> <?php try { $max = 5; require_once("common/common.php"); $get = sanitize($_GET); if(empty($get["page"]) === true or $get["page"] === 1) { $page = 1; $now = $page; } else { $page = $get["page"] - 1; $now = $page * $max + 1; $page = $page + 1; } //$now = $page; //$max = 5; $dsn = "mysql:host=localhost;dbname=oogiri;charset=utf8"; $user = "root"; $password = ""; $dbh = new PDO($dsn, $user, $password); $dbh -> setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION); $sql = "SELECT img FROM toukou WHERE1"; $stmt = $dbh -> prepare($sql); $stmt -> execute(); //$dbh = null; while(true) { $rec = $stmt -> fetch(PDO::FETCH_ASSOC); if(empty($rec) === true) { break; } $img[] = $rec["img"]; } $kazu = count($img); if($kazu > 1) { //$now = 1; $kazu = $kazu - 1; $sql = "SELECT img, m_w FROM toukou ORDER BY code DESC LIMIT $now, $max"; $stmt = $dbh -> prepare($sql); $stmt -> execute(); $dbh = null; while(true) { $rec = $stmt -> fetch(PDO::FETCH_ASSOC); if(empty($rec["img"]) === true) { break; } print "<div class='dai'>"; print "<a href='kako_index.php?day=".$rec['m_w']."'>"; print "<img src='./img/".$rec['img']."'>"; print "</a></div>"; print "<br>"; } } else { print "過去お題はまだありません。"; print "<br><br>"; } $page_max = ceil($kazu / $max); print "<div class='pag'>"; for($i = 1; $i <= $page_max; $i++) { if($i === $page) { print "<div class='posi'>".$page."</div>"; } else { print "<div class='posi'><a href='kako.php?page=".$i."'>"; print $i."</a></div>"; } } print "</div>"; print "<br>"; //print "</div>"; } catch(Exception $e) { print "只今サーバーに異常が発生しております。<br>"; print "<a href='index.php'>トップページへ</a>"; exit(); } ?> <div id="scrolltop" class="st"><img src="img/方位磁石アイコン.png"></div> <div id="scrollmenu" class="sm"><img src="img/メニューの無料アイコン8.png"></div> </main> |
お題投稿テーブルを全て表示させます(お題のキャプチャをリンクにする)。ページの上限を5としているので、それを超える場合はページネーションで次ページへのリンクが表示されるようにしています。
月別
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 |
<warapper> <main> <h2>過去のお題</h2> <br> <?php try { require_once("common/common.php"); $get = sanitize($_GET); $stamp = $get["stamp"]; $dsn = "mysql:host=localhost;dbname=oogiri;charset=utf8"; $user = "root"; $password = ""; $dbh = new PDO($dsn, $user, $password); $dbh -> setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION); $sql = "SELECT img, m_w, img_yu FROM toukou WHERE m_w LIKE? ORDER BY code DESC"; $stmt = $dbh -> prepare($sql); $data[] = "%".$stamp."%"; $stmt -> execute($data); while(true) { $rec = $stmt -> fetch(PDO::FETCH_ASSOC); if(empty($rec["img"]) === true) { break; } if(!empty($rec["img_yu"]) === true) { print "<div class='dai'>"; print "<a href='kako_index.php?day=".$rec['m_w']."'>"; print "<img src='./img/".$rec['img']."'>"; print "</a></div>"; print "<br>"; } } } catch(Exception $e) { print "只今サーバーに異常が発生しております。<br>"; print "<a href='index.php'>トップページへ</a>"; exit(); } ?> <div id="scrolltop" class="st"><img src="img/方位磁石アイコン.png"></div> <div id="scrollmenu" class="sm"><img src="img/メニューの無料アイコン8.png"></div> </main> |
メニュ―画面のリンクから月別の識別となるstampの値をGETで受信し、データベースと照合させて一覧を表示させます。
アーカイブのお題画像クリック時
過去お題の結果詳細ページへ遷移
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189 190 191 192 193 194 195 196 197 198 199 200 201 202 203 204 205 206 207 208 209 210 211 212 213 214 215 216 217 218 219 220 221 222 223 224 225 226 227 228 229 230 231 232 233 234 235 236 237 238 239 240 241 242 243 244 245 246 247 248 249 250 251 252 253 254 |
<warapper> <main> <h2>過去のお題</h2> <br> <?php try { $max = 5; require_once("common/common.php"); $get = sanitize($_GET); if(!empty($get["day"]) === true) { $m_w = $get["day"]; } else if(!empty($get["n"]) === true) { $m_w = $get["n"]; } //print $code; if(!empty($m_w) === true) { $dsn = "mysql:host=localhost;dbname=oogiri;charset=utf8"; $user = "root"; $password = ""; $dbh = new PDO($dsn, $user, $password); $dbh -> setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION); $sql = "SELECT img, img_yu, img_jun, img_tokubetu FROM toukou WHERE m_w=?"; $stmt = $dbh -> prepare($sql); $data[] = $m_w; $stmt -> execute($data); $data = array(); } else if(!empty($code) === true) { $dsn = "mysql:host=localhost;dbname=oogiri;charset=utf8"; $user = "root"; $password = ""; $dbh = new PDO($dsn, $user, $password); $dbh -> setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION); $sql = "SELECT img, img_yu, img_jun, img_tokubetu FROM toukou WHERE m_w=?"; $stmt = $dbh -> prepare($sql); $data[] = $m_w; $stmt -> execute($data); $data = array(); } $dbh = null; $rec = $stmt -> fetch(PDO::FETCH_ASSOC); //print "</div>"; print "<div class='dai'>"; print "<img src='img/".$rec['img']."'>"; print "</div>"; //print "</div>"; print "<br>"; print "<h2>結果発表</h2>"; print "<br>"; print "<div class='dai'>"; print "<img src='img/".$rec['img_yu']."'>"; print "<br>"; print "<br>"; print "</div>"; print "<div class='dai'>"; print "<img src='img/".$rec['img_jun']."'>"; print "<br>"; print "<br>"; print "</div>"; print "<div class='dai'>"; print "<img src='img/".$rec['img_tokubetu']."'>"; print "<br>"; print "<br>"; print "</div>"; //$m_w = $rec["m_w"]; $dsn = "mysql:host=localhost;dbname=oogiri;charset=utf8"; $user = "root"; $password = ""; $dbh = new PDO($dsn, $user, $password); $dbh -> setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION); $sql = "SELECT * FROM kaitou WHERE m_w = ? ORDER BY time DESC "; $stmt = $dbh -> prepare($sql); $data[] = $m_w; $stmt -> execute($data); $data = array(); //$dbh = null; print "<br>"; print "<h2>回答一覧</h2>"; print "<br>"; while(true) { $rec = $stmt -> fetch(PDO::FETCH_ASSOC); if(empty($rec) === true) { break; } print '<div class="card">'; print '<div class="card-in">'; print '<div class="ico">'; $sql = "SELECT img FROM user WHERE name=?"; $stmt2 = $dbh -> prepare($sql); $data[] = $rec["name"]; $stmt2 -> execute($data); $data = array(); $rec2 = $stmt2 -> fetch(PDO::FETCH_ASSOC); if(empty($rec2["img"]) === true) { $nanasi = "nanasi.png"; $disp_gazou = "<img src='./img/".$nanasi."'>"; print $disp_gazou; } else { $disp_gazou = "<img src='./img/".$rec2['img']."'>"; print $disp_gazou; } print "</div>"; print '<div class="bun">'; print '<div class="time">'; print date('Y年n月j日 g:i', strtotime($rec["time"])); print '</div>'; print '<div class="name">'; print $rec["name"]; print '</div>'; print '</div>'; print '</div>'; print '<div class="kaitou">'; print $rec["comment"]; print "</div>"; $code = $rec["code"]; print "<div class='goodiine'>"; if(!empty($name) === true) { $sql = "SELECT * FROM good WHERE k_code=? AND g_name=?"; $stmt3 = $dbh -> prepare($sql); $data[] = $rec["code"]; $data[] = $name; $stmt3 -> execute($data); $data = array(); $rec3 = $stmt3 -> fetch(PDO::FETCH_ASSOC); if($rec["name"] === $name) { print "<div class='clear'>"; print "<form action='sakujyo.php' method='post'>"; print "<input type='hidden' name='re' value='".$code."'>"; print "<input type='submit' value='回答を削除'>"; print "</form>"; print "</div>"; print "<div id='good$code'><img src='./img/ハートのマーク3.png'></div>"; //$code = "non"; } else if(!empty($rec3) === true) { //print "<div id='good$code' class='on'>♥</div>"; print "<div id='good$code' class='on'><img src='./img/ハートのマーク3.png'></div>"; } else { print "<div id='good$code'><img src='./img/ハートのマーク3.png'></div>"; } } else { print "<div id='good$code' class='off'><img src='./img/ハートのマーク3.png'></div>"; } $sql = "SELECT * FROM good WHERE k_code=?"; $stmt4 = $dbh -> prepare($sql); $data[] = $code; $stmt4 -> execute($data); $data = array(); $iine = 0; while(true) { $rec4 = $stmt4 -> fetch(PDO::FETCH_ASSOC); if(!empty($rec4["good"]) === true) { $g_i[] = $rec4["good"]; } else { break; } $iine = count($g_i); } $g_i = array(); print "<div id='iine$code'>$iine</div>"; print "</div>"; print "</div>"; if(!empty($name) === true) { if($rec["name"] === $name) { $code = "non"; } } $k_code[] = $code; $g_iine[] = $iine; } if(!empty($g_iine) === true) { $g_iine = json_encode($g_iine); } if(!empty($k_code) === true) { $k_code = json_encode($k_code); } if(!empty($name) === true) { $name = json_encode($name); } print "<div id='goodnon'></div>"; //$dbh = null; $sql = "SELECT m_w, code FROM toukou WHERE1"; $stmt = $dbh -> prepare($sql); $stmt -> execute(); while(true) { $rec = $stmt -> fetch(PDO::FETCH_ASSOC); if(empty($rec["m_w"]) === true) { break; } $box[] = $rec["m_w"]; $box2[] = $rec["code"]; } $maxim = count($box); $max = $maxim -2; if(!empty($m_w) === true) { $point = array_search($m_w, $box); } else if(!empty($code) === true) { $point = array_search($code, $box2); } $mae = $point -1; $ato = $point +1; print "<div class='pag2'>"; if($mae < 0) { print "<div class='posi2'></div>";; } else { print "<div class='posi2'>前のお題:"; print "<a href='kako_index.php?n=".$box[$mae]."'>".$box[$mae]."</a></div>"; } if($ato > $max) { print "<div class='posi2'></div>"; } else { print "<div class='posi2'>次のお題:"; print "<a href='kako_index.php?n=".$box[$ato]."'>".$box[$ato]."</a></div>"; } print "</div>"; $dbh = null; } catch(Exception $e) { print "只今サーバーに異常が発生しております。<br>"; print "<a href='index.php'>トップページへ</a>"; exit(); } ?> <div id="scrolltop" class="st"><img src="img/方位磁石アイコン.png"></div> <div id="scrollmenu" class="sm"><img src="img/メニューの無料アイコン8.png"></div> </main> |
トップページを応用しているだけです。異なるのは回答、いいねの受付を終了、ページネーションの追加、回答削除の操作を制限している所です。
次回は固定ページ(サイトの説明、プライバシーポリシーなど)を作成したいと思います。