たまろぐ

必要なファイルをアップロードする

2019年7月10日 23:08 カテゴリー: Wordpress

wordpressのテーマを作るにはthemaのフォルダにサイトの原型のファイルをアップロードする必要があります。まずはテーマの開発の環境を整えていきましょう。

テーマ用のファイルを作る

まずはテーマのもとになるフォルダを作ります。このフォルダをテーマのフォルダにアップロードするとWordpressにテーマと認識されて管理画面で選択できるようになります。

terapadをダウンロードする

Windowsに標準でインストールされている「メモ帳」でもいいんですが、文字コードを変更できないので、TeraPadをインストールします。web制作をしていれば今後も出番がくると思われます。この機会に下記リンクからダウンロードしましょう。

TeraPad

テーマのフォルダを作る

作るテーマの名前でフォルダを作ります。僕は「whiter」というテーマを作るので、whiterというフォルダを作りました。

必要最低限のPHPファイルとCSSファイルを作ってフォルダの中にいれていく。

このファイル達がブログになっていくんです。

ちなみにPHPはプログラム言語の一つで、このファイルの中にPHPと実際にどう表示するかを司るHTMLを記載することができます。

CSSは文字の色を変えたり、ボックスの幅や表示位置を変えたり等のデザインをすることができます。

文字コードを変更する

TeraPadを開いて左上の「ファイル」→「文字/改行コード指定保存」を選んで下の画像のウィンドウを開きます。

文字コードをUTF-8に変更して完了です。SHIFT-JISも日本語の規格ですが、環境によっては文字化けが起こる可能性があります。必ず変更しておきましょう。

実際に必要なファイル

現段階ではまだ何も入れる必要はありません。そのまま「ファイル」→「名前を付けて保存」を選んで下記のリストと全く同じ名前のファイルを全部で9種類作ります。

  • index.php
  • header.php
  • footer.php
  • sidebar.php
  • archive.php
  • single.php
  • function.php
  • 404.php
  • style.css

上記の画像はarchiveのhが抜けてarciveになってますね。正しくはhが入った方なので間違わないようにお願いします。

テーマをアップロードしてWordpressで有効化する

9個のファイルが入ったフォルダをアップロードする。

FTPを開いてWordpressのテーマのフォルダにアップロードします。

フォルダは

wp-content→themes

です。そこにフォルダごとアップロードしてください。

WordPressにログインして有効化

WordPressにログインして左のメニューの外観からテーマを選びます。そうすると下記画像の画面が出てきます。先ほどアップロードしたフォルダと同じ名前のテーマが表示されているので有効化しましょう。

トップページにアクセスして何も表示されていなければ無事完了です。

アップデートすると表示されて、アップデートしたら全く別のテーマになりました☆ミ

同じ名前のテーマが公開されていて、アップデートするとそっちになっちゃうみたいです。別の名前に変えるか、アップデートしないのがおすすめです。

ちなみにWhiteが使われていたみたいで、この現象がおきました。僕はテーマの名前を変更してWhiterにしました。ある程度いじってから間違えてアップデートしたら最悪ですからね。

各ファイルの用途

index.php

トップページ用のファイルです。ここに記載したことが直接トップページになります。ある意味一番重要で、これだけでもサイトとして成り立ちます。

header.php

ヘッダーの表示を記載します。このファイルを全てのページで読み込めば、一部変更したい場合に全ページのヘッダーを更新しなくても、このファイル一つを更新すれば全てのページに反映される。とても便利!

footer.php

フッターの表示を記載します。header.php同様一括で編集出来て便利!

sidebar.php

サイドバーの表示を記載します。同上。

archive.php

カテゴリーページや、アーカイブ、タブなどなど、記事の表示に特化したページに使用されます。

single.php

記事単体のページに使用されます。

function.php

色々な場所で使われるプログラムを書きます。下手に更新するとサイトどころか管理ページまでアタック並みの驚きの白さに。そうなったときはFTPでfunction.phpを修正するしかないので注意が必要。

404.php

404エラーの時に表示されます。404エラーとは、何もないURLにアクセスすると出るエラーの事です。

style.css

スタイルシートといって、ページをデザインするためのファイルです。デザインに関する事は全てこのファイルに書きます。

最低限のファイル構成です。

これで僕の考える最低限必要な構成です。Wordpressでは、無いファイルは別のファイルで代用される為、これ以上は必要ありません。逆にもっと細かくデザインを分けていきたい方は、もっとファイルが必要になってきます。

細かくデザインを分けたい場合のファイル

投稿者アーカイブ

投稿者ごとの記事一覧は author.php というファイルを使います。author.phpが無い場合はarvchive.phpが使用されます。

カテゴリー

カテゴリーは category.php というファイルを使います。category.phpが無い場合はarchive.phpが使われます。

日付別アーカイブ

日付の記事一覧は date.php というファイルを使います。date.phpが無い場合はarchive.phpが使われます。

タグ

タグの記事一覧は tag.php が使われます。無い場合はarchive.phpが使われます。

トップページ

トップページもindex.phpではなく、実はhome.phpというファイルが優先で使われます。無い場合はindex.phpが使われます。

検索結果ページ

検索結果は search.php が使われます。無い場合はindex.phpが使われます。

archive.phpなら問題ないですが、index.phpとなると、必要かもしれないですね。必要と判断したら追加するかもしれません。

コメント

コメントは comments.php が使われます。・・・必要?

こんな感じです。もっとこだわればまだまだありますが、一般的に使われるのはこんなところでしょう。

まとめ

一通りのファイルをアップロードするところまで解説しました。

最低限の構成で説明していますが、必要に応じて増やしたり、逆に減らしたりして自分の使いやすい様に変更していきましょう。

まだ真っ白なページが表示されていますね。次回からはいよいよ中身を作っていきます。

次の記事!

WordPressのテーマを作るまとめ!