固定ページ用テンプレート(2カラム)の作成

以前から新たなメニューを作成したいと考えていたがようやく案が纏まったのでサイドバー用のテンプレートを準備した。Twenty Seventeenの機能は簡単んで多くの機能を加えた関係からかfunction.php等へ追加すると「重大なエラー」となる。そこで参考になる情報をNETで探すとあるある「Twenty Seventeenで簡単にテンプレートを追加」と言った情報をゲット!

TwentySeventeen

固定ページ用テンプレート(2カラム)作成

 

固定ページのデザイン変更に関する方法を詳しく記事にしているので迷うことなく作成できた。感謝!

便利なデジタル生活さんのHP
https://digital-life.club/hp/wordpress/twenty-seventeen-page-design-post#i

新規テンプレートから呼び出すパーツを作成

1.親テーマの「/themes/twentyseventeen/template-parts/page/」のパーツを全て子テーマに入れる。
2.次に「content-page.php」を同じフォルダに名前を変えてコピーしてファイルの中身を入れ替える。
  例:ファイル名「content-page-normal.php

<?php
/**
* Template Name: Content-Page-normal
* Template part for displaying page content in page.php
* @link https://codex.wordpress.org/Template_Hierarchy
* @package WordPress
* @subpackage Twenty_Seventeen
* @since 1.0
* @version 1.0
*/
?>
<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
    <?php
    if ( is_sticky() ) :
        echo twentyseventeen_get_svg( array( 'icon' => 'thumb-tack' ) );
    endif;
    ?>
    <header class="entry-header">
        <?php
            echo '<div class="entry-meta">';
            echo twentyseventeen_time_link();
            echo '</div><!-- .entry-meta -->';
        ?>
        <?php the_title( '<h1 class="entry-title">', '</h1>' ); ?>
  <!--- <?php twentyseventeen_edit_link( get_the_ID() ); ?> ---> ⇐削除!!! 
    </header><!-- .entry-header -->
    <?php if ( '' !== get_the_post_thumbnail() ) : ?>
        <div class="post-thumbnail">
            <a href="<?php the_permalink(); ?>">
            <?php the_post_thumbnail( 'twentyseventeen-featured-image' ); ?>
            </a>
        </div><!-- .post-thumbnail -->
    <?php endif; ?>
    <div class="entry-content">
        <?php
            the_content();   
            wp_link_pages( array(
                'before' => '<div class="page-links">' . __( 'Pages:', 'twentyseventeen' ),
                'after' => '</div>',
            ) );
        ?>
    </div><!-- .entry-content -->
</article><!-- #post-## -->

新規テンプレートを作成

「/themes/twentyseventeen-child/」の「page.php」を「page-normal.php」と名前を変えてコピーする。そしてファイルの中身は下記のように記載する。

<?php
/**
* Template Name: Page-normal
* Template part for displaying page content in page.php
* @link https://codex.wordpress.org/Template_Hierarchy
* @package WordPress
* @subpackage Twenty_Seventeen
* @since 1.0
* @version 1.0
*/
add_filter('body_class','normal_body_class');
function normal_body_class($classes){
$classes[] = 'has-sidebar';
return $classes;
}
get_header(); ?>
<div class="wrap">
    <div id="primary" class="content-area">
        <main id="main" class="site-main" role="main">
            <?php
            while ( have_posts() ) : the_post();
                get_template_part( 'template-parts/page/content', 'page-normal' );
                // If comments are open or we have at least one comment, load up the comment template.
                if ( comments_open() || get_comments_number() ) :
                    comments_template();
                endif;
            endwhile; // End of the loop.
            ?>
        </main><!-- #main -->
    </div><!-- #primary -->
<?php get_sidebar(); ?>
</div><!-- .wrap -->
<?php get_footer();

固定ページの新規作成画面に「テンプレート」という項目が表示されていればOK! 新規テンプレート(page-normal)を選ぶとサイドバーが現れる。

クリックコメントを閉じる

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

日本語が含まれない投稿は無視されますのでご注意ください。(スパム対策)

TOP

Copyrighted Image