さくらのレンタルサーバ WordPress導入

http://ドメイン/member
のようなURLで導入してみる。

・サーバー確認

コントロールパネル>サーバー情報
を確認。
>Apache/2.4.52

・PHP確認+設定

php -v
を実行。
>5.4.45
あるいは、phpファイルを作成しphpinfo()を実行する。

今回はバージョンが古いため、
コントロールパネル>スクリプト設定>言語のバージョン設定
から以下のように設定。
PHPのバージョン:PHP8.0[推奨]
モード:モジュール

・DB準備

コントロールパネル>Webサイト/データ>新規追加
から以下のように追加。
データベースバージョン:5.5
データベース名:wpd
データベースユーザ名:wpd
データベース接続用パスワード:xxx
データベース文字コード:UTF-8(utf8)
ネットワーク接続の暗号化:暗号化しない接続を許可する

・WordPress インストール

cd /home/ドメイン/www/member
wget https://ja.wordpress.org/latest-ja.tar.gz
tar -zxvf latest-ja.tar.gz

wordpressというフォルダができるので適当に中身を移動する。

cd wordpress
mv * ../
cd ../
rm -r wordpress

ブラウザから、
http://ドメイン/member
にアクセスし必要な情報を設定する。

・アクセス制限

社内向けなのでIPで弾く。

/home/ドメイン/www/member
の.htaccessに追記。

require all denied
require ip xxx.xxx.xxx.xxx

 

WordPress PHP更新(7.2 > 7.4)

PHPの切り替えを実行。

