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

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

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

 

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

 

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');

と記述しましょう。

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

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

 

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

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

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に記述しておいたらよいコードもあるのですが、

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

http://enjiout.com/newslink/

 

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

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

まず確かめるのは

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

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

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

 

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

 

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

 

参考リンク

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