大切なあなたに、良きもの、良き方法を。
お問い合わせ

[2024年版]WEBデザイナー必須!WordPressのよく使う「テンプレートタグ」のまとめ

更新日 : 2024/01/01
wordpress

WordPressのテーマ作成中についつい忘れてしまう「テンプレートタグ」を毎回ググるのも大変なのでまとめてみました。

レバテックエキスパート

bodyにclass追加

<body <?php body_class(); ?>>

オリジナルテンプレート呼び出し

<?php include( TEMPLATEPATH . '/オリジナルファイル名.php' ); ?>

ヘッダーテンプレート呼び出し

<?php get_header(); ?>

フッターテンプレート呼び出し

<?php get_footer(); ?>

サイドバーテンプレート呼び出し

<?php get_sidebar(); ?>

コメントテンプレート呼び出し

<?php comments_template(); ?>

外部テンプレートからテンプレートファイルを呼びだし

<?php include(get_theme_root() . '/テーマフォルダ名/ファイル名.php'); ?>

レバテックエキスパート

文字コードの指定

<meta charset="<?php bloginfo( 'charset' ); ?>"> />

ホームページ名

<?php bloginfo('name'); ?>

ページタイトルとタイトルの間に区切り線挿入

<title><?php wp_title('|', true, 'right'); ?><?php bloginfo('name'); ?></title>

ディスクリプション

<?php bloginfo('description'); ?>

ホームページのURL

<?php echo home_url(); ?>

レバテックエキスパート

CSSの読み込み(style.css)

<?php echo get_stylesheet_directory_uri(); ?>

functions.phpから読み込む場合(functions.phpに書き込む)

function register_stylesheet() { //読み込むCSSを登録する
    $path = get_template_directory_uri();
    wp_register_style('style', $path.'/style.css');
}
function add_stylesheet() { //登録したCSSを以下の順番で読み込む
    register_stylesheet();
    wp_enqueue_style('style', '', array(), '1.0', false);
}
add_action('wp_enqueue_scripts', 'add_stylesheet');

Javascriptの読み込み

jsフォルダにJavascriptファイルがある場合

<?php wp_enqueue_script( 'スクリプト名', get_template_directory_uri().'/js/スクリプト名.js', array('スクリプトの種類')); ?>

functions.phpから読み込む場合(functions.phpに書き込む)

function add_scripts(){
    //本体のjquery.jsを使用
    wp_enqueue_script( 'jquery' );
    $path = get_template_directory_uri();
     wp_enqueue_script( 'スクリプト名', $path.'/js/スクリプト名.js', array(), '1.0', false);
    }
    add_action('wp_enqueue_scripts', 'add_scripts');

レバテックエキスパート

テーマテンプレートのディレクトリ

<?php echo get_template_directory_uri(); ?>

記事のID

<?php the_ID(); ?>

記事のタイトル

<?php the_title(); ?>

記事の本文

<?php the_content(); ?>

記事の本文の抜粋

120文字表示して語尾に「…」

<?php echo mb_substr($post->post_content,0,120).'…'; ?>

記事の日付

<?php the_time('Y年m月d日(D)'); ?>

記事の更新日

<?php the_modified_date('Y年m月d日(D)'); ?>

記事のURL

<?php echo get_permalink(); ?>

記事の投稿者

<?php the_author(); ?>

前後の記事へ/ページネーション

<?php previous_post_link('%link', '« %title'); ?>
<?php next_post_link('%link', '» %title'); ?>

レバテックエキスパート

記事の並び替え

アーカイブループの前に挿入

<?php query_posts($query_string .'order=asc'); ?> //昇順
<?php query_posts($query_string .'order=desc'); ?> //降順

カテゴリー名をリンク付きで表示

<?php the_category(); ?>

カテゴリー名をリンクなしで表示

<?php $cat = get_the_category(); ?>
<?php $cat = $cat[0]; ?>
<?php echo get_cat_name($cat->term_id); ?>

以下のパラメータでカスタマイズ可能

<figure class="wp-block-table"><table class="postTbB">
<tbody>
<tr><th class="thBg1">cat_name</th><td>記事のカテゴリー名。</td></tr>
<tr><th class="thBg1">cat_ID</th><td>記事のカテゴリーID。</td></tr>
<tr><th class="thBg1">category_nicename</th><td>記事カテゴリーのカテゴリースラッグ。</td></tr>
<tr><th class="thBg1">category_description</th><td>記事のカテゴリー説明文。</td></tr>
<tr><th class="thBg1">category_parent</th><td>記事の親カテゴリーにあたるカテゴリーのID。親カテゴリーがない場合は「0」を返す。</td></tr>
<tr><th class="thBg1">category_count</th><td>カテゴリーが使われている回数。</td></tr>
</tbody></table></figure>

テーマディレクトリまでのURL

<?php $uri = get_template_directory_uri(); ?>

テーマディレクトリまでの絶対パス

<?php $dir = get_template_directory(); ?>

子テーマのディレクトリまでのURL

<?php $child_theme_dir = get_stylesheet_directory(); ?>

非公開求人ならdoda

レバテックエキスパート



コメント

コメント欄

目次