the_excerpt() の使い方

投稿の抜粋を表示するためのタグです。

使い方

the_excerpt()を呼ぶだけで使えます。

<?php the_excerpt(); ?>

注意

日本語の記事を扱うため、基本的に WP Multibyte Patch と一緒に使うのがいいです。

リンクのカスタマイズ

the_excerpt()はデフォルトではリンクをだしてくれないので、「続きを読む」のようなリンクを作るには、functions.php の編集が必要です。

https://wpdocs.osdn.jp/%E3%80%8C%E7%B6%9A%E3%81%8D%E3%82%92%E8%AA%AD%E3%82%80%E3%80%8D%E3%81%AE%E3%82%AB%E3%82%B9%E3%82%BF%E3%83%9E%E3%82%A4%E3%82%BA#the_excerpt.28.29_.E3.81.A7.E8.A1.A8.E7.A4.BA.E3.81.95.E3.82.8C.E3.82.8B.E3.80.8C.E7.B6.9A.E3.81.8D.E3.82.92.E8.AA.AD.E3.82.80.E3.80.8D.E3.81.AE.E5.A4.89.E6.9B.B4

参考

https://wpdocs.osdn.jp/%E3%83%86%E3%83%B3%E3%83%97%E3%83%AC%E3%83%BC%E3%83%88%E3%82%BF%E3%82%B0/the_excerpt

Google Tag Manager の導入はプラグインでやろう

Google Tag Manager の WordPress への導入はプラグインを利用しています。

タグマネージャーの導入プラグイン

Google Tag Manager for WordPress

いろいろ細かく設定できるプラグインです。

Google Tag Manager for WordPress – WordPress プラグイン | WordPress.org 日本語

Google Tag Manager

シンプルでタグマネージャーを追加するだけのプラグインです。

Google Tag Manager – WordPress プラグイン | WordPress.org 日本語

Import Users from CSV でユーザーのインポート

WordPress へユーザー情報を CSV でインポートするには、「Import Users from CSV」が便利です。

使い方

ユーザー > Import users from a CSV file から管理画面を表示します。
CSV のインポートはこちらから行うことができます。

インポートの各項目

「Import Users from CSV」ではいくつかインポートの設定があります。

  • CSV file
  • Notification Notification Send to new users
  • Password nag Password nag Show password nag on new users signon
  • Users update Users update Update user when a username or email exists

Notification にチェックを入れると、追加したユーザーにメールが送信されます。

参考

WordPress Ultimate CSV/XML Importer Plugin の設定

CSV を import するためのプラグインです。
表示は「Import and Export WordPress Data as CSV or XML」となっています。

WP Ultimate CSV Importer の設定

プラグイン WP Ultimate CSV Importer を有効にしたら、CSVをアップロードしてみましょう。

CSV のインポート画面

「Import each record as ~」 とあるので投稿タイプを選択します。
ページやカスタム投稿タイプなど選択できるので便利です。

import の各項目

フィールド説明CSVのサンプル
post_titleタイトル
post_contentコンテンツ
post_excerpt要約
post_date日付
post_categoryカテゴリー
post_tagタグ
post_author投稿者
featured_image
post_slugスラッグ
post_status公開ステータスの指定
publish / draft / pending / sticky / private / protected を指定する
publish
post_format投稿形式の選択

WP Ultimate CSV Importer の問題点

有料でない場合、ユーザーの Import には対応していないようです。
CSV のプラグインこれ一本で行きたい場合は課金しても良いでしょう。

参考

Introduction for WP Ultimate CSV Importer Free and all premium bundles

Post, Page & Custom Post Import | Ultimate CSV Importer

add_shortcode() の使い方

WordPress で ショートコードを追加するためには、add_shortcode() を使います。
設定は functions.php に書きましょう。

メリット

ショートコードを使えば例えば WordPress のコンテンツ内で PHP のコードを実行させるような動作が容易になります。

記事内の使い方

タグの使い方

タグの記法がいくつかあります。

タグでコンテンツを挟むタイプを基本と考えておくと良いです。

[tag]コンテンツ[/tag]

タグでは属性を扱うことができます。

[tag hoge="属性値"]コンテンツ[/tag]

属性でパラメータを設定することで柔軟な設定が可能です。

functions.php の表記

構文は以下になります。

<?php add_shortcode( $tag , $foo ); ?>

前の引数 $tag とあるものがショートコードになります。

関数側はこんな感じで引数やコンテンツを受け取ることができます。

function foo( $atts, $content = "" ) {
	return 'content = $atts["bar"] . $content';
}
add_shortcode( 'tag', 'foo' );

参考

関数リファレンス/add shortcode – WordPress Codex 日本語版

wp_head() の使い方

スクリプトタグやメタタグを出力するには、wp_head() を使用します。

使い方

スクリプトタグを出力したいテーマないの場所(head タグ内)で、wp_head()をよびます。

<?php wp_head(); ?>

