※情報古いのありますm(_ _)m
WordPressテンプレートタグ集!!!
「コピペして使ってね♪」
これまで数多くWordPressでwebサイトを制作してきましたが、過去の実績で使ってきたテンプレートタグを、基本的なタグから便利なタグまで幾つかピックアップ致します。
私自身が一番この記事を参考にする事でしょう(笑)
ブログカスタマイズのテーマ調整だけでなく、WordPressでホームページを作り込みたい人にもおすすめです!
テンプレートタグの組み合わせ次第では、初心者の方でも比較的レベルの高いホームページを作れるはずです!?
私自身がよく使うWordPressのマルチサイト化する時のテンプレートタグも記載しているので要チェックです!
インクルードタグ(テーマファイルへ挿入)
プラグイン動作用タグ(ヘッダー用:必須)
<?php wp_head(); ?>
プラグイン動作用タグ(フッター用:必須)
<?php wp_footer(); ?>
bodyへのclass設定対応
<body <?php body_class(); ?>>
ヘッダーテンプレート
<?php get_header(); ?>
サイドバーテンプレート
<?php get_sidebar(); ?>
フッターテンプレート
<?php get_footer(); ?>
コメントテンプレート
<?php comments_template(); ?>
検索フォームのテンプレート
<?php get_search_form(); ?>
任意のテンプレートファイル.phpの呼び出し(ファイル名を自由に決めれる)
<?php include( TEMPLATEPATH . '/ファイル名自由.php' ); ?>
外部のテーマファイルからテンプレートファイル.phpを呼び出し(インクルード)
<?php include(get_theme_root() . '/テーマフォルダ名/***.php'); ?>
スマートフォンとパソコンのコンテンツ表示の有無
<?php if ( function_exists('wp_is_mobile') && wp_is_mobile() ) :?>
スマートフォン用コンテンツを配置。
<?php else: ?>
パソコン用コンテンツを配置。
<?php endif; ?>
WordPressの基本情報を出力
文字コードの指定
<meta charset="<?php bloginfo( 'charset' ); ?>"> />
ブログ名
<?php bloginfo('name'); ?>
<title>タグに設定するタグ(ページタイトルとサイトタイトルの間に区切り線挿入)
<title><?php wp_title('|', true, 'right'); ?><?php bloginfo('name'); ?></title>
ブログのURL
<?php echo home_url(); ?>
CSS(スタイルシート)のURL
<?php echo get_stylesheet_directory_uri(); ?>
テーマテンプレートのURL
<?php echo get_template_directory_uri(); ?>
JavaScriptの読み込み時のURL(jQueryなどの利用時)
<?php wp_enqueue_script( 'スクリプト名', get_template_directory_uri().'/js/スクリプト名.js', array('スクリプトの種類')); ?>
ディスクリプション(説明)
<?php bloginfo('description'); ?>
RSSフィードのURL
<?php bloginfo('rss2_url'); ?>
<?php bloginfo('atom_url'); ?>
AtomフィードのURL
<?php bloginfo('atom_url'); ?>
index.phpページ以外をトップページで利用
index.phpページ以外をトップページにする場合の”任意.php”への設定表記(本文エリアの先頭に記載)
<?php
/*
Template Name:メイン画面 ← 名前任意
*/ ?>
カテゴリーごとに違うデザインの個別ページを表示
(カテゴリーIDが1の場合、single-info.phpを表示。それ以外は、single.phpを表示。)<?php
$post = $wp_query->post;
if ( in_category('1') ) {
include(TEMPLATEPATH . '/single-info.php');
}
?>
ポータルサイトのトップページに配置する新着情報一覧に使う
<?php query_posts('showposts=6'); ?>
<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
<li><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a>
<?php the_date('Y年m月d日(D) h:i:s'); ?></li>
<?php endwhile; endif; ?>
<?php wp_reset_query(); ?>
カテゴリーごとに新着エントリー表示(カテゴリー3の最新エントリー10件を表示)
<ul class="qa1_list">
<?php $myposts = get_posts('numberposts=10&category=3'); foreach($myposts as $post) : ?>
<li><?php echo get_the_date("Y年n月j日(D)"); ?> <a href="<?php the_permalink(); ?>" id="post-<?php the_ID(); ?>"><?php the_title(); ?></a></li>
<?php endforeach; ?>
</ul>
マルチサイト化した子ブログの記事を読み込む方法(子ブログID2の最新エントリーを6件を表示)
<?php switch_to_blog(2) ?>
<?php global $post;
$myposts = get_posts('numberposts=6');
foreach($myposts as $post) :
setup_postdata($post); ?>
<li><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></li>
<?php endforeach; ?>
<?php restore_current_blog(); ?>
投稿エリアでよく使うテンプレートタグ
記事のID(同じページ間での移動に使える)
<?php the_ID(); ?>
記事の日付
<?php the_time('Y年m月d日(D)'); ?>
記事の更新日
<?php the_modified_date('Y年m月d日(D)'); ?>
記事のタイトル
<?php the_title(); ?>
記事の本文
<?php the_content(); ?>
記事本文の文字を制限して表示(140文字で区切って語尾に...を表示)
<?php echo mb_substr($post->post_content,0,140).'...'; ?>
記事のURL(パーマリンク)
<?php echo get_permalink(); ?>
記事の投稿者名
<?php the_author(); ?>
投稿記事タグのセット(CSS付き(任意))
<div class="contents">
<?php if (have_posts()) : ?>
<?php while (have_posts()) : the_post(); ?>
<div class="section">
<div class="data"><?php the_date(); ?></div>
<div class="title"><?php the_title(); ?></div>
<?php the_content(); ?>
</div><!--section-->
<?php endwhile; ?>
<?php endif; ?>
</div><!--contents-->
前の記事へ・次の記事へ
<div class="previous"><?php previous_post_link('%link', '« %title'); ?></div>
<div class="next"><?php next_post_link('%link', '» %title'); ?></div>
記事の並び替え(昇順・降順)
記事のループの前に下記を追記。<?php query_posts($query_string .'order=asc'); ?> //昇順
<?php query_posts($query_string .'order=desc'); ?> //降順
カテゴリー名をリンク付きで表示(カテゴリーページへ遷移)
<?php foreach((get_the_category()) as $cat) {
$cat_id = $cat->cat_ID ;
break ;
}
$category_link = get_category_link( $cat_id ); ?>
<a href="<?php echo $category_link; ?>" title="<?php echo $cat->cat_name; ?>"><?php echo $cat->cat_name; ?></a>
記事にinterview(任意)タグが設定されてある場合表示するif文
<?php if(has_tag('interview')): ?>
記事にinterviewタグが設定されてある場合表示する内容
<?php else: ?>
記事にinterviewタグが設定されて無い場合表示する内容
<?php endif; ?>
固定ページ(page.php)で使うテンプレート
自動で付く<p>タグを解除(柔軟にデザインできる)
<?php the_post(); ?>
<?php remove_filter('the_content', 'wpautop');
the_content();
add_filter('the_content', 'wpautop'); ?>
404ページを作らないで、トップページへリダイレクトさせる方法
テーマの404.phpに下記を挿入するだけ。<?php
header( "location: " . home_url() );
?>
サイドバー(sidebar.php)でよく使うテンプレートタグ
エントリー一覧(最新の10件を表示)
<ul class="entry">
<?php wp_get_archives('type=postbypost&limit=10'); ?>
</ul>
月別の一覧(リスト表示)
<ul class="backnumber">
<?php wp_get_archives('type=monthly'); ?>
</ul>
月別の一覧(プルダウンメニュー表示)
<select name="archive-dropdown" onChange='document.location.href=this.options[this.selectedIndex].value;'>
<option value=""><?php echo attribute_escape(__('Select Month')); ?></option>
<?php wp_get_archives('type=monthly&format=option&show_post_count=1'); ?>
</select>
カテゴリ一覧を表示
<?php wp_list_categories('title_li='); ?>
カテゴリー名
<?php single_cat_title(); ?>
カテゴリページへリンク(1がカテゴリーID。アンカーリンクタグ付)
<ul class="t_qa">
<li><a href="<?php echo get_category_link(1); ?>#<?php the_ID(); ?>"><?php the_title(); ?></li>
</ul>
外部RSSを呼び出して表示
<?php
include_once(ABSPATH . WPINC . '/rss.php');
$rss = fetch_rss('https://example.com/feed/');
$maxitems = 4;
$items = array_slice($rss->items, 0, $maxitems);
?>
<ul class="blog">
<?php if (empty($items)) echo '<li>No items</li>';
else
foreach ( $items as $item ) : ?>
<li><?php echo $up = date('Y年m月d日',strtotime($item[pubdate])); ?><br /><a href='<?php echo $item['link']; ?>'
title='<?php echo $item['title']; ?>'><?php echo $item['title']; ?>
</a></li>
<?php endforeach; ?>
</ul>
タグ一覧
<?php echo get_the_tag_list(); ?>
ウィジェットを利用する為の設定
1、functions.phpへ下記を挿入。if ( function_exists('register_sidebar') )
register_sidebar();
<?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar() ) : ?>
<?php endif; ?>
カスタムフィールド系
フィールド名”add”と設定した投稿情報(文字や数値)を表示(無記入の場合は非表示)
<?php if(post_custom('add')): ?>
<div class="(任意CSSタグ"><?php echo post_custom('add'); ?></div>
<?php endif; ?>
カスタムフィールドテキストボックス内の改行処理(フィールド名:txt)
<?php echo nl2br(post_custom('txt')); ?>
本文入力フォームが不要なら消そう!
「投稿記事の入力フォームはカスタムフィールドだけで十分!」 って方は、本文フォームが邪魔になるので消しちゃいましょう! 下記をfunctions.phpに追記して下さい。// 投稿ページの本文フォーム非表示
add_action( 'init' , 'my_remove_post_editor_support' );
function my_remove_post_editor_support() {
remove_post_type_support( 'post', 'editor' );
}
// 固定ページの本文フォーム非表示
add_action( 'init' , 'my_remove_post_editor_support' );
function my_remove_post_editor_support() {
remove_post_type_support( 'page', 'editor' );
}
functions.phpに追記しておきたいテンプレートタグ
<head>内のWordPressのバージョンを消す
remove_action('wp_head','wp_generator');
<head>内の絵文字のスクリプトを消す
remove_action('wp_head', 'print_emoji_detection_script', 7);
remove_action('admin_print_scripts', 'print_emoji_detection_script');
remove_action('wp_print_styles', 'print_emoji_styles' );
remove_action('admin_print_styles', 'print_emoji_styles');
アイキャッチの利用設定
add_theme_support( 'post-thumbnails' );
<?php the_post_thumbnail("thumbnail"); ?> // サムネイル画像を表示
<?php the_post_thumbnail("medium"); ?> // 中サイズ画像を表示
<?php the_post_thumbnail("large"); ?> // 大サイズ画像を表示
<?php the_post_thumbnail(array(100, 50)); ?> // 横・縦指定(数値は任意で変更可)
<?php the_post_thumbnail("post-thumbnail"); ?> // アイキャッチ画像を表示
<?php the_post_thumbnail(); ?> // アイキャッチ画像を表示(上と同じ)
カスタマイザーの利用設定
add_theme_support( 'custom-background' );
WordPressログイン時に、サイト確認上部に出ている管理バーの非表示
remove_action('wp_head','wp_generator');
add_filter( 'show_admin_bar', '__return_false' );
メディア挿入時の添付ファイルの表示設定の配置を「なし」にする
function media_script_buffer_start() {
ob_start();
}
add_action( 'post-upload-ui', 'media_script_buffer_start' );
function media_script_buffer_get() {
$scripts = ob_get_clean();
$scripts = preg_replace( '#<option value="post">.*?</option>#s', '', $scripts );
$scripts = preg_replace( '#<option value="custom">.*?</option>#s', '', $scripts );
$scripts = preg_replace( '#<option value="file" selected>.*?</option>#s', '', $scripts );
echo $scripts;
}
add_action( 'print_media_templates', 'media_script_buffer_get' );
予約投稿を解除
<?php function forced_publish_future_post( $data, $postarr ) {
if ( $data['post_status'] == 'future' && $postarr['post_status'] == 'publish' ) {
$data['post_status'] = 'publish';
}
return $data;
}
add_filter( 'wp_insert_post_data', 'forced_publish_future_post', 10, 2 ); ?>
カスタムメニューの設置
1、functions.phpに下記を挿入し、<?php register_nav_menus(array(
'gnav' => 'グローバルナビ',
'sidenav' => 'サイドナビ',
'footernav' => 'フッターナビ'
)); ?>
// グローバルナビ
<?php wp_nav_menu(array('theme_location' => 'gnav','container' => false,'menu_id' => 'gnav')); ?>
// サイドナビ
<?php wp_nav_menu(array('theme_location' => 'sidenav','container' => false,'menu_id' => 'sidenav')); ?>
// フッターナビ
<?php wp_nav_menu(array('theme_location' => 'footernav','container' => false,'menu_id' => 'fnav')); ?>
カスタムヘッダー(ロゴ)の設置
1、functions.phpに下記を挿入し、<?php $custom_header_params = array(
'default-image' => get_bloginfo('template_url').'/img/logo-img.jpg',
'width' => 240,
'height' => 60,
'header-text' => false,
);
add_theme_support( 'custom-header', $custom_header_params ); ?>
<?php <img src="<?php header_image(); ?>" height="<?php echo get_custom_header()->height; ?>" width="<?php echo get_custom_header()->width; ?>" alt="<?php bloginfo('name'); ?>" />
?>
カスタム背景の設置
1、functions.phpに下記を挿入し、<?php $custom_background_defaults = array(
'default-color' => 'ffffff',
'default-image' => get_bloginfo('template_url') . '/img/back01.jpg',
);
add_theme_support( 'custom-background', $custom_background_defaults ); ?>
<body <?php body_class(); ?>>
コメント欄の「次のHTMLタグが使えます〜」を消す
<?php
add_filter("comment_form_defaults","my_special_comment_after");
function my_special_comment_after($args){
$args['comment_notes_after'] = '';
return $args;
}
?>
メディア挿入の際、captionを勝手に入れない設定
<?php
define('CAPTIONS_OFF', true);
add_filter('disable_captions',
create_function('','return true;'));
?>
https://webmobile.jp/
https://wifimobile.jp/
私自身どんどん実績を積み上げ、このページに実践で得たテンプレートタグを追記していければと思います!!