【wordpress】記事のタイトルを指定したURLにリンクさせる方法【外部リンク】

こんにちは。記事のタイトルリンクを指定したURL(外部リンク等)にリンクさせる方法について書いていきます。

私のお気に入りのWebサイト紹介のコーナーを見ていただければわかると思うのですが、投稿記事のタイトルをクリックするとこのサイトとは別のサイトへと移動するよ〜ということです。

スクリーンショット-2016-04-21-18.08.32

 

もちろんサイト内部へのリンクでも(こちらの方が動線的に使い道あると思います)

 

functions.phpでカスタムフィールドの設定をする

まずはfunctions.phpに以下のコードを書きます

//リンク先URLを追加するカスタムフィールド作成
add_action('admin_menu', 'add_linkurl');
add_action('save_post', 'save_linkurl');

function add_linkurl(){
     if(function_exists('add_linkurl')){
     //通常の投稿画面でカスタムフィールドを表示する
          add_meta_box('linkurl1', 'リンク先URL', 'insert_linkurl', 'post', 'normal', 'high');
          //カスタム投稿で表示する場合は下記にカスタム投稿名を指定する
          add_meta_box('linkurl1', 'リンク先URL', 'insert_linkurl', 'カスタム投稿名', 'normal', 'high');
     }
}

function insert_linkurl(){
     global $post;
     wp_nonce_field(wp_create_nonce(__FILE__), 'my_nonce');
     echo '<label class="hidden" for="linkurl">リンク先URL</label><input type="text" name="linkurl" size="60" value="'.esc_html(get_post_meta($post->ID, 'linkurl', true)).'" />';
     echo '<p>リンクしたいURLを入力します。</p>';
}

function save_linkurl($post_id){
     $my_nonce = isset($_POST['my_nonce']) ? $_POST['my_nonce'] : null;
     if(!wp_verify_nonce($my_nonce, wp_create_nonce(__FILE__))) {
          return $post_id;
     }
     if(defined('DOING_AUTOSAVE') && DOING_AUTOSAVE) { return $post_id; }
     if(!current_user_can('edit_post', $post_id)) { return $post_id; }

     $data = $_POST['linkurl'];

     if(get_post_meta($post_id, 'linkurl') == ""){
          add_post_meta($post_id, 'linkurl', $data, true);
     }elseif($data != get_post_meta($post_id, 'linkurl', true)){
          update_post_meta($post_id, 'linkurl', $data);
     }elseif($data == ""){
          delete_post_meta($post_id, 'linkurl', get_post_meta($post_id, 'linkurl', true));
     }
}

 

カスタム投稿で使用する場合、例えばwebsiteという投稿タイプ名のカスタム投稿で使用する際には

add_meta_box('linkurl1', 'リンク先URL', 'insert_linkurl', 'website', 'normal', 'high');

と記述しましょう。

複数のカスタム投稿で使用することができます。必要な分だけ付け加えてください。

そうすると投稿画面にこのような欄が作成されます。

スクリーンショット-2016-04-21-18.29.37

 

必要なページでリンクが出力されるようにする

ここでタイトルに先ほど設定したリンクが出力されるようにします。

content.phpあたりに書いていきます(投稿記事を表示するループの中身が書いてあるところ)

<?php //リンク設定があれば外部へリンク
     $linknourl = get_post_meta( $post->ID, 'linkurl', true );
     if ( !empty( $linknourl ) ) : ?>
        <?php
	        //htmlを除去
		$linknourl = htmlspecialchars($linknourl,ENT_QUOTES,'UTF-8');
	?>
	<a href="<?php echo $linknourl; ?>">
     <?php else : ?>
	<a href="<?php the_permalink(); ?>" >
     <?php endif; ?>
     <?php the_title() ;?>
</a>

 

リンク設定があれば、外部リンクにつなぎ、なければそのまま単一記事のページを開くという風になっています。

これを使えばアイキャッチ画像には外部リンク、タイトルには単一記事へのリンクという風にもできます。アイキャッチ画像に限らず、外部へ〜みたいな風にしておいて両方表示できるようにしてても良いかなぁと思います。

 

単一記事がない場合(カラの場合)にはheader.phpに記述しておいたらよいコードもあるのですが、

