]
ワードプレスによるホームページ移転日記 ~その6~ | 魔導琥珀研究所

ワードプレスによるホームページ移転日記 ~その6~


2014年4月26日 土曜日

39157467_p1 色々ありましたが六回目。ホームページ移動日記も最後になります。 ...と言うことで、今回は動画関連のページをサムネイルで見れるような感じにします。 39157467_p7 最後ですか。 40551300_p5 なんかいろいろやったわね。 39157467_p1_2 移動日記自体は最後だけど、番外編とかはやるかもしれないわね。 39157467_p3 おぅ、それにメインの日記に紛れて色々実験とか考察とかもやるらしいからそっちが本編になる感じだな。 39157467_p1_4 そうね。 40551300_p5_2 では、最後の話行ってみましょう。どうするのかしら? 39157467_p1_5 まずは固定ページを作って、CSSで色々組みます。 39157467_p7_2 色々ですか? 39157467_p1_6 色々です。 で、まぁ、ホームページの頭の部分にサイトのタイトル名とかでているでしょ。 あの部分とサイドバーっていう記事の横の付いている物はワードプレス準拠のものにしたいのよね。 40551300_p5_3 そういえば今までの固定ページは元ページを改変しただけのものだったわね。 39157467_p1_7 そうそう。 ..ということで、ヘッダーに当たる部分は <?php get_header(); ?> と言う文字を入れてね。 40551300_p5_4 出来たわ。 39157467_p1_9 次にサイドバーが表示される予定の所には <?php get_sidebar();?> と言う文字を入れるの。 40551300_p5_5 これも出来たわね。後はアップロードすればいいのかしら? 39157467_p1_10 そうね。あげてもらえる? 40551300_p5_6 オッケー、さくっと上げたわ。でも、サイドバーとヘッダーは見えるけど中身はスカスカね。 ws000181 39157467_p1_11 天龍ちゃんの頭の中身みたいねーー。 39157467_p3_2 おう....やんのか!? 39157467_p1_12 あら~、天龍ちゃんについての有る事無い事が雷ちゃんたちに伝わるのがお望みかしら? 39157467_p3_3 わかった、わかった。あ~、やっぱり龍田には勝てねーわ。 39157467_p1_13 わかればいいのよ。 ということで続きね。 記事の文が入るはずの部分に最初の方にやったように文字を入れるんだけど、前回とは違ってこんな感じに入れてもらえるかしら? <?php $temp = $wp_query; $wp_query = null; $wp_query = new WP_Query(); $wp_query->query('post_type=movie' . '&paged=' . $paged . '&posts_per_page=5'); ?> 40551300_p5_7 何も変わらないわよ。 39157467_p1_14 表示部分が抜けているからね。 その後の記事表示をする部分には <?php while ( $wp_query->have_posts() ) : $wp_query->the_post(); ?> <?php the_title('<h2>', '</h2>'); ?> <?php the_post_thumbnail(); ?> <?php the_excerpt(); ?> <?php endwhile; ?> こんな感じに入れてあげてね。 40551300_p5_8 なんか色々でたわね。 39157467_p1_15 それじゃあ説明に入るわね。 まず、最初の方の文で、$wp_queryって言う物の中に読み込ませたいデータを読み込ませてあげたの。 post_type=movieの部分が、カスタム投稿タイプで投稿されたデータを表しているわ。 動画研究はmovieという投稿タイプ名だから、movieを入れてあげたの。 で、後ろ側の&posts_per_page=5と言う部分で何個読ませるかを決めてあげるのよ。 39157467_p7_3 種類と数を指定して、読み込ませるのですね。 39157467_p1_16 で、後半に入るわね。 while ~の一文目と最後のendwhileはループの基本という感じで覚えてればいいわ。 で、タイトルとサムネイル画像と抜粋というのをwhileのループの中で毎回表示してあげたというわけ。 40551300_p5_9 なんか色々でたけど直接ジャンプしたりは出来ないの? 39157467_p1_17 うっかり忘れてたわ。 <a href="<?php the_permalink(); ?>" target="_self"> ~</a> と言うのでさっきの文を挟むように入れてあげるのよ。whileループ全体を囲む感じね。 40551300_p5_10 動画研究ページにジャンプできるようになったわ。 39157467_p1_18 ああ、言い忘れてたけど、サイドバーの設定はヘッダーがないとCustom widgetsでは対応しないのよ。 39157467_p7_4 そうなのですか? 39157467_p1_19 なのです。 ヘッダー部分にある<?php wp_head(); ?>と言う文章があるのだけれど、それで今の状況に合わせてwordpressがデータを書き換えてくれるの。 だから、ワードプレスに合わせて色々やる場合。ウィジェット等を弄るとか色々あるのだけどそういったことをやる場合は最低でも<?php wp_head(); ?>だけは書いておいた方が良いわね。 39157467_p7_5 勉強になったのです。 39157467_p1_21 実は記事の数自体は5じゃなくて相当数あるのだけど、他の記事を見ることが今だと出来ないわよね。 40551300_p5_12 そうね。 39157467_p1_22 ということで、その辺も書いておきましょう。 サイドバーに当たる部分に最初に<?php get_sidebar();?>と書いたでしょう? あの前に <?php next_posts_link('NEXT'); ?> <?php previous_posts_link('BACK'); ?> と入れるの。 40551300_p5_13 入れたわ。なんか妙な文字が出てページが切り替えられるようになったわね。 ws000185 39157467_p7_6 で、コレは何なのです? 39157467_p1_24 next_postが読めるデータが有る場合は次のに切り替えると言う感じね。''で囲まれたところの文字が画面に出るのよ。 で、previous_が前のページに戻るものね。 39157467_p7_7 何となくは理解したのです。 39157467_p1_25 これで、一覧ページに小さい詳細を並べることも出来たし、終了ね。 ....お疲れ様でした。 それでは次回以降は普通の日記的な何かでお会いするかもしれません。