WordPress 更新順ウィジット作成

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’

<span class=”post-date”>
<?php echo get_the_date( ”, $recent_post->ID ); ?>
</span>

<span class=”post-date”><br>
更新:<?php echo get_the_modified_date(‘Y-m-d’,$recent_post->ID); ?>
&nbsp;&#047;&nbsp;
投稿:<?php echo get_the_date(‘Y-m-d’,$recent_post->ID); ?>
</span>
に変更。

 

***

有効化について

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
の中にあるpage.phpをコピーし適当な名前に変更。

/* Template Name: TEST */
と記入してあるので、
固定ページ>新規追加>テンプレート
からTESTとして選択できるようになる。

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

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

記事一覧

Google Analytics/AdSense WordPress連携

トラッキングコード取得

・Google AdSense

広告>サマリー>コードを取得

・Google Analytics

管理>トラッキング情報>トラッキングコード

WordPress設定

wp-content>themes>xxx>header.php

<head>の下へ

Google AdSense設定

左側メニュー>広告>サマリー>編集(サイト名の右側)
をクリック。

右側にある広告設定から、モバイル全画面広告をオフ。

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 カスタマイズ

ウィジットの最新の投稿を更新順に変更

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
の中で以下のように変更

(追記)現在は下記の方法を採用

WordPress 更新順ウィジット作成

ナビメニュー非表示

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

トップページから特定カテゴリ非表示

functions.phpに以下を追加。

favicon設定

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

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

Google検索ボックス追加

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

 

このGoogle検索でブログを指定するという方法は、別に作成したChrome拡張でも実行できるので、ほぼこちらを利用している。

(追記)現在は下記の方法を採用

WordPress 記事一覧+検索

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

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

ログイン状態でリダイレクト

自作タグクラウド

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

特定のページにJavaScriptを挿入

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

FFmpeg メモ

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

タグクラウドにCSSを適用

タグ一覧で本文非表示

方法①

タグをクリックしたときに表示されるページから本文をなくす。テーマによってはタグテンプレートを利用しているかもしれない。

ここではtwentyseventeenを利用し、
wp-content/themes/twentyseventeen/template-parts/post/content.php
をカスタマイズする。

the_content()の部分を以下のようにis_tag()で囲む。

方法②

あるいは以下のような方法。記事の表示数も変更したい場合など、the_contentを差し替えてしまう。

方法③

全て自作したい場合、
wp-content/themes/twentyseventeen
の中に、
tag.php
を作成し以下のように記入。

パーミション変更

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

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

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

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

REST APIを無効化

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

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

更新日を変更しない

functions.phpに以下を追加。

 

MySQLをWindowsにインストール

インストール

MySQLのサイトで、
MySQL Community Edition → MySQL on Windows (Installer & Tools) → MySQL Installer
を選択して保存。

インストール時、
Server onlyを選択。Developer Machineを選択。

ポートはそのまま3306で変更せず。パスワードはとりあえず1234。

初期設定

別のPCがクライアントになるため、rootのホスト名を変える。ホスト名が違うと別ユーザー扱い。

パスが通っていないので、mysqlのフォルダから
mysql -u root -p1234
と入力して起動する。

rename user ユーザ名@ホスト名 to 新ユーザ名@新ホスト名
でできる。ただ、変えてしまってlocalhostを消すとlocalhostからアクセスできなくなってしまうので、
別に追加したほうがいい。今回はやらない。

ユーザーを追加する。
create user usr01 identified by ‘1234’;

確認。
select user,host from mysql.user;

ここではホストは%になっているのでネットワークを指定。(やらずにそのまま%でもOK)
rename user ‘usr01’@’%’ to ‘usr’@’192.168.11.%’;

もし、ユーザー作成時にパスを設定していない場合はパスのみ追加できる
set password for ‘usr01’@’192.168.11.%’ = password(‘xxx’);

権限の確認(現在のユーザ)
show grants;

あるいは、
show grants for ‘usr’@’192.168.11.%’
grant usage on *.* to ‘usr’@’192.168.102.%’となっている。(権限がない状態)

権限を付与する(指定ユーザがいないと新規で作成される。)
grant all privileges on *.* to ‘usr’@’192.168.11.%’;

Winでの再起動は管理者のプロンプトから、
net start/stop mysql57

MySQLのDB作成等

Xampp利用の場合

WindowsでPHPを利用する方法。ここではXamppを利用する。

ファイル・フォルダ

適当に解凍して、
setup_xampp.batをクリック。
xampp_start.exeをクリック。

今回は、
apache
htdocs
install
mysql(不要な消してしまっても大丈夫)
php
tmp
だけ残して、それ以外のフォルダは削除。

xampp-control.ini

[EnableModules]
で不要な箇所を0へ

ポート番号

動かない場合はだいたい、
ポートが使われていることが多い。SoftEtherなど。

\apache\conf\httpd.conf
Listen 81に変更

\apache\conf\extra\httpd-ssl.conf
Listen 441に変更

だいたいこの方法で直る。netstatで調べてみる。

基本的なバックアップ方法(mysqldump)

Winでバッチファイルをタスクリストで処理する場合。

cd C:\Users\Administrator\Desktop\xampp\mysql\bin
mysqldump -u root -p1234 db > C:\Users\Administrator\Desktop\backup.sql
pause

Xserver等でWordPressをバックアップの場合。

先ず、
mysql -h xxx -u xxx -pxxx
にてsshログインして、
mysqldump -u xxx -pxxx -h xxx db > xxx.sql
とする。ちなみに、構造のみの場合 -dオプション、WorkbechからならDump Structure Onlyを選択。

ローカル側では、先ずxxx.sqlを置換してパスを全て置き換える。
このような感じ。
http://okamurax.com
http://192.168.102.15/blog

その後、
create database xxx charset=utf8;
としてローカルのdbを作成して
mysql -u xxx -pxxx db < xxx.sql
としてローカルのdbに流し込む。

http://192.168.102.15/blog/wp-admin
にアクセスしてdb更新。

存在しないテーマなどは存在するものに変更。

ユーザはバックアップ元になるので注意
(ここではxserverのユーザになるということ)

実際のスクリプト

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を使う。

・基本的なループ

 

ページ判定の関数

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

テンプレタグ