基本的にページで一度だけ呼び出します。WordPress で wp_head() を削除すると動作に支障が場合があります。

また、wp_head() には引数がありません。
従ってカスタマイズしたい場合は、functions.php に記述することになります。

wp_head()に追加

内容を追加する場合は、functions.php で add_actionを使います。

以下の例では、style タグを追加しています。

add_action( 'wp_head', 'add_style_tag' );

function add_style_tag() {
	echo "<style> .wp_head_class { background-color : red; } </style>";
}

出力コードの編集

wp_head() に出力されるコードを編集するには、functions.php に add_filter でスクリプトに追加するコードを書くのがよくあるやり方のようです。

if (!(is_admin())) {
	function add_attr_for_style($url) {
		return 編集処理;
	}
	add_filter('clean_url', 'add_attr_for_style', 10, 1);
}

style タグに属性を追加するようなパターンですね。

参考

関数リファレンス/wp head – WordPress Codex 日本語版

プラグイン API/アクションフック一覧/wp head – WordPress Codex 日本語版

clean_url | Hook | WordPress Developer Resources

Broken Link Checker でリンクエラーをチェック

リンク切れチェックの必須のプラグイン Broken Link Checker のご紹介です。

メリット

WordPress の運用では、リンク切れ修正作業が必ず必要になります。
リンクとは時によって無効になることがあるからです。

リンクは常にアクセスできるように運用していきましょう。

使い方

プラグインを有効にするだけで、投稿内のリンクを確認できます。
Broken Link Checker 内から修正や修正後のリンク切れのチェックをできます。

参考

dynamic_sidebar() の使い方

ウィジェットエリアを呼び出すために dynamic_sidebar() を使用します。

テーマ作成では頻出の関数でしょうか。

メリット

WordPress を使いこなすにはウィジェットの活用が効果的です。
会社ページによくある「お知らせ」のようなエリアを作るには dynamic_sidebar() が便利です。

sidebar という名前がついていますが、ウィジェットを呼び出せるので直感的にはわかりにくい気がします。

使い方

ウィジェットを表示したい場所で dynamic_sidebar() を呼びます。

<?php dynamic_sidebar(サイドバーの名前かID); ?>

例えば、newsという名前のウィジェットを呼び出したい場合は引数に名前を渡します。

<?php dynamic_sidebar('news'); ?>

参考

https://wpdocs.osdn.jp/%E9%96%A2%E6%95%B0%E3%83%AA%E3%83%95%E3%82%A1%E3%83%AC%E3%83%B3%E3%82%B9/dynamic_sidebar

get_sidebar()の使い方

テーマディレクトリに置かれた sidebar.php という名前のテンプレートファイルを読み込む関数です。

テーマ作成では良く出ててくる関数なので覚えておくといいでしょう。

メリット

WordPress のテーマを作っていくと、ついテーマが複雑になっていきます。
サイドバーとしての役割は、sidebar.php などのテンプレートファイルに分割し、テーマをシンプルに保つようにしてください。

そのような際に get_sidebar() が役立ちます。

使い方

get_sidebar は呼ぶだけで sidebar.php を呼び出します。

<?php get_sidebar( サイドバー名 ); ?>

サイドバー名を指定しなければ sidebar.phpを呼び出します。
get_sidebar( ‘news’ ); のようにサイドバー名を指定すると、sidebar-news.php を呼び出します。

テンプレートファイルと合わせて get_sidebar による読み込みが必要です。

参考

https://wpdocs.osdn.jp/%E9%96%A2%E6%95%B0%E3%83%AA%E3%83%95%E3%82%A1%E3%83%AC%E3%83%B3%E3%82%B9/get_sidebar

Jetpack の failed: Error during WebSocket handshake を消す方法

Jetpack を使用していて、Console 画面で WebSocket のエラーが発生していました。

WebSocket connection to 'wss://public-api.wordpress.com/pinghub/wpcom/me/newest-note-data' failed: Error during WebSocket handshake: Unexpected response code: 403
g @ public-api.wordpress.com/:6

api.wordpress.com へアクセスできないというエラーが出ています。

こちらログインユーザーにのみ表示されるエラーです。
ですので、解消しなくても WordPress のエンドユーザーへ大きな影響は発生しないと考えています。

対応方法

Jetpackモジュールを無効化します。
https://example.com/wp-admin/admin.php?page=jetpack_modules にアクセスします。

example.com は各々ご自身のドメインを指定してください。
通知モジュールを無効にしました。

※URLを記載している理由として、現在この画面へのリンクは見つけられませんでした。そのうち対応されるかもしれません。

Jetpack通知モジュール有効
Jetpack通知モジュール有効

こちらから無効化を押下します。

Jetpack通知モジュール無効
Jetpack通知モジュール無効

通知モジュールが無効になると、表示が有効化というテキストに変わっています。

以上で、エラーが消えていれば成功です。

参考

wordpress.com ログアウト時、コンソールに表示されるエラー | WordPress.org