WordPressでサイトを制作する際に使用するテーマは、有料または無料で「既存テーマ」が存在し、それを用いることができます。 その一方、１から自分でプログラミングを行い、「オリジナルテーマ」として制作することもできます。 では、既存テーマが存在するにも関わらず、わざわざオリジナルテーマを制作する必要はあるのでしょうか？ 結論：サイト制作を請負いやすくするために必要 先に結論を申し上げると、「オリジナルテーマ」によるサイトの制作ができることが望ましいです。 理由は オリジナルテーマの制作ができることで、既存テーマへの理解が深まり提案のクオリティが上がること高単価＆契約率に繋がりやすくなること他のローコード・ノーコードを売りにしているWEB制作者との差別化を図ることができる。 などがあります。 そもそも、WordPressのテーマとは？ 改めて「WordPressのテーマってなに？」というところに触れてみます。 WordPress（ワードプレス）はPHPというプログラミング言語で作られているコンテンツを管理するシステム（Contents Management System：CMS）の一種で、ブログやWebサイトを作る事ができます。 その中にあるテーマとは、WordPress1サイトにつき1つだけ設定できる、ページ構成やそのレイアウト、色・装飾などの見た目が施されたセット一式で、他の方が開発した既存テーマと自作するオリジナルテーマがあります。 WordPressを導入後、いずれかのテーマを一つ選んでから構築を開始します。 既存テーマとオリジナルテーマの比較表 既存テーマとオリジナルテーマの違いを一覧表にまとめました。 既存テーマオリジナルテーマオリジナル性低い高い構築の工数少ない多い費用安いまたは無料高いカスタマイズ性低い高いユーザービリティ高い低い主な取引相手エンドユーザー向け制作会社向け※相対的な評価です。 表にしてみると、それぞれにメリットやデメリットがあることがわかります。 ですから、構築案件ごとに何を優先させる（コスト・オリジナル性など）かにより判断するのが良いかと思います。 オリジナルテーマが必要な理由 オリジナルテーマによるサイト製作ができることで、請負の幅が広がるとは先にも言いましたが、具体的には次の点になります。 制作会社からの案件を受注しやすい（というか、オリジナルテーマで制作ができないと見向きみされない）エンドユーザー（依頼主）と直接やりとりをする際の要望に対する手札が増え、依頼を受けやすくなる。既存テーマ構築時のカスタマイズスキルが上がる。 上記の中の「既存テーマ構築時のカスタマイズスキルが上がる。」とは、既存テーマを土台に構築をする場合でも何らかのカスタマイズが必要になるケースが多いですが、その際のカスタマイズ方法やカスタマイズ工数の算定がしやすくなるという意味です。 オリジナルテーマに必要なもの 既存テーマによる構築の場合は、CSSの追加も含めて管理画面のみでも構築できますが、オリジナルテーマの場合はテキストエディタ（VSCodeが良いです）を導入し、Sass（CSSの便利な記法）をコンパイルするためのVSCodeの拡張機能などがあると便利です。 オリジナルテーマの学習ステップ WordPressにはページを表示の表示や正しいリンク先の表示のためのお作法があります。 一度理解してしまえば基本の部分はどのサイトであっても同じですが、ここが難しく、挫折しやすいところです。 ですから、学習方法は素直に評価が高い方法を選択したいところです。 オリジナルテーマの学習方法 オリジナルテーマの学習法は参考書やオンラインスクールなど幅広くありますが、おすすめはたにまこさんがudemyで公開しているWordPress開発マスター講座です。 おすすめするは主な理由は、下記の３点です。 オリジナルテーマ制作に必要なコンテンツが全て盛り込まれている仕組みの説明が丁寧なので、理解が早い多くの先輩がこれを元にスキルアップした実績がある 順にご説明します。 オリジナルテーマ制作に必要なコンテンツが全て盛り込まれている 全部で100を超える短めのブロックから構成されており、オリジナルテーマの実装に必要なコンテンツが網羅されています。 また、実装の仕方もより利便性の高い方法で説明されていて、即実戦で通用するものが多数です。（メニューの動的化のところで特に思いました） 仕組みの説明が丁寧なので、理解が早い わからないことがあるとググったりするかと思うのですが、その場合「コピペOK」みたいな文字を信用してそのまま中身の意味もわからず使い続け、仕組みがいつまでも定着しない、なんてことはないですか？（私はそうです） この講座で仕組みが丁寧に説明されており、仕組みが自分の中で定着しやすいことから、効率よくスキルアップすることができます。 また、通常だとプラグインを使いがちな実装方法の説明もしっかりされており、より深く知識を得ることができます。 多くの先輩がこれを元にスキルアップした実績がある これはわざわざ言うまでもないのですが、私を含めて参考書など様々なコンテンツを利用した先輩WEB制作者が異口同音にこの講座が一番良いと言っており、実績は間違いないと思います。 まとめ オリジナルテーマ制作を理解している人でしたら、既存テーマを用いてサイト制作をすることが可能ですが、逆は難しいです。 既存テーマのみで案件を対応している方であっても今後より仕事を増やしていくため、是非オリジナルテーマによるテーマ制作に挑戦してみてくださいね！ もしご不明な点がありましたら、遠慮なくTwitterのDMでメッセージをお願いします！

