3
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

WordPressでVK Link Target Controllerプラグインを使うときに注意すること

Posted at

WordPressでは記事ページや固定ページを作成できますが、一覧のなかにpdfとかへのリンクを入れるということが難しいです。
例えば「会社概要」というカテゴリーに「社長あいさつ」「理念」などはページを作成してそこに並列で「パンフレット」を追加してpdfへのリンクにしたい。とか。

そこで登場するのが VK Link Target Controller なんですが、このプラグインを使うときに注意しないといけないことが1つ。

the_permalink() をしている aタグの親タグに post-[ID] というid属性が必要

なんです。
そうしないと、管理画面で「別ウィンドウで開く」を設定していても リンクが同じウィンドウでしか開かない ということになります。
詳しくはプラグインページのFAQ「My link won’t open on a new window.」の項目を参照してください。

なんで?

the_permalink() のURLの書き換えはプラグインでできるのですが、別のウィンドウで開くためにtarget属性を設定するのは別途jsで行っているようです。
そのときに、target属性を設定するaタグを判別するために親タグのid属性に post-[ID] を持つものを指定していました。

サンプルコード

sample.php
<?php while (have_posts()): the_post(); ?>
<div class="entry">
<a href="<?php the_permalink(); ?>"><?php the_title(); ?></a>
<span><?php the_excerpt(); ?></span>
</div>
<?php endwhile; ?>

というような場合、 <div class="entry"> のところに id属性 を次のように設定します。

<div class="entry" id="post-<?php the_ID(); ?>">

WordPressに標準添付されているテーマ twentyfifteen, twentysixteen, twentyseventeen などは articleタグに同じようにid属性が設定されているのでそれを想定して VK Link Target Controller 側が実装しているようです。
オリジナルのテーマを作成する場合とかは頭の片隅に入れておく必要があります。

3
2
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
3
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?