ハマワークス | 大阪で活動するウェブクリエイター

WordPress テーマカスタマイザーで文章の上書きを。

ハマワークスのアイコンです。こんにちは、ハマワークスです。ワードプレスの機能、テーマカスタマイザーをつかって文章を上書きする事にしたので、その方法をご紹介致します。

スポンサードリンク
  • ブログのトップページのメインビジュアルに表示されているメッセージを見て、ふと思いました。
    そういえば、ブログ開設してからずっと固定もままだ!メッセージもその時々で流動的であったほうがいいですね。

    今回の改良について。

    こちら自分で作ったテーマなので、自分で言うのも変かもしれませんが、ブログを開いた際に表示されるメインビジュアルにテキストが表示される仕組みにしています。
    はじめての利用でもテーマを選んだ瞬間から文章が表示され、完成形に近いように仕上げたいという想いもあり、予め設定するであろう「キャッチフレーズ」を表示するようにしているのですが、実はこのキャッチフレーズを「meta discription」として出力するように設定している為、SEO的にも何度も変更するのはよくないと思われます。
    でも文章は日々流動的でありたいし・・。

    という事で、テーマカスタマイザーを使って、今ある文章を上書きして気軽に変更できるようにしようと言った感じで今回の作業に至りました。

    作業の概要。

    実際の管理画面の、カスタマイズの画面になりますが、もともとこのメインビジュアル部分は、「文章の表示/非表示のスイッチ」・「アイコンの表示/非表示のスイッチ」・「背景画像の設置」の3つの機能をあらかじめ用意していたのですが、ここにもうひとつ文章を上書きする為の項目を追加致しました (下記画像参照)。

    画像ではわかりにくいかもしれませんが一番はじめにはなかったテキストエリアが表示され、好きな文章を書けるように改良致しました。
    ここに文章を入れると、今ある文章が上書きされて、テキストエリアの内容に変わるという感じになりました。

    実際のカスタマイズ作業。

    今回の作業ですが、先日ご紹介した、WordPress テーマカスタマイザーの利用方法。の延長線上の作業となっております。。

    WordPress テーマカスタマイザーの利用方法の記事を参照の方はこちら。

    今回実行しているテーマカスタマイザーのカスタマイズについての記事を先日投稿している為、書き方やルールは是非そちらを参照してみてください。

    では実際に書き込んだコードのご紹介です。

     $wp_customize->add_section( 'decoration_impact_section', array(
        'title'     => '【インパクト設定】デザイン・装飾',
        'priority'  => 78,
        
      ));  
     $wp_customize->add_setting( 'impact_original_text', array(
        'default'   => '',
        'type'      => 'option',
      ));
      $wp_customize->add_control( 'impact_original_text', array(
        'settings'  => 'impact_original_text',
        'label'     => '表示されている文章を好きな内容に変える。',
        'section'   => 'decoration_impact_section',
        'type'      => 'textarea',
        'description' => 'impact項目の今あるテキストを好きな内容に変更する', 
      ));

    以上のようなコードをfunctionへ追記しております。
    ※今回の項目は階層が必要なかったのでパネル機能は利用しておりません。

    上記追記事項はカスタマイズ画面への指示だけとなりますので、対象となる場所へ、出力される指示をきちんと書かなければ、機能しませんね。

    <?php if ( get_option( 'impact_original_text' ) ): ?>//条件分岐
    <?php echo get_option( 'impact_original_text' ); ?>
    <?php else : ?>//条件分岐
    <?php bloginfo('description'); ?>
    <?php endif ;?>//終わり

    メインビジュアルの意図した場所へ上記を書き込み、「もし追記したテキストエリアに文章があれば表示、なければキャッチフレーズを表示」といった感じで上書きできるように致しました。

    オリジナルテーマの利便性が上がる。

    これは、こちら側の話ですが、僕が利用しているテーマは、僕だけが扱うわけでなく、コミュニティへ参加して頂いている皆様も同時に使用いただけるようにしているので、自分自身でも不便だと感じたところの修正を重ねると、他の利用者様みんなの利便性がどんどん上がっていきます。

    積極的に機能改善を進めていけばさらに利便性がアップしていきます。皆様に喜んで頂けますね笑、と思う今日この頃でございます。
    なんか話がそれましたね笑。
    では、お粗末ですが、今回の投稿を締めくくらせて頂きます。

    読んでいただいた皆様の何かのアイデアとなり役に立てたら幸いでございますm(_ _)m

    スポンサードリンク
  • ハマワークスのアイコンです。当サイトハマワークス | 大阪で活動するウェブクリエイターは、ハマワークスが運営しています。

    ハマワークスは、関りのある皆様にウェブサイト運営をする為の仕組みを提供し、活動に専念頂けるようお手伝い致します。