　案件の提案などで、Wordpressのテーマである「Snow Monkey」を使われている方も多いのではないかと思います。ノーコードでサクサク作れるうえに、GoogleアナリティクスなどのSEO関連設定もバッチリできて言うことなしです！ 　とはいえ、案件の要件定義上CSSや場合によってはJava Script(JQuery)を使わざるを得ない一方、「カスタマイズ環境の構築に手間取った」なんてお声もちらほら。 　というわけで、そんな人のお役に立てればと思い、この記事を作成しました。 このページを見てもらいたい人 プラグイン「My Snow Monkey」を入れたけど、どうやって使えばよいかわからないという方CSSまでは設定できたけど、Java Scriptの設定ができていないという方 下準備 Snow Monkeyのカスタマイズは子テーマではなく、プラグイン「my-snow-monkey」が推奨されており、これをインストールするところからなんですが、こちらはSnow Monkeyといえばこの人！のじゃんきーの兄貴のブログがとても分かりやすいので、そちらをご参照ください。じゃんきーさん、ありがとうございます。 今回使用するMy Snow Monkeyのフォルダ完成図 デフォルトから配置を変え、こんな感じにしました。参照するstyle.cssを直下に置いているのは参照ファイルの視認性をあげるためです。 My Snow Monkeyに追記するコード 公式サイトのデフォルトコードにjsを読み込めるように追記されております。なお、こちらのコードはじゅんぺーさんのブログのもので、それを使い、自分なりに仕組みを考察したものです。大変勉強になりました。ありがとうございます。 じゅんぺーさんのブログは素晴らしく、必要事項は全て説明がされているため、リンク先からすんなり環境構築が済んだ方はこの先を読む必要はありません。どんどんカスタマイズしてスキルアップしちゃってください！ 私と同じく足踏みした人だけ以下の記事をお読みください。 仕組みを理解するための考察 アクションフック「wp_enqueue_scripts」はWordpress標準のものですので、Ｗordpress化をされたことがある方なら一度は目をにしたことがあるはずです。その引数である「msm_enqueue_style_script」関数（関数名をつけずに無名関数でも可能）で読み込みたいjsとcss指定しています。swiper.jsなど、追加で読み込みしたいファイルがある場合は、ここに追記すればjsファイルの追加が可能です。 男性スノモンでもCSSやJava Scriptを自由に追加できると思うと、使い勝手が飛躍的に上がるね！ 参照ファイルを増やす際、それぞれの名称（上でいうとmsm_styleとmsm_scripts）は異なる名称にしてください。挙動がおかしくなります。 ＶS CodeでのLive Sass Compilerのインストール インストールがまだお済みでないようでしたら、こちらのサイトがとてもわかりやすいです。ここではSass環境の構築の説明は割愛させていただきます。 ※上記と同じ状態にする場合は、my-snow-monkey\styles\src\_test.scssのファイルを作成し、style.scssファイル内で「@import ‘src/test’;」とコードを書いてコンパイル対象のSCSSファイル読み込み用のパスを通しておいてください。じゅんぺーさんのファイルをお使いになるのが早いですが、ご自身で考えながらやるのもよいかもしれません。 設定後、画面下にある「Watch Sass」をクリックして「watching…」状態にすることをお忘れなく。 本来はすんなり完了ですが・・・ 上記コードをマイスノモンに追記し、 Live Sass Compiler をインストールして起動すれば本来はCSSもJSも反映します。にもかかわらず、CSSの反映がうまくいかない方は、次の点が考えられないでしょうか。 マイスノモンのCSS読み込みパスと Live Sass Compiler パスの不一致 私はまさにこれだったのですが、ファイルの整理によりSassがコンパイルした後吐き出すStyle.cssのファイルパスとマイスノモンで指定するファイルパス（上で/* […]

WEB制作に携わっていると、既存テーマでの投稿・カテゴリー・タグ分類だけではなく、カスタム投稿やカスタムタクソノミーを使うことがあります。また、記事を任意で抽出する際、サブクエリを使うためにパラメータとしてタームのスラッグを設定する、なんてシチュエーションもあります。 僕のあるあるで、わかったつもりで先に進み、新たな学習コンテンツが手詰まると、わかったつもりのところまで手戻りするというのがあり、これもその一つでした。 そんなこんだを自分なりに整理した結果を、図や表を交えて説明をします。 この記事を読んでもらいたい方 WP初心者同じようなカタカナだらけで、頑張って学習した時はわかったような気になるけど、振り返るとちょっと習熟した自信がない。。。けど、体系の理解だけして先に進みたい！ という方の、備忘録的な位置づけを考えています。（もちろん自分にも） 分類表 カテゴリー、タグ、カスタムタクソノミーの説明 分類名/項目内　容備　考カテゴリー記事を大きく分類するのに使用。基本は記事ごとに1つの設定。デフォルトで存在する。固定ページでは設定不可タグ 記事を細かく分類するのに使用。記事ごとに1つ以上設定したり、設定しないことも可能。デフォルトで存在する。 固定ページでは設定不可 カスタムタクソノミー（命名した分類名）カスタム投稿を分類したり、既存のカテゴリーやタグとは違い、分類名を具体的に定義して使いたい場合に使用。プラグインなどで任意に導入する。 固定ページでも設定可能 どれもタクソノミー（分類）なのですが、デフォルトのカテゴリー＆タグと、タクソノミーをカスタムするカスタムタクソノミー（そのまんま）があります。 タームとは？ タームとは、各分類に対して作成された、具体的な項目を指します。 具体例 既存のカテゴリーやタグに対して「新規カテゴリー（タグ）を追加」で作成されたのがタームとなります。カスタムタクソノミーの場合は、分類名を具体的に命名ができますので、命名した分類名に対して「新規”分類名”を追加」で作成されたものがタームとなります。 カスタムタクソノミーの場合、分類名「愛知県」に対して、ターム「名古屋市」といった具合です。 ダッシュボード上の説明 画面はプラグイン「Custom Post Type UI」でカスタムタクソノミーを作成後のカスタムタクソノミー作成画面です。カテゴリー、タグでも見方は同じです。 なぜタームの理解が必要なのか？ ちょっと大げさな見出しですが、カテゴリーなどで新規作成したものを「ターム」と呼ぶっていうことを知っておくべしというだけです。ですが、ダッシュボード上などでタームという表記が見当たらず（たぶん）、特に知る必要のないまま学習を進めてサブクエリを使う段階で、任意の投稿抽出用のパラメータ項目でterms(タクソノミーターム)という文言をみて「ん？」と思ったところからちょっと考え始めました。ここでタームのスラッグが必要となります。 サブクエリについてはメインクエリと共にwordpress（というかデータベース関連の言語）を使う上では重要項目ですのできちんと理解してまた記事を書きたいと思いますが、ひとまず wordpress 上では関連記事系をアーカイブする際などに必要なものと理解しています。 さいごに 今回は、タクソノミー系の理解のために必要となる事項を記事にしましたが、カスタムタクソノミーは柔軟に分類するためには必須ですので、迷いなく使えるようになりたいです。 また、よくカスタムタクソノミーははカスタム投稿、カスタムフィールドと「カスタム3兄弟」として付加機能的な紹介をされるのですが、学習する際は既存のカテゴリーやタグと比較しながら確認することをお勧めします。 それでは。