プラグインのSyntax Highlighterがエラーになるようなので、
wp-content/plugins/crayon-syntax-highlighter/
の中にある、
crayon_langs.cclass.php
の338行目、以下のように変更。
return preg_replace(‘/[^\w-+#]/msi’, ”, $id);
return preg_replace(‘/[^\w\-+#]/msi’, ”, $id);

WordPress 更新順ウィジェット

以前は最新投稿ウィジェットを更新順に並び替えるカスタマイズをしていたが、バージョンアップの時にもとに戻ってしまうので専用で作成することにした。

wp-includes/widgets/class-wp-widget-modified-posts.php
を作成する。

以下は手動で記入する。

残りの部分は、
wp-includes/widgets/class-wp-widget-recent-posts.php
からwidget,update,formをそのままコピーし、
以下の通り変更。

$r = new WP_Query()
の中にある配列に以下を追加する。
‘orderby’=>’modified’

に変更。

 

***

有効化について

wp-includes/default-widgets.php
に以下を追加。
require_once ABSPATH . WPINC . ‘/widgets/class-wp-widget-modified-posts.php’;

あるいは以下の方法。

wp-content/plugins
の中に
modified-posts.php
を作成し以下を記入。

そうすると、
管理画面>プラグイン
にModified Postsと表示されるので有効化する。

WordPress 記事一覧インクリメンタル検索

wp-content/themes/xxx
の中に適当な名前(ここではpage2.php)を付け下記を貼付け。
固定ページでテンプレートからTESTを選択。

これで、Enterを押せばGoogleのサイト内検索が実行され、文字を入力するだけならリスト検索(インクリメンタルサーチ)が実行される。

ブログをメモ代わりにしているので過去の記事を探すことも多い。今まではGoogleのサイト内検索だけだったが、タイトルだけ検索できれば十分という場合も多いのでこちらのほうが便利。

記事一覧

Google Analytics/AdSense WordPress 連携

トラッキングコード取得

Google AdSense
広告>コードを取得

Google Analytics (UA)
管理>トラッキング情報>トラッキングコード

Google Analytics (GA4)
管理>データストリーム>サイト選択(サイト名の部分をクリック)>タグ設定手順を表示する>手動でインストールする

WordPress設定

wp-content>themes>xxx>header.php

<head>の下へ

Google AdSense設定

左側メニュー>広告>サマリー>編集(サイト名の右側)
をクリックし
右側の広告設定>
ページ内広告
モバイル全画面広告
をオフにする。
(利用方法を調べることが目的のため)

Search Console

WordPressは関係ないが、Search Consoleも登録する場合。

・プロパティタイプ
ドメインを選択する。

・DNSの確認
指定されたTXTレコードを入力。

Xserverの場合
サーバーパネル>対象ドメインを設定する>DNSレコード設定>DNSレコード追加

Windows上にサーバー作成 Nginx/PHP/MariaDB/WordPress

以前は必要になるとXamppを使ってたけど、今回はNginx環境を手動で作ってみる。

Nginx

Windows用のzipファイルをダウンロードし解凍する。設定ファイルはもともとのコメント部を消して、とりあえずこんな感じ。

nginx-1.19.2/conf/nginx.conf

Nginxフォルダのパスに日本語があると起動しない場合があるので注意。

PHP

ダウンロードして解凍したら、phpというフォルダでnginxの中に入れる。
(nginx-1.19.2/php)

php.ini-development
をコピーしてphp.iniにし、
extension_dir=”ext”
extension=php_mysqli.dll
を追記する。

MariaDB

ダウンロードして解凍したら、mariadbというフォルダでnginxの中に入れる。
(nginx-1.19.2/mariadb)

nginx-1.19.2/mariadb/bin
の中にある、mysql_install_db.exeを実行すると、
nginx-1.19.2/mariadb/data
が作成され、my.iniも入っている。
(Nginxフォルダを移動したらmy.iniを修正しないと起動しない)

手動でDB作成等に使う場合、まずbinの中のmysqld.exeを起動。次にコマンドプロンプトからmysql -u root のような感じでログインできる。

・設定
nginx-1.19.2/mariadb/bin
に移動しmysqldを起動後、
mysql -u root
とするとログインできる。

mysql> set password = password(“1234”);

・データベース作成
mysql> create database wpd character set utf8;
(utf8を指定しないとWPのインストールでエラー)

起動・終了バッチ

start.bat

my.iniを自動で書き換える場合このような感じ

stop.bat

あるいは全て強制終了
(こうしないとプロセスが残る場合あり)

mysql.bat

mysqlのディレクトリに移動するためだけのバッチ

WordPress

nginx-1.19.2\html\wp
にWordPressを解凍したので、ブラウザから、
http://localhost/wp

にアクセス。

DBの情報を入れて送信したところ、
サイトに重大なエラーがありました。
と表示されエラーになった。
(1度目のインストール)

・DBをリセット
フォルダを手動で削除せず、mysqlのコマンドからdrop databaseする。
そして再度create databaseする。

・wp-config.phpを削除
wp-config-sample.phpを複写し、名前をwp-config.phpに変更する。

wp-config.phpが存在しないと自動でwp-config.phpは作成されるが、ここでは手動でwp-config.phpを設定する。

wp-config.phpの以下の部分をtrueに変更する。
define( ‘WP_DEBUG’, true);

以下の部分にDB情報を記入する。
define( ‘DB_NAME’, ‘wpd’ );
define( ‘DB_USER’, ‘root’ );
define( ‘DB_PASSWORD’, ‘1234’ );

再度挑戦するが、
サイトに重大なエラーがありました。
と表示されるだけで、特にエラー内容は表示されない。
(2度目のインストール)

Nginxのログ(logs/error.log)
を確認すると、
Fatal error: Maximum execution time of 30 seconds exceeded
とあるので、
php.iniで下記の部分を30から120に変更
max_execution_time = 120
(3度目のインストール)

これでインストールできた。

LAN経由(外部)から見る場合、ファイアーウォールに新しい規則を追加する。
もしCSSが適用されていない場合は、
設定>一般>アドレス
をIPアドレスに変更してみる。

WordPress カスタマイズ(VerUp含む)

不要ファイル削除

・バージョンアップ時、再実行。

public_html
にて実行。
rm -i readme.html
rm -i license.txt
rm -i wp-config-sample.php

記事一覧

・バージョンアップ時、再実行。

WordPress 記事一覧インクリメンタル検索

タイトル表示(投稿)を消す

・バージョンアップ時、再実行。

wp-content/themes/xxx/index.php
の中で以下のようにコメントアウトする。

Analytics/AdSense連携

・バージョンアップ時、再実行。

Google Analytics/AdSense WordPress 連携

テーマの幅変更

・バージョンアップ時、再実行。

wp-content/themes/xxx/style.css
の3408行(/* Layout */)以下、変更。

.wrap
max-width
を1000pxから1200px

.has-sidebar:not(.error404) #primary
width
を58%から62%

.has-sidebar #secondary
width
を36%から32%

Aタグアンダーバー非表示

・バージョンアップ時、再実行。

wp-content/themes/xxx/style.css
の中で
.entry-content a(1191行)
が含まれる
-webkit-box-shadow: inset 0 -1px 0 rgba(15, 15, 15, 1);
box-shadow: inset 0 -1px 0 rgba(15, 15, 15, 1);
をコメントアウト。

.entry-content a:focus(1237行)
.entry-content a:hover(1238行)
が含まれる
-webkit-box-shadow: inset 0 0 0 rgba(0, 0, 0, 0), 0 3px 0 rgba(0, 0, 0, 1);
box-shadow: inset 0 0 0 rgba(0, 0, 0, 0), 0 3px 0 rgba(0, 0, 0, 1);
をコメントアウト。

タグ一覧で本文非表示

・バージョンアップ時、再実行。

wp-content/themes/xxx
の中に、
tag.php
を作成し以下のように記入。

更新順ウィジェット

・プラグイン化済み

WordPress 更新順ウィジェット

特定のページにJavaScriptを挿入

・プラグイン化済み

ここでは下記に挿入しているコード。

FFmpeg メモ

タグクラウドを投稿数順に変更

・プラグイン化済み

タグクラウドにCSSを適用

・プラグイン化済み

REST APIを無効化

・プラグイン化済み

パーマリンクが標準だと動かないが、塞がれているわけではないので注意。

http://okamurax.com/wp-json/wp/v2/posts
http://okamurax.com/?rest_route=/wp/v2/posts

更新日を変更しない

更新日を更新しないチェックボックスを記事編集画面に追加。

・プラグイン化済み

 

favicon設定

・初回のみ

header.phpとwp-login.php
のheadタグの中に以下を追加

ダッシュボード>外観>カスタマイズ>サイト基本情報>サイトアイコン
からも変更することができる。

パーミション変更

・初回のみ

find . -type d | xargs chmod 705
find . -type f | xargs chmod 604
find . -name “wp-config.php” | xargs chmod 600

IPアドレスでログインを弾く

・初回のみ+IPアドレス変更時

wp-login.phpのある階層の.htaccessに以下を追記

wp-adminの直下にある.htaccessにも以下を追記。

※orderにてallowとdeny各ディレクティブのどちらを先に評価するか順番を指定する。
order allow,deny:許可→拒否
order deny,allow:拒否→許可

・2.4以降

wp-login.phpの階層

wp-adminの直下

(未使用)ウィジットの最新の投稿を更新順に変更

wp-includes/widgets/class-wp-widget-recent-posts.php
の中にある
$r = new WP_Query()
の中に条件の連想配列があるので、以下を追加する。
‘orderby’=>’modified’

これで更新順になる。
Wordpressのバージョンアップ時に消えるときがある。

(未使用)更新日を表示

wp-includes/widgets/class-wp-widget-recent-posts.php
の中で以下のように変更

 

(未使用)ナビメニュー非表示

wp-content/themes/xxx/header.php
の中にある
wp_nav_menu()
をコメントアウト

(未使用)トップページから特定カテゴリ非表示

functions.phpに以下を追加。

 

(未使用)Google検索ボックス追加

ウィジェットでテキストを追加する。

(未使用)ログイン状態でリダイレクト

(未使用)自作タグクラウド

ウィジェットにショートコードを入れれば表示される。

WordPress テーマ作成メモ

・保存先
wp-content\themes
の中に作成する。

・最小の構成
index.php
style.css
の2つのみ。

style.cssには最低限
/* Theme Name : テストテーマ */
が必要。

Theme Name以外にも、
Theme URL
Description
Version
など記述できる。

・サムネイル

880x660pxで、
screenshot.png
という画像をThemesフォルダに入れる。

・フック

functions.phpに書くことが多い。

apply_filters()
add_filter()
do-action()
add_action()

・wp_head(), wp_footer()

</head>タグの上に、
<?php wp_head(); ?>

</body>タグの上に、
<?php wp_footer(); ?>

・jQueryについて

WordPress標準のjQueryを呼び出す場合、$は使わずjQueryと置き換える。

・index.phpの分割

get_header()
を使うと、
header.php
を呼び出す。

get_footer()
を使うと、
footer.php
を呼び出す。

get_sidebar()
を使うと、
sidebar.php
を呼び出す。

・テンプレートの種類

home.php
front-page.php
トップページ

archive.php
アーカイブページ

category.php
カテゴリページ

tag.php
タグページ

date.php
投稿日ページ

search.php
検索結果ページ

single.php
投稿ページ

page.php
固定ページ

404.php
404ページ

該当するテンプレートがない場合index.phpを使う。

・基本的なループ

 

ページ判定の関数

パーツテンプレート呼び出し方

テンプレタグ