そちらは参考にさせていただいた下記の記事の方へどうぞ!!

WordPressの「お知らせ一覧」のタイトルに外部リンクを貼る方法

 

カスタム投稿でカスタムフィールドが反映されていない時に確かめること

カスタム投稿でこのやり方を用いた時に、リンク先URLを書く欄がなかなか表示されなくて少し困ってしまいました。

まず確かめるのは

カスタムフィールドがサポートされているかどうか

     'supports' => array(//記事編集画面に表示する項目を配列で指定することができる
        'title',//タイトル
        'editor',//本文(の編集機能)
        'thumbnail',//アイキャッチ画像
        'custom-fields',
        'excerpt'//抜粋
      )

カスタム投稿を設定しているfunctions.phpの中のこの部分にcustom-fieldsが書いてあるか、または綴りが間違っていないかをチェックしましょう。

 

あとは、投稿画面の右上にある表示設定でカスタムフィールド(リンク先URL)にチェックがついているかどうかを確認してください。

スクリーンショット-2016-04-21-18.52.32

 

こちら両方が設定されているのに表示されない場合は、上記でfuncitons.phpに書いたadd_meta_boxの部分の記述が無い場合があるので確認してみてください。

 

2018/04/14追記
2年後の私「なにこのリンク欄なんのためにあるの?消したろ」


2年間この欄一回も使いませんでした。ナンテコッタ
コメントは認証制です。詳しくは下記の注意をお読みください。お気軽にコメントお願いします!

Write a Comment

コメント時の注意

「Twitter」「Facebook」「Google+」「WordPress」のいずれかのアカウントをお持ちの方は各アカウントと連携することでコメントできます。 コメントしたことはSNSに流れませんので、アカウントをお持ちの方はこちらの方法でコメントを投稿して下さると嬉しいです。 アカウントをお持ちでない方はメールアドレスで投稿することができます。 初回コメント時は承認後に表示されます。

Related Memo...

【WordPress】メディアライブラリ の画像IDを取得する

WordPressのメディアライブラリ にアップロードされた画像IDを取得する方法です。

例えば6件取得してギャラリーで表示するとき。

$ids = get_posts( 
    array(
        'post_type'      => 'attachment', 
        'post_mime_type' => 'image', 
        'post_status'    => 'inherit', 
        'posts_per_page' => 6,
        'fields'         => 'ids',
    ) 
);

$ids_str = '';
foreach ( $ids as $id ) {
    $ids_str .= $id . ',';
}

$ids_str = rtrim($ids_str, ',');

// ショートコードでギャラリーを表示
echo do_shortcode( '[gallery ids="' . $ids .'"]' );

意外と便利なのでは!

 

WordPress

WordPressで現在のカテゴリから親カテゴリ/祖先カテゴリのスラッグを取得

//現在のカテゴリを取得
$categories = get_the_category($post->ID);
$category_slugs = array();
foreach($categories as $category){
    $cat = $category;
    array_push($category_slugs,$cat->slug);
    //親のカテゴリがなくなるまで回す
    while ($cat->parent) {
        $cat_parent_id = $cat->parent;
        $cat = get_category($cat_parent_id);
        array_push($category_slugs,$cat->slug);
    }
}

わりと頑張ってPHP書いてる。

WordPress

【WordPress】プラグイン化したカスタム投稿をテーマ内で使うとき

通常テーマ内でカスタム投稿を表示させる時に

$args = array( "posts_per_page" => 5,
        "post_type" => 'news'
    );
$the_query = new WP_Query( $args );
if($posts):

と書けば表示されるのに、プラグイン化していたので表示されなかった話。

 

functions.phpでカスタム投稿を追加している場合は必要ないが、newsというカスタム投稿をプラグイン化していたので、以下の記述が必要でした。

    public function __construct() {
        add_action( 'pre_get_posts', array($this, 'add_my_post_types_to_query') );
    }

    // queryにnewsをセットする
    function add_my_post_types_to_query( $query ) {
        if ( is_home() && $query->is_main_query() )
            $query->set( 'post_type', array( 'post', 'page', 'news' ) );
        return $query;
    }

WordPressプラグインの作り方は、また後日ちゃんとした記事にしたいと思ってます。今回はとりあえず忘れそうなのでメモだけで失礼。

WordPress
more