サポート » 使い方全般 » オリジナルWPにウィジェットを設けたい

  • 解決済 cozy-koji

    (@cozy-koji)


    お世話になります。

    オリジナルでWPブログを作ったのですが、ウィジェットの作成方法が分かりません。
    私の作成方法は
    WordPressレッスンブックという教科書を見て作成しています。この本には大変勉強させていただいたのですが
    ウィジェットについての記載がありませんでした。

    現在は index.php ; style.css ; comments.php で構成していますが
    どうやら function.php ; header.php ; sidebar.php を追加して設ける必要があるということは分かりました。
    ただ内容の記述方法などが詳しく勉強できる書籍や、ネットの講座などが見当たりません。

    いろいろと調べているのですが情報が混濁してしまっています。
    phpは独学で勉強中といった感じです。

    全くオリジナルのWPでウィジェットも設けるってことは初級~中級者には難しいことなのでしょうか。
    twentytenあたりを改造するくらいにするのが関の山ってところなんでしょうか。

    どなたか作成された方などがいらっしゃいましたら、ご教示お願いいたします。

6件の返信を表示中 - 1 - 6件目 (全6件中)
  • モデレーター jim912

    (@jim912)

    cozy-kojiさん、こんにちは。

    ウィジェットのエリアを設けるのであれば

    1. functions.phpに register_sidebar(ウィジェットエリアの登録)
    2. テーマファイルのウィジェットを表示したい場所に、dynamic sidebar(ウィジェットエリアの表示。記述するファイルは関係ない)

    です。

    まずは、Twenty Tenのfunctions.phpとsidebar.phpに該当する記述がありますので、コピーするところからはじめて、表示されたらCODEXを見ながら自分のテーマにあわせてパラメータを変えていくのがいいのではないでしょうか。

    トピック投稿者 cozy-koji

    (@cozy-koji)

    ご教示の通りやってみました。
    ①;twentyten のfunctions.phpとsidebar.phpをコピー
    ②;functions.phpの function twentyten_widgets_init() { の register_sidebar( array( で登録
      nameはウィジェットエリア1で登録。
     (私のブログではSidebarは1つです)
     ここで操作の外観のウィジェットが対応され他に、メニュー、背景、ヘッダーが追加されました。

    おっしゃってる
    1.functions.phpに register_sidebar(ウィジェットエリアの登録)はできました。

    さてこれを sidebar.php にどう対応させたら良いのかが分かりません。

    具体的には2カラムで左をサイドバーにしています。
    現在のindex.phpにある div=sidebar の中身はどのように記述し
    sidebar.phpはどのように記述すれば良いのか見当が付きません。

    もしよろしければヒントだけでもお願いできませんでしょうか。

    モデレーター jim912

    (@jim912)

    cozy-kojiさん、こんにちは。

    えーと、functions.phpとsidebar.phpは、ファイルごとコピーするのではなくて、必要な記述のみコピーすればよいです。
    まあ、不具合がなければそれでもいいのですが。。

    話が、sidebar.phpを切り分ける話とウィジェットを表示する話が混ざってしまっています。関数の名称は、register_sidebarですが、なにもsidebar.phpに記述しなければならない必要はまったくありません。

    まず、ウィジェットの表示についてですが、index.phpの div=sidebar(id=”sidebar”ですか?)直下に

    <?php dynamic_sidebar( 'xxxxxxx' ); ?>

    を追加してください。xxxxxxxは、記述したregister_sidebarのidにします。

    これで、ウィジェットが表示されるので、あとは、htmlのマークアップがvalidになるよう調整してください。

    ウィジェットエリアにウィジェットの登録がなされていない場合に、デフォルトのコードを表示させるには、

    <?php if ( ! dynamic_sidebar( 'xxxxxxx' ) ) : ?>
    デフォルトで表示するコード
    <?php endif; ?>

    になります。

    sidebar.phpを切り分ける方法は、

    div=sidebar のブロックをそのままコピーして、sidebar.phpに記述。(Twenty tenのコードは入れないでくださいね。)
    index.phpからは、div=sidebar のブロックを削除して、替わりに

    <?php get_sidebar(); ?>

    を記述すれば、ファイルの切り分けができます。
    header.phpやfooter.phpなども同様の方法で切り分けができますので、Twenty Tenなど既存のテーマを研究して試してみて下さい。

    トピック投稿者 cozy-koji

    (@cozy-koji)

    jim912さん ご丁寧にありがとうございます。m_ _m
    お陰様で無事sidebar切り離しもでき、ウィジェットも作動致しました!

    一点お聞きしたいことがあります。

    このget_sidebarとregister_sidebarとdynamic_sidebarの関係を理解できていません。
    勉強のためにお聞かせ願えるとありがたいです。

    get_sidebar はサイドバーを出力したいところに書きます。
    サイドバーの内容は sidebar.php に書いておきます。
    dynamic_sidebar はウィジェットを register_sidebar の定義に従って出力します。

    Codex: get_sidebar
    現在のテーマディレクトリの sidebar.php テンプレートファイルを読み込みます。

    Codex: register_sidebar
    「こんな感じのサイドバーを使うよ!」ってのを定義します。

    Codex: dynamic_sidebar
    ウィジェットが設定されていればそれらを出力します。
    ウィジェットが設定されていなければ、false が返ってくるのでデフォルトで表示するコードを書いてあげます。

    トピック投稿者 cozy-koji

    (@cozy-koji)

    kzさんありがとうございます。
    何となくですが雰囲気程度は分かりました。
    Codexで勉強したいと思います。
    いつもありがとうございます。

6件の返信を表示中 - 1 - 6件目 (全6件中)
  • トピック「オリジナルWPにウィジェットを設けたい」には新たに返信することはできません。