ブルーシュ

IT技術の勉強記録

ホーム > Tips > WordPress

記事IDからリンクを作成するショートコード

投稿記事内でリンクを作成するショートコードを作りました。

 
function.phpにコピペで使用できるようにしました。

//投稿記事内でリンクを作成するショートコード
function article_refer_func($atts){

	//記事IDが指定されたら内部リンク作成
	if($atts['post_id']){
		$link = get_the_permalink($atts['post_id']);

	//外部ページに飛ばしたいならurlを指定すること
	} else{
		$link = $atts['url'];
	}

	//記事IDあり・リンクテキストなしの場合は記事タイトルを取得
	if($atts['post_id'] && !$atts['label']){
		$label = get_the_title($atts['post_id']);

	//それ以外ならリンクテキストを指定すること
	} else{
		$label = $atts['label'];
	}

	//cssクラス
	$class = "";
	if($atts['class']){
		$class = "class='{$atts['class']}'";
	}

	//マウスオーバー時のチップ
	$title = "";

	//記事IDあり・リンクテキストありの場合は記事タイトルをチップにする
	if($atts['post_id'] && $atts['label']){
		$title = "title='" . get_the_title($atts['post_id']) . "'";

	//その他・チップの設定ありの場合
	} elseif($atts["title"]){
		$title = "title='{$atts["title"]}'";
	}

	return "<a href='{$link}' {$class} {$title} target='_blank' rel='noopener'>{$label}</a>";
}
add_shortcode( 'refer', 'article_refer_func' );

 

このショートコードのパラメータ

post_id 記事ID。URLを自動で取得する。
url URL。post_idが無いなら必須。
label リンクテキスト。post_idが無いなら必須。post_idがあれば記事タイトルが自動でリンクテキストになる。
class cssセレクタ。
title マウスオーバー時のツールチップになる。post_idがあれば記事タイトルが自動でツールチップになる。

問答無用でtarget="_blank"rel="noopener"が付きます。
 

使用例

同サイトの他の記事へのリンク(内部リンク)①

入力:[refer post_id="1234"]
出力:<a href="記事URL" target="_blank" rel="noopener">記事タイトル</a>
 

同サイトの他の記事へのリンク(内部リンク)②

入力:[refer post_id="1234" label="昨日の記事"]
出力:<a href="記事URL" title="記事タイトル" target="_blank" rel="noopener">昨日の記事</a>
 

外部サイトへのリンク①

入力:[refer url="https://exmple.com/p=123" label="詳しくはこちら" title="光り輝く!黄金のラーメンスープ"]
出力:<a href="https://exmple.com/p=123" title="光り輝く!黄金のラーメンスープ" target="_blank" rel="noopener">詳しくはこちら</a>
 

外部サイトへのリンク②

入力:[refer url="https://exmple.com/p=123" label="光り輝く!黄金のラーメンスープ"]
出力:<a href="https://exmple.com/p=123" target="_blank" rel="noopener">光り輝く!黄金のラーメンスープ</a>
 
 
作ったばかりなのでまた改変すると思います😀

記事IDからリンクを作成するショートコード #WordPress #ウェブデザイン #ウェブ制作 #WEBデザイン #WEB制作 #ショートコード

作者の似顔絵

プログラミング歴19年🌈調べたことをブログにまとめていきます。
記事の感想・質問・間違い指摘などはツイッター ( @blooshcompany ) へお願いします。

秋田のウェブ活用をサポート

ホームページを自作してコスト削減!秋田の事業者は無料で利用できます。
ネットショップ・WordPress・SEO対策などさまざまなお悩みをサポートします。

その他、フロントエンド案件のご依頼はインフォメーション

秋田市 レンタル着物 笹パンダ堂のバナーリンク