WordPress widgetで縦長ページを編集

Wordpress関連
2018年10月10日

某案件で、コンテンツ量も多くなく、閲覧してもらう際にも負担なく見てもらいたいということで、
縦長のページに必要コンテンツを並べ、ページ遷移の少ない構成にした。
このときに各項目に利用したのがwidgets。
独自のwidgetを必要分作り、各項目にあてた。

ページに掲載するコンテンツはこんな感じ。

・information
・about
・president
・member
・mission
・imfo-img
・about-img

コードは以下を必要分だけfunctions.phpに追加する。

//widgetを追加
function mainpage_widgets_init() {
  register_sidebar( array(
    'name' => 'informaion',
    'id' => 'mainpage_1',
    'before_widget' => '<p>',
    'after_widget' => '</p>',
    
));

register_sidebar( array(
    'name' => 'about',
    'id' => 'mainpage_2',
    'before_widget' => '<p>',
    'after_widget' => '</p>',

));

register_sidebar( array(
    'name' => 'president',
    'id' => 'mainpage_3',
    'before_widget' => '<div class="textbox-about delay">',
    'after_widget' => '</div>',

));
//ここに必要分を追加する
}
add_action( 'widgets_init', 'mainpage_widgets_init' );

そして表示させたい箇所に以下を挿入。

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

例えば２カラムのページで構成するような場合はsidebarは一つで良いので最初の
register_sidebar一つでOK。
その一つのsidebarに必要項目（widget）を設置していく。
出力方法は同じ。

PAGE TOP