web-dev-qa-db-ja.com

ウィジェットタイトルの後にウィジェットコンテンツをラップするdivを追加する

動的サイドバーのウィジェットのコンテンツにdivを追加しようとしています。

これがレジスタコードです。

register_sidebar(array(
        'name' => "Sidebar1",
        'id' => 'home-sidebar-1',
        'before_widget' => '<div class="sidebar-box">',
        'after_widget' => '</div>',
        'before_title' => '<div class="title">',
        'after_title' => '</div>',
    ));

しかし、このコードはこのようになります。

<div class="sidebar-box">
    <div class="title">{WIDGET TITLE}</div>
     {WIDGET CONTENT}
</div>

これが私がやろうとしていることです。

<div class="sidebar-box">
    <div class="title">{WIDGET TITLE}</div>
    <div class="content">
           {WIDGET CONTENT}
    </div> 
</div>

どうやってそれができるの？

theme-developmentwidgets
10
MBraiN

Toschoの答えに加えて、堅牢なソリューションに必要なものは次のとおりです。

// if no title then add widget content wrapper to before widget
add_filter( 'dynamic_sidebar_params', 'check_sidebar_params' );
function check_sidebar_params( $params ) {
    global $wp_registered_widgets;

    $settings_getter = $wp_registered_widgets[ $params[0]['widget_id'] ]['callback'][0];
    $settings = $settings_getter->get_settings();
    $settings = $settings[ $params[1]['number'] ];

    if ( $params[0][ 'after_widget' ] == '</div></div>' && isset( $settings[ 'title' ] ) && empty( $settings[ 'title' ] ) )
        $params[0][ 'before_widget' ] .= '<div class="content">';

    return $params;
}

Toschoの答えから：

register_sidebar(array(
    'name' => "Sidebar1",
    'id' => 'home-sidebar-1',
    'before_widget' => '<div class="sidebar-box">',
    'after_widget' => '</div></div>',
    'before_title' => '<div class="title">',
    'after_title' => '</div><div class="content">',
));

これが何をするものです：

  • 2で終わるウィジェットの登録済みサイドバーの設定をチェックする<div>s
  • タイトルがないか確認する
  • そうでない場合は、before_widgetの出力を変更して開始ウィジェットのコンテンツdivを表示します。

このアプローチを使用して、ウィジェットインスタンスの設定に基づいて他の方法でサイドバーの引数を変更することができます。

17
sanchothefat

私は@toscoと@sanchothefatの両方の答えのアイデアが好きでした - しかし、empty( $settings[ 'title' ]はtrueを返すかもしれませんが、もし何も設定されていなければウィジェット自体がデフォルトのタイトルを出力するかもしれないので。このタイトルはbefore_titleとafter_titleマークアップでラップされ、改ページされます。とにかく、それはいくつかのデフォルトウィジェットの場合です。

標準的なウィジェット登録パラメータをそのまま使用する方が簡単です。

register_sidebar(array(
    'id' => 'sidebar1',
    'name' => __( 'Sidebar 1', 'bonestheme' ),
    'description' => __( 'The first (primary) sidebar.', 'bonestheme' ),
    'before_widget' => '<div class="block">',
    'after_widget' => '</div>',
    'before_title' => '<div class="block-title">',
    'after_title' => '</div>',
));

それからMarventusの答えに従ってフィルタアクションをここに追加してください。

http://wordpress.org/support/topic/add-html-wrapper-around-widget-content

function widget_content_wrap($content) {
    $content = '<div class="block-content">'.$content.'</div>';
    return $content;
}
add_filter('widget_text', 'widget_content_wrap');
2
rabmcnab

Titleパラメータに2番目のdivを追加します。

register_sidebar(array(
        'name' => "Sidebar1",
        'id' => 'home-sidebar-1',
        'before_widget' => '<div class="sidebar-box">',
        'after_widget' => '</div></div>',
        'before_title' => '<div class="title">',
        'after_title' => '</div><div class="content">',
    ));
2
fuxia

これを達成するためにあなたがすることはこれである：

register_sidebar(array(
        'name' => "Sidebar1",
        'id' => 'home-sidebar-1',
        'before_widget' => '<div class="sidebar-box"><div class="content">',
        'after_widget' => '</div></div>',
        'before_title' => '</div><div class="title">',
        'after_title' => '</div><div class="content">',
    ))

タイトルがない場合は、次のようになります。

<div class="sidebar-box"><div class="content">
{CONTENT}
</div></div>

タイトルがあるときあなたは得るでしょう：

<div class="sidebar-box"><div class="content">
</div><div class="title">
{TITLE}
<div class="content">
{CONTENT}
</div></div>

後者の場合、最初の空のcontent-divが表示されないようにするには、これをCSSに追加します。

.sidebar-box .content:empty {display:none !important;}
0
cjbj

register_sidebar に触れる必要がないように、コードを少し変更しただけです。通常の方法でサイドバーを登録します。

register_sidebar(array(
    'name' => "Sidebar1",
    'id' => 'home-sidebar-1',
    'before_widget' => '<div class="sidebar-box">',
    'after_widget' => '</div>',
    'before_title' => '<div class="title">',
    'after_title' => '</div>',
));

そして、以下はSanchothefat's Solutionからの修正されたコードです：

/**
 * If no title given then add widget-content wrapper to before_widget
 * If title given then add content wrapper to before_widget
*/
add_filter('dynamic_sidebar_params', 'check_widget_template');
function check_widget_template($params){
    global $wp_registered_widgets;

    $settings_obj = $wp_registered_widgets[$params[0]['widget_id']]['callback'][0];
    $the_settings = $settings_obj->get_settings();
    $the_settings = $the_settings[$params[1]['number']];

    if (isset($params[0]['id']) && $params[0]['id'] == 'home-sidebar-1') {
        if (!isset($the_settings['title']) && empty($the_settings['title'])) {
            $params[0]['before_widget'] .= '<div class="widget-inner">';
            $params[0]['after_widget']  .= '</div>';
        } else {
            $params[0]['after_widget']  .= '</div>';
            $params[0]['after_title']   .= '<div class="widget-inner">';
        }
    }

    return $params;
}
0
Razon K.

前回の回答を見た後、Cmoralesがsanchothefatの回答で特定した問題を解決したと思います。以下のようにウィジェットを定義してください。

register_sidebar( array(
    'name' => 'Sidebar',
    'id' => 'sidebar',
    'before_widget' => '<div class="panel panel-default %2$s" id="%1$s">',
    'after_widget' => '</div>',
    'before_title' => '',
    'after_title' => ''
) );

before_titleとafter_titleのデフォルトを削除することが重要です。試行錯誤の末、デフォルトのタイトルを表示した最初のフィルタはwidget_titleであることに気付きました。それからwidget_titleフィルタを次のように使います。

function widget_title( $title ) {
    if ( $title )
        $title = '<div class="panel-heading"><h3 class="panel-title">' . $title . '</h3></div>';
    $title .= '<div class="panel-body">';
    return $title;
}

基本的に、<div class="panel-heading"><h3 class="panel-title">は私のbefore_titleであり、</h3></div>は私のafter_titleです。最後に、dynamic_sidebar_paramsを使用して、コンテンツの折り返しの最後にdivを付けます。

function dynamic_sidebar_params( $params ) {
    $params[0]['after_widget'] = '</div>' . $params[0]['after_widget'];
    return $params;
}

それはきれいではありませんが、それは動作します。

0
Spencer