備忘録&雑記

エックスサーバーにWordPressを設置し、自作テンプレートを作りました。

新しくワードプレスを設置しました!

こちらです→ http://naon56.xsrv.jp/

せっかくなので、自作テンプレートの作成方法をざっくりと紹介します。



広告



WordPressのインストール

  1. サーバーパネルにログインする
  2. 「ホームページ」の「自動インストール」をクリックする
  3. インストールするドメイン名を選択する
  4. 「プログラムのインストール」をクリックする
  5. 「WordPress日本語版」の「インストール設定」をクリックする
  6. 必要事項を入力する
  7. 「インストール(確認)」 をクリックする

テンプレートの自作

ソースコードは以下に置いてあります。

https://github.com/naon56/WordPressTemplate/tree/master/my-handmade

デザインはどうするか

デザインを考えます。今回はレスポンシブデザインにしたいので、1カラムにします。今回はトップを固定ページにします。

ソースコードの作成

ソースコードを書いていきます。なるべくファイルを分割した方が、1つ1つのファイルが軽くて管理しやすいです。

  • index.phpを作ります。
  • header.phpを作ります。
  • footer.phpを作ります。
  • single.php(ブログページ部分)を作ります。
  • page.php(固定ページ部分)を作ります。
  • comments.php(コメント部分)を作ります。

functions.phpを作ります。これはウィジェットなどの基本的な処理の集まりとなっています。自分で新規に関数を作ることも可能です。

「copyright_year()」は自作関数です。他の追加した関数は、Googleさんで調べて必要に応じて追加しました。

フッターのウィジェットエリア用のファイルを作って、footer.phpから呼び出します。

<?php  get_template_part('footer_widget');  ?>

javascript.jsを作成します。ページのトップに戻る処理です。

style.cssを作成します。自分の好みの外見に整えます。

作成が終わったら

screenshot.pngというファイルを用意します。これはWordPressのテーマ選択時に表示される画像です。とりあえず仮でOK。後で差し替えましょう。

サーバの「wp-content」>「theme」に作成したテンプレートをフォルダごと転送します。



広告



WordPressの設定

固定ページをトップページにする

WordPressのダッシュボードで、「設定」>「表示設定」から、「ホームぺージの表示」の「固定ページ」を選択して、ホームページをトップページにしたいページを選択します。

ブログぺージを追加する

ブログページにしたい固定ページを作成します。本文は空欄でOKです。

WordPressのダッシュボードで、「設定」>「表示設定」から、「ホームぺージの表示」の「固定ページ」を選択して、投稿ページを先ほど作成したページにします。

パーマリンクの設定

WordPressのダッシュボードで、「設定」>「パーマリンク設定」から設定できます。

私は「カスタム設定」で

/blog-%year%-%monthnum%-%day%-%post_id%/

にしています。

Ping送信先の設定

ダッシュボードの「設定」>「投稿設定」>「更新情報サービス」に、とりあえず以下を設定します。

http://rpc.pingomatic.com/

http://www.blogpeople.net/servlet/weblogUpdates

http://blogsearch.google.co.jp/ping/RPC2

http://blog.goo.ne.jp/XMLRPC

http://ping.blogoon.net/

http://ping.ask.jp/xmlrpc.m

http://www.bloglines.com/ping

http://api.my.yahoo.co.jp/RPC2

http://ping.fc2.com/

http://ping.gpost.info/xmlrpc

http://wpdocs.sourceforge.jp/Update_Service

ディスカッション

ダッシュボードの「設定」>「ディスカッション」で自分の好みの設定にします。

ニックネームの設定

ダッシュボードの「ユーザー」>「あなたのプロフィール」から「ニックネーム」と「ブログ上の表示名」を変更します。

HTTPS対応

以下のように無料独自SSLの設定をします。
https://www.xserver.ne.jp/manual/man_server_ssl.php

.htaccessを以下のように書き換えます。

# BEGIN WordPress
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteCond %{HTTPS} !on
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [R=301,L]
RewriteBase /
RewriteRule ^index\.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]
</IfModule>

# END WordPress

ダッシュボードの「設定」>「一般」にある「WordPress アドレス(URL)」「サイトアドレス(URL)」 を「https://~」の形にします。

リビジョンの保存件数の制限

「wp-config.php」に手を加えます。

define('WP_DEBUG', false);

の直後に

/* リビジョンの保存件数を制御する */ define('WP_POST_REVISIONS', 3);

を追記します。これは過去3件まで保存します。

プラグインの追加

既にインストールされているプラグインのうち、「Akismet Anti-Spam (アンチスパム)」「TypeSquare Webfonts for エックスサーバー」「WP Multibyte Patch」を有効化します。

他に、必要なプラグインをインストールします。私のお勧めは以下のものです。

ダウンロードしてから、「wp-content/plugins」の下のディレクトリに解凍してアップロードした方が速いです。

特に「Advanced Custom Fields」と「Breadcrumb NavXT」はテーマのソースコードに利用しているのでインストール必須です。

ウィジェットの追加

好きなウィジェットを追加します。

今回はウィジェットエリアにSNSへのリンクを作りました。

テキストウィジェットにショートコードで呼び出しできるようにしました(別記事にて紹介)。

翻訳ファイルの追加

以下のサイトを参考に設定します。

自作WordPressテーマの国際化(翻訳)の方法

関連

エックスサーバーにWordPressを設置しました。

WordPresを設置して、テンプレートを自作してみました。



広告



参考

固定ページをトップページに指定する方法

フロントページを固定ページに設定しつつ、最新の投稿ページも使いたい!



広告





広告



関連記事

コメント

  • トラックバックは利用できません。

  • コメント (0)

  1. この記事へのコメントはありません。

コメントするためには、 ログイン してください。