4


0

WordPressのすべてのウィジェットにカスタムクラスを追加しますが、あなたのアプローチは何ですか?

ワードプレスのテーマを作成していますが、ウィジェットのヘッダーに画像置換を実装する際に問題が発生しています。

ウィジェットをラップするカスタムクラスまたはIDを追加するにはどうすればよいですか?

例えば

HTML:

     This Title will be replace by an Image
     Wordpress 'Text' Widget content here



     This Title will be replace by an Image
     Wordpress 'Text' Widget content here



     This Title will be replace by an Image
     Wordpress 'Text' Widget content here

CSS:

#anotherCustomWidgetId h2 {
 text-indent: -1000em;
 background: url of my image;
 width: ;
 height: ;
}

ウィジェットのIDとクラスを制御する必要があります。 そのため、ウィジェットのカスタムcssイメージ置換を作成できます。

あなたが私の靴にいるなら、ワードプレスでどのように実装しますか?

ありがとうございます。

3 Answer


8


すべてのウィジェットに1つのクラスを追加するだけの場合(clearfixの修正のためにこれを行った)、register_sidebarに別の行を追加します。

     register_sidebar(array(
        'id' => 'sidebar1',
        'name' => 'Sidebar (Main)',
        'description' => 'Primary sidebar',
        'before_widget' => '',
        'after_widget' => '',
        'before_title' => '',
        'after_title' => '',
        'class' => 'clearfix'
    ));

これにより、すべてのウィジェットに「clearfix」のクラスが追加されました。


4


あなたがウィジェットクラスが何であるかわからない場合(そしてそれらを変更できない、または変更したくない場合)nth:childを使用してCSS3でサイドバー内のh2要素をターゲットにし、それを実装しないブラウザのサポートを提供しますjavascript。

ウィジェット(プラグインフォルダーにある)を修正して特定のクラスを追加するか、動的サイドバーがthe_widget()テンプレートタグを使用して各ウィジェットを呼び出すことを望まない場合。 ウィジェットテンプレートタグは、CSSフックに使用できるウィジェットタイトルとウィジェット自体の前後にhtmlを配置できるようにする引数を取ります

コーデックスはhttp://codex.wordpress.org/User:Bono/Template_Tags/the_widget [ユーザーbonoコントリビューション]で親切に更新されました。


1


これは私のために働いたものです-ウィジェットコンテンツに特別なクラスを与えたかった-class = "widget-content"-残りは元のままにすることができます:)

register_sidebar( array(
    'name' => __( 'Blog Sidebar'),
    'id' => 'sidebar-blog',
    'before_widget' => '',
    'after_widget' => "",
    'before_title' => '',
    'after_title' => '',
) );

function add_widget_content_wrapper($content) {
    $new_content = '';
    $new_content.= $content . '';
    return $new_content;
}
add_filter('widget_title', 'add_widget_content_wrapper');