“Ability proceeds from a fusion of skills, knowledge, understanding and imagination, consolidated by experience.”
MICHAEL KLARKE
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce ornare porttitor ipsum a mollis. Pellentesque sagittis enim ac libero luctus, at vulputate ante lobortis. Praesent lacinia, leo sit amet congue malesuada.
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor ins.
RECENT ARTCLES
lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua ets unsers.
WordPressループってなんぞや？コンテンツ表示に欠かせないお話
こんにちは、のすけです。 大学で非常勤講師などをやらせていただいているのですが その繋がりで大学時代の教授との縁が復活するなど、 世間は狭いなと思う今日この頃です。 本日はWordPressカスタマイズの第８団「WordPressループってなんぞや？」です。 WordPressループとは？ どこでWordPressループは使われているの？ なぜループが必要なの？ WordPressループを使ってwp_queryからデータを取り出す方法 the_post()とは 追加WP_QUERYについて ちなみに、前回はWordPressで利用すつタグを紹介しました。 これだけは覚えよう！WordPressテンプレートタグ！ - hollywis's diary (はりうすブログ) WordPressループとは？ 僕自身はRuby on RailsやNode.jsでプログラムを書くことが多いのですが そんな、Web畑出身の人が何これ？と思うのがWordPressループではないでしょうか。 何かと言いますと、端的に言うと、コンテンツを表示する時にwhile文を書いて、その中で記事情報を取得し表示までする仕組みのようです。 ちょっと良くわからないですよね。 普通にコンテンツを取ってきて表示すればいいじゃ。。。と思ってしまう。なぜわざわざループさせているのか。 しかもwhileの無限ループを使うなんてバグが出そうな怖い技を使って。。。 そんなにwhile文なんて使いませんからね。組み込み系のプログラム(Arduinoとか)じゃあるまいし。と思ってしまいます。 どこでWordPressループは使われているの？ まず、利用例を紹介します。 以前、書いたindex.phpとstyle.cssだけで作る最小のテーマを例にします。 hollywis.hatenablog.com 詳しくは↑を見てください。 この中で、index.phpにメインページの時、投稿ページの時、固定ページの時のコンテンツの出しわけを行っている部分があります。 <?php if(is_home()) [...]
これだけは覚えよう！WordPressテンプレートタグ！
こんにちは 前回は、Wprdpressテーマを一般的なheader.php、sidebar.php、footer.php、index.phpに分割して構造化しました。 hollywis.hatenablog.com この中でphpファイルの記述中にいくつかテンプレートタグを利用してきましたので、そのテンプレートタグを深堀していきたいと思います。 なお、最小のテンプレートを作る際に利用したコードが次のような感じでした。 ファイル：index.php <!DOCTYPE html><!--html宣言--> <html lang="ja"><!--日本語指定--> <head> <meta charset="UTF-8"><!--エンコード：UTF-8指定 --> <title><?php wp_title(' | ', true, 'right'); bloginfo('name'); ?></title> <meta name="viewport" content="width=device-width, initial-scale=1.0 "><!--スマホ用:viewportの設定--> <link rel="stylesheet" href="<?php echo get_stylesheet_uri(); ?>"><!--CSSの呼び出し--> <?php wp_head(); [...]
自作WordPressのテーマモジュールを分割する
こんにちは 前回はWordpressテーマの構造を理解するために最小のテーマを作りました。 このテーマはページをすべてindex.phpに詰め込んでわずか３ファイルで作られています。 hollywis.hatenablog.com 今回は、このindex.phpを機能毎に分割してより構造的なテンプレートに変えたいと思います。 前回のindex.phpはこちら <!DOCTYPE html><!--html宣言--> <html lang="ja"><!--日本語指定--> <head> <meta charset="UTF-8"><!--エンコード：UTF-8指定 --> <title><?php wp_title(' | ', true, 'right'); bloginfo('name'); ?></title> <meta name="viewport" content="width=device-width, initial-scale=1.0 "><!--スマホ用:viewportの設定--> <link rel="stylesheet" href="<?php echo get_stylesheet_uri(); ?>"><!--CSSの呼び出し--> <?php wp_head(); [...]
【超入門】最小構成のWordPressテーマを作る
のすけです。 前回はWordpressテーマの構成について触れました。 hollywis.hatenablog.com 今回はWordpressテーマを作っていきたいと思います。 それも最小の。 レイアウトを決める まず実現したいレイアウトを決めます。 今回は最小構成ということでHTMLはこんな感じにします。 <!DOCTYPE html><!--html宣言--> <html lang="ja"><!--日本語指定--> <head> <meta charset="UTF-8"><!--エンコード：UTF-8指定 --> <title>サイトのタイトル</title> <link rel="stylesheet" href="style.css"> <meta name="viewport" content="width=device-width, initial-scale=1.0 "><!--スマホ用:viewportの設定--> <link rel="stylesheet" href="<?php echo get_stylesheet_uri(); ?>"><!--CSSの呼び出し--> </head> <body> <header class="site-header"> [...]
WordPressのデバッグモードをONにする
Wordpressをカスタマイズする際に、デバッグしたいですよね。 そんな時は、エラーを画面に表示するようにデバッグモードをONにしましょう。 設定ファイルはwp-config.php 次のように設定しましょう。 define('WP_DEBUG', true); デバッグモードをOFFにしたい場合は、次のようにします。 define('WP_DEBUG', false); ログに出力する ログに出力したい場合には、さらに次のようにします。 define('WP_DEBUG', true); //デバッグモードON if (WP_DEBUG) { //デバッグモードONの場合 define('WP_DEBUG_LOG', true); //debug.logファイルに保存 define('WP_DEBUG_DISPLAY', false); //画面に表示しない } 上記のように設定した場合、wp-contentフォルダに「debug.log」というファイルができて そこにエラーが記録されていくようになります。
テーマを作る - テーマを構成するファイル群
Wordpressの凄い点は、まるで着せ替えのようにデザインを変える事ができる事です。 これをテーマと呼びます。 テーマのインストール画面 管理画面から、初期インストールの「twentyfifteen」「twentysixteen」「twentyseventeen」を選ぶこともできますし、世界中のデザイナーがデザインしたテーマを探して来て、インストールする事ができます。 テーマを新規に入れる事ができる画面 個別のテーマのディレクトリの位置とファイル構成 「wo-content/themes/」の以下にテーマ毎のディレクトリがあり、その下にテーマファイル群が配置されています。 テーマは既存のものを入れることもできますが、もちろん自作することも可能です。 テーマに必要なファイルは次の通りです。 index.php メインテンプレート style.css テーマのcss 最低限、この2つがあればテーマは作成できます。 さらに、より高機能にしたい場合には function.php 関数ファイル search.php 検索ページ 404.php 404ページ 画像ファイル など様々に追加できます。 なお、参考までに「twentyseventeen」のテーマファイル群は次の通りです。 ページのパーツ毎に切り出されてそれぞphpファイルになっているのが分かるかと思います。 ちなみにphpとはhtmlにプログラム機能を付加した凄いやつです。 １つのphpファイルには「html」と「phpプログラム」の両方が記載されています。 それぞれのファイルの意味は次の通りです。(すでに紹介したもの以外) header.php ヘッダー部分 footer.php フッター部分 sidebar.php サイドバー部分 archive.phpはアーカイブページ [...]
