サイト型トップページの作り方を公開しています!Check

Cocoon「新着記事」「もっと見る」「次のページ」ボタン・キャプションのテキストを変更する方法

アイキャッチ|テキスト変更 Cocoon
Cocoon
記事内に広告が含まれています

Cocoonテーマを使用している際に、あらかじめ設定されているボタンやキャプションのテキスト文言を変更する方法を紹介します。PHPを活用し簡単にカスタマイズできるのでぜひ参考にしてください。

以下のテキストを変更できます
  • 新着記事」(見出し)
  • もっと見る」(ボタン)
  • 次のページ」(ボタン)
スポンサーリンク

この記事を書いた人

はるみです
吹き出し/女性
  • ブログ好きな40代主婦
  • CocoonサイトをCSSでカスタマイズ
  • 2020年1月1日ブログ開設
  • ドメインパワー40
  • 2023年~有料記事公開
    • →累計370件(月間約20件)購入いただいています

コードを記述する場所/Cocoon(子テーマ)のfunctions.php

コードを貼り付ける場所は、Cocoonの子テーマ(functions.php)です。

作業前に必ずバックアップを取ることをおすすめします。

  1. 管理画面の「外観」から「テーマファイルエディター」
    • Cocoon Child: テーマのための関数 (functions.php)をクリックします
  2. 元から書いているコード(テーマ用関数)は消さずにPHPを記述します
    • //以下に子テーマ用の関数を書く、から下の行に追加しましょう
見出し

子テーマ(Cocoon child)が選択されていることを確認します

phpの記述について
スポンサーリンク

Cocoon|「新着記事」見出しを変更する

例えば、「新着記事」→「New Post」に変更したい場合、以下のコードをfunctions.phpに追加します。このコードを適用すると、「新着記事」の見出しが「New Post」に変更されます。

//フロントページタイプの新着記事テキスト変更
add_filter('new_entries_caption', function ($caption){
	return 'NEW POST';
});
スポンサーリンク

Cocoon|「もっと見る」ボタンのテキストを変更する

例えば、「もっと見る」→「Read More」に変更したい場合、以下のコードを追加します。

//「もっと見る」ボタンのテキスト変更
add_filter('more_button_caption', function ($caption){
	return 'Read More';
});
スポンサーリンク

Cocoon|ページネーションの「次のページ」テキストを変更する

例えば、「次のページ」→「Next」に変更したい場合、以下のコードを追加します。

//ページネーションの「次のページ」テキスト変更
add_filter('pagination_next_link_caption', function(){
	return 'Next';
});
スポンサーリンク

まとめ

イメージ画像/まとめ

Cocoonには多くのフィルターフックが用意されており、親テーマのPHPファイルを直接編集せずにカスタマイズが可能です。

今回紹介した方法を活用すればボタンや見出しの文言を自由に変更できます。サイトのデザインやコンセプトに合ったテキストを設定し、ユーザーにとって使いやすいサイトを作りましょう。

Comment コメントはこちらへ

タイトルとURLをコピーしました