こんにちは！ ライターのナナミです。
みなさん、スラッグって聞いたことありますか？WordPressについて調べたりしていると、よく見かける単語ですよね。
スラッグって何に使われているんだろう…
という疑問をお持ちの方、今回の記事で全て解決しますよ！WordPressのスラッグとは何か、どのように使うのかを解説していきます。
この記事は下記の流れで進めていきますね。
- 【基礎】スラッグとは何か？
- 【基礎】どのように使われているのか
- 【基礎】スラッグの設定方法
- 【発展】スラッグの活用方法
スラッグはWordPressを使う上での必須知識です。ばっちり覚えて、使いこなせるようになっちゃいましょう。
スラッグとは？
スラッグは、記事やカテゴリなどに付与される名前の1つです。
WordPressでは、投稿されている内容に下記の3つの名前をつけて管理しています。
- タイトル
- ID
- スラッグ
このうちスラッグは、英語名と訳されます。つまり、記事などにつける英語の名前、いわばファイル名のようなものなのです。
スラッグはどのように使われる？
スラッグは、WordPressの色々な処理に使用されています。その中でも代表的な2つを紹介していきましょう。
URLの一部になる
記事や固定ページ、カテゴリ一覧などのURLの末尾にはスラッグが使われています。
例えば固定ページで下記のようなURLにしたかったとしましょう。
この場合、該当ページにaboutというスラッグをつけることにより、期待通りのURLにすることができます。
ページや記事を指定することができる
WordPressのコードを書いている時、IDなどでページや記事を明示的に指定することがありますよね。
例えば下記のように書くと、1というIDの記事のタイトルを表示することができます。
PHP
<?php echo get_the_title(1); ?>
実行結果
http://test-wp.test/test/
この時、IDではなくスラッグでも指定することが可能なのです。
PHP
<?php
$post_id = get_posts("name=test");
$post_id = $post_id[0]->ID;
echo get_the_title($post_id);
?>
実行結果
http://test-wp.test/test/
スラッグの設定方法
スラッグの指定方法は、大きく分けて2つあります。どちらも簡単なので、サクッと確認していきましょう。
スラッグは必ず英数字で！
方法を確認する前に、大事なことをお伝えしておきます。
スラッグで使えるのは英数字、そしてハイフンだけです。
先ほど解説した通り、スラッグはURLやコード内の処理に使われています。日本語やいろんな記号が入っていると、文字化けが起きたりエラーが起きたりしてしまうのです。
忘れないようにしましょう。
記事・固定ページの場合
記事や固定ページの場合、タイトルの下に下記の画像のような設定項目が出てきます。
ここを編集することで、スラッグを設定することができます。そう、パーマリンクの設定と全く同じです。
という方は、下記の記事も併せて読んでみてくださいね。
カテゴリ・タグの場合
カテゴリやタグにもスラッグを設定することができます。
サイドバーから投稿の中にあるカテゴリを選んで、カテゴリ設定を開きましょう。
新規項目のところに、スラッグの欄がありますね。新規作成する場合は、ここに入力すればOKです。
元々あるカテゴリのスラッグを変更する場合は、右側にあるカテゴリのリストから変更したいカテゴリを選んで編集画面を出しましょう。
同じように、スラッグの欄に入力して保存すればOKです。
スラッグ活用方法
せっかくスラッグをしっかり設定したならば、活用しない手はないですね。
スラッグが活躍してくれる場面をいくつか紹介していきます。参考にしてみてくださいね。
スラッグを表示する
日本語のタイトルの横にスラッグを出してみると、ちょっとおしゃれな見出しになりますね。
single.phpなどに下記のようなコードを書くことで、いい感じに表示してくれます。
PHP
<h1> <?php the_title() ;?> </h1> <h2> <?php echo get_post_field( 'post_name', get_the_ID() ) ;?> </h2>
実行結果
<h1> テスト投稿 </h1> <h2> test </h2>
見栄えなどはCSSで調整してくださいね。
CSSの使い方がよくわからない！
という方は、下記の記事も読んでみてください。
スラッグごとに色を変える
カテゴリを表示するときに、アイコンを変えたり背景色を変えたりすると、パッと見でカテゴリの違いがわかって便利ですね。
そんな時は、スラッグをHTMLのclassにしちゃいましょう。
PHP
<?php $cat = get_the_category(); $cat = $cat[0]; ?> <div class="<?php echo $cat->category_nicename; ?>"> <?php echo $cat->cat_name; ?> </div>
実行結果
<div class="category_test"> テストカテゴリー </div>
これでこのclassにCSSを指定すれば、カテゴリごとに背景色を変えたりできますね。
スラッグを使ってリンクを貼る
パーマリンクを取得するときはIDを使いますが、スラッグを使って取得することもできます。
PHP
<a href="<?php echo get_permalink( get_page_by_path( 'test' )->ID ); ?>">
実行結果
<a href="http://test-wp.test/test/">
こちらの方が、コードで見たときにどのページにリンクしているのかがわかりやすいですね。ただし、スラッグを変更した場合はコードも修正しなければならないので、注意が必要です。
まとめ
いかがでしたか？
スラッグがわかると、WordPressのカスタマイズが捗りますね！スラッグの活用方法は、今回紹介したものだけではありません。ぜひ色々試して、もっともっと活用しちゃってくださいね。
