小説家になろうの作品ページの Twitterカードを作る方法

概要

固定されたツイート

小説家になろうの自分の作品を Twitter で宣伝したいのですが、宣伝するなら目立つのがよいわけで、それならってことで画像を添付しようかってなります。でもここは1歩進んで Twitterカードを表示しようと考えたわけです。

Twitterカードから飛ばしたい先は小説家になろうの自分の作品ページで、 Twitterカードの記述を設置する場所は自分のホームページとかになりますから、ちょっとややこしくて、自分のホームページにリダイレクトの JavaScript を記述します。 .htaccess は上手くいかないので。

Twitterカードとリダイレクト

下のような記述になります。 <body> タグとかないですが、下のが全てです。

<!doctype html>
<html lang="ja">
<head>
<meta charset="utf-8">
<meta name="twitter:title" content="タイトル">
<meta name="twitter:description" content="説明文( 68 文字まで)">
<meta name="twitter:image" content="画像の URL">
<meta name="twitter:card" content="カードの種類「 summary_large_image 」 「 summary_small_image 」">
<meta name="twitter:site" content="Twitter のユーザ名">
<script>
window.location.href = "飛ばしたいページの URL";
</script>
</head>
</html>

例えば僕は下のようにして Twitterカードを表示しています。

<!doctype html>
<html lang="ja">
<head>
<meta charset="utf-8">
<meta name="twitter:title" content="⚔イオの冒険?">
<meta name="twitter:description" content="?世界を見る旅へ出た青年は同じ目的を持つ2人の少女に出会い共に歩み始める。世界をめぐる中で彼らを待っているのは様々な初めての体験だった。">
<meta name="twitter:image" content="http://yayoi-thyme.com/image/default-site-image.png">
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:site" content="@camellia">
<script>
window.location.href = "https://ncode.syosetu.com/novelview/infotop/ncode/n0041ed/";
</script>
</head>
</html>

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です