WordPressテーマのウィジェット化がいかに簡単かをご覧ください

テーマをウィジェット対応にすることは、思ったほど難しくありません。テーマをウィジェット化するには、通常、サイドバーアイテムをウィジェット対応にする必要があります。私は行きます ウィジェット対応のテーマとは 前の記事で。きれいなCSSでコーディングされたテーマを使用している場合、5分以内で済むこともあります。その方法を説明します.


  • テーマが「ウィジェットフレンドリー」であることを確認する
  • サイドバーを登録するfunctions.phpファイルを作成する
  • 静的サイドバーを動的サイドバー条件タグで囲みます
  • 複数のウィジェット対応領域を作成する
  • ウィジェットを使用するその他の創造的な方法

テーマのウィジェット化を開始して、次に進んでください…

最初に行う必要があるのは、サイドバー(またはウィジェット化するもの)が、ウィジェットフレンドリーと呼んでよいものであることを確認することです。これには、HTMLを特定の方法でフォーマットすることが含まれます。ウィジェット対応のWordPressテーマの理想的なサイドバー項目は、次のようにコーディングされます。

カテゴリー

これが非常にクリーンなコードであることを確認してください。 divも追加されたクラスもありません

    そして
  • タグ.

    次の4つの例もウィジェット化可能です.

    カテゴリー

  • カテゴリー

  • カテゴリー

    カテゴリー

    はい、これらの例にはdivが追加されていますが、それらはWordPressウィジェットシステムで動作します。 2つの間に何もない限り

      CSSスタイリングにはタグが必要です。これで問題ありません。つまり、次の例は ない ウィジェットフレンドリー.

      カテゴリー

      これは、スタイルが

        そして
      • タグ。この問題を回避するために、テーマがより「理想的な」ウィジェットフレンドリーな方法のいずれかでコーディングされていることを確認してください.

        サイドバーを登録する

        次のステップは、レイアウトを評価することです。ウィジェット化された領域がいくつ必要ですか? 1つは問題ありません。 2つ以上でも問題ありません。上で説明したように、ウィジェットに対応している限り、さまざまな方法でフォーマットすることもできます。.

        最初に必要なのは、 functions.php テーマディレクトリ内のファイル。これは、プラグインを使用したり、コアコードを編集したりせずに、PHPコードでWordPressの機能を変更するために使用できるファイルです。すべてが特定のテーマに組み込まれています.

        この投稿の最初の例である、ウィジェットに適したサイドバーアイテムの理想的な形式を振り返ってみましょう。そのフォーマットでサイドバーを登録するには、functions.phpファイルに次のコードを配置します。.

        <?php
        if(function_exists( ‘register_sidebar’))
        register_sidebar(array(
        ‘before_widget’ => 」,
        ‘after_widget’ => 」,
        ‘before_title’ => 」

        」,
        ‘after_title’ => 」

        」,
        ));
        ?>

        自明のようですよね? 「カテゴリ」のタイトルは

        そして

        , したがって、それをbefore_titleとafter_titleの値にそれぞれ置きます。他のbefore_widgetおよびafter_widgetにコードを配置して、レイアウトに必要な他のコード内に各ウィジェット項目を囲むこともできます.

        サイドバーのコンディショナルタグ

        ねえ、コンディショナルタグ?うまくいけば 聞き覚えがある. サイドバーがウィジェットに登録されているかどうか、およびウィジェットがアクティブかどうかを確認するために、同様の方法を使用します。サイドバーの上部(またはウィジェットの表示を開始する場所)に次のコードを配置します.

        <?php if(!function_exists( ‘dynamic_sidebar’)||!dynamic_sidebar()): ?>

        サイドバーのものはその中間に入り、そして…

        <?php endif; ?>

        endifがあることを確認してください。ある時点でifステートメントを開いた後、またはテーマ全体が壊れます。この時点ですべてを完了している場合、テーマはウィジェットに対応しているはずです。ただし、まだ完了していません…

        複数のウィジェット準備エリア

        functions.phpファイルにいくつかの追加と変更を加え、テーマファイルにifステートメントをいくつか追加すると、それぞれ独自の名前を持つウィジェット化された領域をいくつでも持つことができます。.

        たとえば、左側に1つ、右側に2つ、サイドバーが2つある3列のレイアウトがあるとします。これらの両方を個別にウィジェット化したいとします。最初の例のサイドバー構造を両方で使用します。 functions.phpファイルは次のようになります。

        <?php
        if(function_exists( ‘register_sidebar’))
        register_sidebar(array(
        ‘名前’ => 「左サイドバー」,
        ‘before_widget’ => 」,
        ‘after_widget’ => 」,
        ‘before_title’ => 」

        」,
        ‘after_title’ => 」

        」,
        ));
        if(function_exists( ‘register_sidebar’))
        register_sidebar(array(
        ‘名前’ => 「右サイドバー」,
        ‘before_widget’ => 」,
        ‘after_widget’ => 」,
        ‘before_title’ => 」

        」,
        ‘after_title’ => 」

        」,
        ));
        ?>

        配列の新しい名前の部分に注意してください。これには好きな名前を付けることができますが、わかりやすい名前にしてください。ここで、sidebar.phpファイルに移動するとき、または各サイドバーがテーマのどこにあるときでも、次の条件タグを使用します。functions.phpで選択したサイドバーの名前を使用します。また、編集中に警告メッセージがポップアップ表示される可能性があるため、このファイルに誤ったスペースや改行がないことを確認してください.

        <?php if(!function_exists( ‘dynamic_sidebar’)||!dynamic_sidebar("左サイドバー")): ?>デフォルトの左側のサイドバーはここに…
        <?php endif; ?>

        そして右側のサイドバー…

        <?php if(!function_exists( ‘dynamic_sidebar’)||!dynamic_sidebar("右サイドバー")): ?>ここにデフォルトの右サイドバーのもの…
        <?php endif; ?>

        両方のファイルで選択した名前に関してすべてが一致していることを確認してください.

        ウィジェットでできるその他のこと

        ウィジェットをサイドバーに使用する必要はありません。それらはフッターのような他のもののために、あるいはヘッダーでさえ使用することができます。理論的には、コンディショナルタグの間に「デフォルト」コードを挿入する必要はありません。クリエイティブになって、想像力を働かせてください。ヘッダーでウィジェットを使用して 広告を回転させる, または持っている ログインボックスウィジェット フッター、またはどこにでも–それはあなた次第です.

        結論

        このチュートリアルから学び、テーマをウィジェット化する方法を理解したことを願っています。編集中に「ヘッダーはすでに送信されました…」などのエラーが発生した場合は、functions.phpファイルを再確認して、終点の下にスペースがないことを確認する必要があります ?> 鬼ごっこ.

        いくつかのさらなる読書はで利用可能です 自動 そして WPDesigner. それらのページで私がやったコードのいくつかの他の「省略形」バージョンがあります.

        気に入った場合は、コメントまたは共有してください。私はすべてのフィードバックを歓迎します。また、サブスクライブしてください フィード 最新のテーマリリースとチュートリアルをまだ入手していない場合.

        Jeffrey Wilson Administrator
        Sorry! The Author has not filled his profile.
        follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map