2017-03-04

textwidgetクラスの無いテキストウィジェットを作成する

はじめに

WordPressのウィジェットには、タイトル及び本文を自由に記述することのできるテキストウィジェットがあります。とりあえずソースからWordPress上で編集できるように押し込んだりするのに便利ですが、このテキストウィジェットにも使いにくいところがあります。それは、本文の前後にdivの「textwidget」というクラスが付与されることです。

まあ、ある程度クラスが付与されるのは仕方のないことだとは思いますが、このクラスがあるせいでレイアウトが崩れてしまったり、場合によっては結構邪魔に感じます。ですので、今回はそれを出力しないテキストウィジェットの作成方法をご紹介したいと思います。

テキストウィジェットをコピーする

前に、6件目の投稿から表示するウィジェットを作成しましたが、手順的はそれと一緒です。まず、WordPressのデフォルトウィジェットが入ったディレクトリ「/wordpress/wp-includes/widgets/」から「class-wp-widget-text.php」を選択して開きます。中の「class WP_Widget_Text extends WP_Widget {」と書かれた行からファイルの末尾までをコピーして、functions.phpに貼り付けます。

textwidgetクラスを削除する

コピーしたら、以下の部分を探し出して変更します。

変更前

  • <div class="textwidget"><?php echo !empty( $instance['filter'] ) ? wpautop( $text ) : $text; ?></div>

変更後

  • <?php echo !empty( $instance['filter'] ) ? wpautop( $text ) : $text; ?>

見ての通り、この記述でtextwidgetクラスが出力されているので、物理的取っ払ってやりました。このままだと既存のテキストウィジェットとダブってしまうので、以下の部分も変更してやります。

変更前

  • class WP_Widget_Text
  • 'classname' => 'widget_text',
  • 'description' => __( 'Arbitrary text or HTML.' ),
  • parent::__construct( 'text', __( 'Text' ), $widget_ops, $control_ops );

変更後

  • class WP_Widget_Text_noclass
  • 'classname' => 'widget_text_noclass',
  • 'description' => __( 'textwidgetクラスのないテキストウィジェット' ),
  • parent::__construct( 'text_noclass', __( 'textWidgetなしテキスト' ), $widget_ops, $control_ops );

「'description' =>」で変更した文言はWordPressの管理画面→ウィジェットの画面で表示される各ウィジェットの説明文、「parent::__construct」のところで変更した「textWidgetクラスなしテキスト」は同じ画面で表示されるウィジェットの名前となります。その他のPHPクラス名などもあくまで例なので、既存のものと被らなければ自由です。ウィジェットの画面に以下のものが追加されていれば成功です。

textwidgetクラスの無いテキストウィジェット

さいごに

これで、余計なtextwidgetクラスの無い、スッキリしたテキストウィジェットを作成することができました。他にも、タイトルが必要なかったら根っこから削除してしまうなど、コツがわかればもっと様々なカスタマイズすることも可能です。自分好みのウィジェットを作成して、快適なWordPressライフを送りましょう。



コメントする(※は必須項目です)













画像認証