WordPress ウィジェットを追加するには？テーマ統合ウィジェットエリア

カスタム メニュー機能とサイドバー ウィジェット、はいWordPressテーマの注目機能。

• このXNUMXつの機能が含まれていないと、テーマを作成するのは鶏の肋骨のようなものです...

チェン・ウェイリアン前回のウェブサイトを構築するこのチュートリアルでは、WordPress テーマを指定する方法を紹介しますカスタムメニューを追加。

この記事では、テーマの作成時にカスタム ウィジェット機能を追加する方法について説明します。

テーマにカスタム メニューを追加するのと同じように、カスタム ウィジェットの追加はわずか 3 ステップで完了します。

はじめの一歩、ガジェット登録

ウィジェットを使用するには、最初に登録し、WordPress テーマの下にある functions.php ファイルを開き、

functions.php ファイルに、次のコードを追加します。

<?php

//侧边栏小工具
if ( function_exists('register_sidebar') ) {
    register_sidebar( array(
        'name' => __( 'Top Sidebar' ),
        'id' => 'top-sidebar',
        'description' => __( 'The top sidebar' ),
        'before_widget' => '<li>',
        'after_widget' => '</li>',
        'before_title' => '<h2>',
        'after_title' => '</h2>',
    ) );
}

?>

functions.php の li タグと h2 タグを、sidebar.php のタグに対応するように変更します。

「before_widget」および「after_widget」のliおよびモジュールh2タイトルは、実際の状況に応じてコードを変更します。

(無修正かもしれません)

        'before_widget' => '<li>',
        'after_widget' => '</li>',

        'before_title' => '<h2>',
        'after_title' => '</h2>',

上記のコードは、「top-sidebar」という名前のウィジェット エリアを登録します。

• 表示名は「トップサイドバー」です。
• タイトルに h2 タグを追加します。
• コンテンツ アイテムは li でタグ付けされています。

ログインWordPress バックエンドダッシュボードで、外観→ウィジェットに移動します。

下の写真の右側にトップサイドバーのウィジェットエリアが表示されていれば登録成功です▼

第二段階、ガジェット呼び出し

ガジェットを登録すると、テーマ テンプレート ファイルで呼び出すことができ、sidebar.php ファイルで次のコードを呼び出すことができます。

1) sidebar.php ファイルで、最大の li または div タグの下に ▼ を挿入します。

<?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar(top-sidebar) ) : ?>

2) sidebar.php ファイルで、最大のまた上に▼を追加

<?php endif; ?>

ステップ XNUMX: ウィジェットをセットアップする

1) ガジェットを登録し、表示位置もテーマファイルに定義します。

• WordPressの背景にウィジェットグループエリアを設定できます▼

2) 保存後、トップページを更新します。

• 当サイトのサイドバーは下の写真のようになります▼

上の写真を見ると、ガジェットが作成され、通常どおり実行されていることがわかります。

異なる領域に複数の WordPress ウィジェットを追加する方法は?

手順 XNUMX と XNUMX を繰り返して、WordPress テーマがさまざまな場所でウィジェットをサポートするようにします。

テーマのヘッダー、サイドバー、および下部にウィジェットを追加する必要があるとします。

1) まず、次のコードを functions.php ファイルにコピーする必要があります ▼

if (function_exists('register_sidebar')) {

register_sidebar(array(
'name' => 'Header',
'id' => 'header',
'description' => 'This is the widgetized header.',
'before_widget' => '<div id="%1$s">',
'after_widget' => '</div>',
'before_title' => '<h4>',
'after_title' => '</h4>'
));
register_sidebar(array(
'name' => 'Sidebar',
'id' => 'sidebar',
'description' => 'This is the widgetized sidebar.',
'before_widget' => '<div id="%1$s">',
'after_widget' => '</div>',
'before_title' => '<h4>',
'after_title' => '</h4>'
));
register_sidebar(array(
'name' => 'Footer',
'id' => 'footer',
'description' => 'This is the widgetized footer.',
'before_widget' => '<div id="%1$s">',
'after_widget' => '</div>',
'before_title' => '<h4>',
'after_title' => '</h4>'
));

}

2) 次に、次のコードをそれぞれ header.php、sidebar.php、および footer.php ファイルに追加します。

header.php ▼

<div id="widgetized-header">

<?php if (function_exists('dynamic_sidebar') && dynamic_sidebar('header')) : else : ?>

<div>
<p><strong>Widgetized Header</strong></p>
<p>This panel is active and ready for you to add some widgets via the WP Admin</p>
</div>

<?php endif; ?>

</div>

サイドバー.php ▼

<div id="widgetized-sidebar">

<?php if (function_exists('dynamic_sidebar') && dynamic_sidebar('sidebar')) : else : ?>

<div>
<p><strong>Widgetized Sidebar</strong></p>
<p>This panel is active and ready for you to add some widgets via the WP Admin</p>
</div>

<?php endif; ?>

</div>

フッター.php ▼

<div id="widgetized-footer">

<?php if (function_exists('dynamic_sidebar') && dynamic_sidebar('footer')) : else : ?>

<div>
<p><strong>Widgetized Footer</strong></p>
<p>This panel is active and ready for you to add some widgets via the WP Admin</p>
</div>

<?php endif; ?>

</div>

これは成功です！

• もちろん、必要に応じてコードのさまざまな詳細を変更することもできます ^_^
• 上記の 2 つの手順により、テーマの残りの部分がウィジェットの機能を統合できるようになります。

次に、WordPress でウィジェットを使用するためのヒントを引き続き共有します。

WordPress テーマ統合ウィジェット ウィジェットのヒント

カスタム ウィジェットを効率的に管理します。

1) ウィジェットをテーマに追加した後、別のファイルを作成して名前を付けることができますwidgets.php。

• 手順 1 で追加したすべてのカスタム ウィジェット コードをこのフォルダーに保存するため。

2) functions.php ファイルにコードを追加します。

if ($wp_version >= 2.8) require_once(TEMPLATEPATH.’/widgets.php’);

3) 手順 1 で追加したすべてのカスタム ウィジェット ウィジェット コードを widgets.php ファイルに保存します。

この方法により、すべてのウィジェットがスムーズに読み込まれ、ウィジェットをサポートするすべての WordPress バージョンで動作することが保証されます。

これにより、WordPress テーマ ファイルをより効率的に管理できます。