このページでは、Nishiki Pro テーマの「投稿一覧」ブロック、「RSS」ブロック、最近の投稿、カテゴリーやタグなどのアーカイブページの投稿一覧などで使われている「続きを読む」のテキストや、その周辺の html を変更する方法について解説しています。
ここからの情報は、PHP でコードが書けたり、ワードプレスのカスタマイズ知識や技術をある程度持っている上級者向けの内容として公開しています。
カスタマイズ用のプラグインを作ったり、子テーマを作って functions.php 内にコードを追記するなどで実装してください。
このようなカスタマイズがスラスラできるようになると、ワードプレスを扱う技術力も向上し、自信にもつながります。
もし駆け出しや初心者の方でも「やってみようかなぁ・・・」と、やる気がある方は、ぜひ挑戦してみてください!
サンプルコード
「続きを読む」のテキストを変更
「続きを読む」のテキストだけ変えたい場合、以下のコードを書くとできます。
if ( ! function_exists( 'nishiki_pro_change_translated_text' ) ) {
function nishiki_pro_change_translated_text( $translated_text, $untranslated_text, $domain ) {
if( $domain == 'nishiki-pro' ){
switch ( $untranslated_text ) {
case 'Read More':
$translated_text = '続きはこちら!';
break;
}
}
return $translated_text;
}
add_filter( 'gettext', 'nishiki_pro_change_translated_text', 10, 3 );
}
「続きを読む」の周辺の html も変えたい場合
次に「続きを読む」のテキストだけではなく、周辺の html も変えたい場合は以下のように書きます。
// 「続きを読む(Read More)」の html を変更
if ( ! function_exists( 'nishiki_pro_custom_readmore_html' ) ) {
function nishiki_pro_custom_readmore_html( $html, $post_id ){
if( $post_id == 10638 ){
$html = '<span class="read-more-test">詳細はこちら</span>';
}
return $html;
}
add_filter( 'nishiki_pro_readmore_html', 'nishiki_pro_custom_readmore_html', 10, 2 );
}
「nishiki_pro_readmore_html」フィルターを使って、$post_id(投稿 ID)が 10638 の場合に html を変更しています。好きなクラスやテキストを設定してもいいですね。
※ 「nishiki_pro_readmore_html」フィルターの第 2 引数 $post_id には投稿 ID が入りますが、「RSS」ブロックの場合は投稿 ID がありませんので空文字「''」が入ります。
「続きを読む」の周辺の html も全て非表示(削除)にする方法
とりあえず「続きを読む」のテキストやその周辺の html を全て非表示(削除)にしたい、という場合は、以下のコードを書けばできます。
add_filter( 'nishiki_pro_readmore_html', '__return_false' );
WordPress テーマ Nishiki Pro
「ウェブサイト運営に本当に必要とされる機能」をテーマ内にまとめて搭載したワードプレステーマです。
ブロックエディター機能を強化し、これまでのワードプレスでは難しかったコンテンツが簡単に作れます。
ブログ、ポートフォリオ、コーポレートサイト、ビジネスサイト、オンラインショップなど、様々な目的のウェブサイトに対応できるテーマです。
最新情報をチェック!
Nishiki / Nishiki Pro テーマに特化した情報を「にしきちゃん」がお伝えします😀
- リリース情報
- 新機能の紹介
- 便利な使い方
- 開発中の機能紹介
- 導入事例
- あるある日常ネタ
など