WordPress 投稿ページへのリンク

  Code Tips minimum Theme

投稿タイトルに投稿ページへのリンクを付けてみます。

 

よく使われる2つの方法をそれぞれ書いてみます。

 

シンプルに投稿ページへのURLを表示します。
ループの中でのみ利用できます。

ループ の中で処理されている投稿の パーマリンク の URL を表示します。このタグは ループ 内で使用されなければならず、一般的に各投稿のパーマリンクを表示するときに利用します。このテンプレートタグは処理されている投稿のパーマリンクを表示するだけです。

WordPress Codex : テンプレートタグ/the permalink

 

タイトルにその投稿ページへのリンクを付けてみます。
テンプレートタグ the_title()<a> タグで囲い、URL部分を the_permalink() で出力します。

<a href="<?php the_permalink(); ?>"><?php the_title(); ?></a>

 

出力結果は

<a href="投稿ページへのパーマリンク">タイトル</a>

となります。

 

URLのみを出力する場合

<p>投稿ページへのURL : <?php the_permalink(); ?></p>

 

キャッチ画像に投稿ページへのリンクを付けた場合

<a href="<?php the_permalink(); ?>"><?php the_post_thumbnail(); ?></a>

 

the_title() などの関数の引数にURLを渡して使用する場合 get_permalink() を使います。
ループの外でも使うことができます。
「投稿ID」を引数に渡してその投稿ページへのURLを取得することができます。
URLを出力する場合は、echo を使って出力する必要があります。

PHP で使えるように、投稿または固定ページの パーマリンク を取得します。このタグはパーマリンクを出力しません。ループ の外で使うことができます。失敗した場合は false を返します。
注意: パラメータの ID を指定せずに一覧ページ(インデックスやアーカイブなど)のループの外側で使用した場合、現在の表示しているページのパーマリンクではなく、ループの一番最後の投稿の URL を返します。

テンプレートタグ/get permalink

get_permalink( $id, $leavename )

 

パラメータ
引数 説明
$id
複合
オプション
投稿または固定ページの整数型の ID、あるいは投稿オブジェクト
初期値: ループ内で使用した場合、表示中の投稿の ID。
$leavename
真偽値
オプション
投稿名あるいは固定ページ名(%postname%)を保持するかどうか。trueの場合、実際の URI ではなく構造的なリンクを返します。
例: http://www.example.com/my-post ではなく http://www.example.com/%postname%
初期値: false

 

タイトルにその投稿ページへのリンクを付けてみます。
テンプレートタグ the_title() の引数に get_permalink() を使って出力してみます。
タイトルを <a> タグで囲い、URL部分を get_permalink() で渡します。

<?php the_title( '<a href="' . get_permalink() . '">', '</a>' ); ?>

 

出力結果は

<a href="投稿ページへのパーマリンク">タイトル</a>

となり、the_permalink() を使った <a href="<?php the_permalink(); ?>"><?php the_title(); ?></a> と同じ結果になります。

 

実際に使用する場合は、エラーを防ぐため get_permalink() を esc_url()  に渡してから the_title() に渡します。

<?php the_title( '<a href="' . esc_url( get_permalink() ) . '">', '</a>' ); ?>

 

esc_url()

テキストや属性などのURLを無害化して最適化します。

テキストや属性などのURLを無害化する時に用いる関数です。ホワイトリストに登録されているプロトコル (デフォルトでは、http, https, ftp, ftps, mailto, news, irc, gopher, nntp, feed, telnet) 以外のURLを拒絶し、無効なキャラクタを除外し、危険なキャラクタを削除します。 この関数はキャラクタをHTMLエンティティとしてエンコードし、 (X)HTML または XML ドキュメントを作成する時に用います。アンド記号 (&) とシングルクォート (‘) はそれぞれ (&#038, &#039) という形に変換します。

WordPress Codex : 関数リファレンス/esc url

 

 

Code Tips minimum Theme

【index.php】

<!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head>
  <meta charset="<?php bloginfo( 'charset' ); ?>">
  <title><?php wp_title('|', true, 'right'); ?><?php bloginfo('name'); ?></title>
  <?php wp_head(); ?>
</head>
<body>
  <h1><a href="<?php bloginfo('url'); ?>/"><?php bloginfo('name'); ?></a></h1>
  <?php if (have_posts()) : while (have_posts()) : the_post(); ?>
    <?php the_title( '<h2><a href="' . esc_url( get_permalink() ) . '">', '</a></h2>' ); ?>

  <?php endwhile; ?>
  <?php endif; ?>
</body>
</html>

※個別の投稿ページを表示するテンプレートファイル【single.php】をまだ用意していないので、リンクをクリックしても同じ【index.php】を表示します。
この時点では表示されるのはタイトルだけになります。