IMUZA.com

<<WordPress(ConoHa)<<はてなブログ

ホーム / Blankslate / WordPress:テーマ制作は一からの制作に行きつく

WordPress:テーマ制作は一からの制作に行きつく

2022/05/21 Blankslate, genesis, Wordpress

Genesis Framework を使う方法とブランクテーマ Blankslate を使う方法と二刀流でいろいろやってきたのですが、結局、ブランクテーマからつくることができるのであれば、すべて一から作ればいいということに行きつきました。

  • WordPress:Genesis Framework を使ったテーマ制作
  • WordPress:Blankslate を使ってテーマを一からつくる

  • やっとわかった WordPress
  • ループ
  • サブループ
  • SEO / JSON-LD

やっとわかった WordPress

わかったと言ってもテーマをつくる上のほんの走りですが、WordPress はもとがブログシステムですので、いくら企業サイトに使われると言っても、基本は日々の記事をデータベースに保存し、それを時系列で表示したり、カテゴリー別に表示したりする CMS です。

ですので、基本となるのは投稿ページであり、それを表示するには「ループ」というものを理解すればすべてに応用がききます。それ以外は単独で表示する固定ページですのでそれらは深く考えずに自由に HTML を書けば出来上がります。

  • ループ – WordPress Codex 日本語版

ループ

<?php
get_header();


if ( have_posts() ) :
  while ( have_posts() ) :
    the_post();
    
    // 実際にはこんな単純ではないが、たとえばこんな感じで記事を出力する
    // echo '<h1>' . the_title() . '</h1>';
    // echo '<div>' . the_content() . '</div>';
    
  endwhile;
endif;


get_sidebar();
get_footer();

このループを index.php に書いておけば、ダッシュボードの 設定 > 表示設定 > ホームページの表示が「最新の投稿」になっていれば「1ページに表示する最大投稿数」に設定した数の投稿記事がホームページに表示されます。

ああ、当たり前ですが、header.php, sidebar.php, footer.php がないとダメです。ループの説明のための便宜的なものです。

  • The Loop | Theme Developer Handbook | WordPress Developer Resources

このページのほうがわかりやすいですね。いずれにしても、これだけでホームと個別投稿ページは出来上がりますし、カテゴリーページもほぼ同様です。

サブループ

サイドバーにはウィジェットで様々なコンテンツを登録すればいいわけですが、仮に自前で最新の投稿を表示したい場合はサブループを使えば可能になります。

<?php
$args = array(
  'posts_per_page' => 10,   //取得する投稿数
  // パラメータを書いていく
  );


$the_query = new WP_Query( $args );
if ( $the_query->have_posts() ) :
  while ( $the_query->have_posts() ) : 
    $the_query->the_post();


    // コンテンツ表示
    
  endwhile;
endif;
wp_reset_postdata();
  • 関数リファレンス/WP Query – WordPress Codex 日本語版

パラメータはこちらのページにあります。

SEO / JSON-LD

SEO は大丈夫かと心配にもなりますが、そうした解説サイトは腐るほどありますのでそれらを参考にしつつ基本を抑えて、JSON-LD による構造化マークアップをすれば問題ないのではないかと思います。

ということで一から出直しです(笑)。

10年つかえるSEOの基本

10年つかえるSEOの基本

  • 作者:土居健太郎
  • 技術評論社

Amazon

WordPress:Genesis Framework を使ったテーマ制作(5)
WordPress:テーマをゼロから作ってみる(1)
Twitter
Facebook
ブックマーク
LINEで送る

最初のサイドバー

最新記事

2022/07/29

WordPressでiframeが表示されない(解決)

2022/07/14

WordPressのデータベースを入れ替える

2022/07/7

WordPress:テーマをゼロから作ってみる(3)

2022/06/26

WordPress:Aレコード変更でウェブだけ他サーバへ移転

2022/06/13

WordPress Popular Posts 他のプラグインに変えたほうがいいかも

最新記事を一覧で見る

よく読まれている記事

よく読まれている記事を一覧で見る

カテゴリー

  • はてなブログ212
  • WebTips108
  • javascript95
  • Joomla!88
  • Windows68
  • CSS62
  • Joomla!更新53
  • Linux49
  • はてなテーマ45
  • Wordpress37
  • Plamo33
  • Google32
  • はてなプラグイン25
  • php19
  • Node.js18
  • SASS16
  • Ubuntu16
  • laravel415
  • Chrome10
  • cms-style10
  • iPhone9
  • genesis6
  • Git入門6
  • ConoHa WING5
  • Python4
  • Android4
  • SSD3
  • Docker3
  • スマートフォン3
  • Facebook3
  • Firefox3
  • 静的サイトジェネレーター3
  • Blankslate3
  • Mactype2
  • GitHub2
  • rails入門1
  • はてなブクマ1
  • Twitter1
  • 映画1
  • youtube1

Footer

My Web Sites

  • @半径とことこ60分
  • そんなには褒めないよ。映画評
  • IMUZA.com
  • GitHub

Another Sites

  • WordPress公式
  • WordPress関数リファレンス
  • PHPマニュアル

Contact Us

  • お問い合わせフォーム
  • Twitter
  • Facebook
  • Feedly

Copyright © 2022 · IMUZA.com