indyx6画像編集せずアイキャッチ画像に文字を入れる方法|文字を入力するだけでOKツイートシェアはてブLINEPocket画像編集をする事なく、アイキャッチ画像に文字を入れる方法はないのかな。毎回、編集するのは面倒だから、文字を入力するだけで完成するようにはできないのかな。そんな疑問に答えていきます。今回は、photoshopなどの画像編集ソフトを使う事なく、文字を入力するだけでアイキャッチ画像に文字列を表示させる方法を実践していきます。ちなみに、このブログはアイキャッチに文字を入れていませんが、面白そうなのでやってみます。完成品は以下の通りです。完成品は至って普通のアイキャッチ画像ですが、手軽さが違います。WordPressの記事投稿画面で、以下のように文字を入力するだけで、上の画像のように表示されます。タクWordPressを対象としています※この記事は3分程度で読めます。Template」をインストールSTEP3.カスタムフィールドテンプレートを用意STEP4.テスト記事を作成STEP5.カスタムフィールドのデータを表示するSTEP6.デザインや配置を整える画像編集ソフト不要!アイキャッチ画像に文字を入れる方法アイキャッチ画像に文字を入れる方法を解説していきます。大きく分けて、6つのSTEPがあるので、ざっくりと確認しておいてください。Template」をインストールSTEP3.カスタムフィールドテンプレートを用意STEP4.テスト記事を作成STEP5.カスタムフィールドのデータを表示するSTEP6.デザインや配置を整えるSTEP1.カスタムフィールドの準備カスタムフィールドとは投稿や固定ページに任意の情報を保存できる機能のことですが、イメージが湧かないと思うので分からなくてもOKです。タクとりあえず、読み進めてください。「いやいや、ちゃんと理解したい」って方はこちらが参考になります。Template」をインストールしていきます。Template」と入力して、インストール&有効化します。STEP3.カスタムフィールドテンプレートを用意プラグインのインストールが終わると、画面左のメニュー「設定」に「カスタムフィールドテンプレート」という項目が追加されるので、クリックして設定を開きます。テンプレートタイトルとテンプレートコンテンツを画像の通りに編集します。35編集できたら「オプションを更新する」をクリックします。移動して、いつも通り記事を作成しますが、全ての設定が終わっているわけではないので、テスト記事を一つ作ります。タイトル、本文、アイキャッチ画像を設定して、公開状態を「非公開」にして、更新してください。上の画像のように、タイトル横に「非公開」と表示され、ログインしている自分にだけテスト記事が表示されます。テスト記事の編集画面に戻ります。画面右上の「表示オプション」をクリックして、「カスタムフィールドテンプレート」にチェックを入れます。入っている場合は何もしなくてOKです。投稿画面の下部に「カスタムフィールドテンプレート」という項目が追加されているので、任意の文字列を入力して、保存してください。これで記事の作成ができました。STEP5.カスタムフィールドのデータを表示するいよいよ、カスタムフィールドテンプレートに保存したデータを表示させますが、テーマを編集していくので、必ずバックアップしてから作業してください。アイキャッチ画像の下にカスタムフィールドの値を出力します。?></span>上記コードをコピーして、任意の箇所に貼り付けます。?></span><!--ここまで--></figure>僕はWordPressテーマ「STORK」を使っているので、別のテーマをご利用の方は、テーマに応じて配置箇所を変えてください。アイキャッチ画像の下に、カスタムフィールドの値が出力されました。STEP6.デザインや配置を整えるいくつか参考になるものを検索して見たんですが、その中でも、キックさんのブログが「見やすくていいな」と思ったので、参考にさせてもらいます。以下のような感じですね。これをCSSで再現するとなると、問題になるのが縁取りです。ここまで綺麗に縁取りはできませんが、これに近いものに仕上げる事は可能です。top;}text-shadowを使って縁取りしてみました。細めの縁取りですが、これ以上太くすると汚くなってしまうので、これが限界です。タク何かいい方法があったら教えてください。完成品はこんな感じになりました。毎回、同じパターンではつまらないので、数パターン用意しておくといいかもしれませんね。)に表示可能ですが、SNSにシェアされた画像には表示されないので注意が必要です。いうわけで、今回は以上となりますが、カスタムフィールドを使えばWordPressの可能性がかなり広がります。その例として、アイキャッチ画像に文字を表示させてみました。分からないところがあったら、Twitter(@takuhx)で相談してもらえれば、相談に乗りますよ。「WordPressをもっと勉強したい」という方は以下の記事を参考にしてみてください。初心者にとって必要なアフィリエイトのテクニックを包み隠さず紹介しており、アフィリエイトの教科書代わりになるよう、できるだけ分かりやすくまとめています。記事を読むテックアカデミーの評判が悪い理由をお話します|コース・料金・期間などの感想と口コミTechAcademy(テックアカデミー)の受講期間は短い方がいいワケ|おすすめプランを紹介RECOMMENDこちらの記事も人気です。BLOG2018.10.1ブログのコメント欄に必要性を感じない理由|わざわざ誹謗・中傷の場を提供す...BLOG2018.11.14WordPress(ワードプレス)のメリット・デメリット!アフィリエイト...BLOG2018.11.24パーマリンクにカテゴリ名を入れて失敗!カテゴリを階層化&消す時に困るので...BLOG2018.11.9【2019年】ブログの魅力とは?【今、ブログ界が賑わっている】BLOG2018.11.15ワードプレス・はてなブログの違い!アフィリエイトするならどっちがおすすめ?BLOG2018.11.12独自ドメインのメリット・デメリット!おすすめのドメインサービスは?BLOG2018.11.20はてなブログの始め方を超丁寧に解説|初心者でも10分後にはブロガーになれ...BLOG2018.11.11はてなブログのメリットとデメリット!アフィリエイトにおすすめな理由プロフィールタクフリーランスのWEBマーケターとして稼ぎつつ、ブログ運営などをやっています。学生時代から様々なWEBサイトを運営してきました。現在は当ブログ(TAKUNOTE-タクノート-)含め、4サイトを運営中。ブログを始める方に役立つような運営ノウハウや僕が経験した事を書いています。関連キーワード取得ツールまとめ|ブログネタ難民はサジェストからアイディアを探せテックアカデミーの評判が悪い理由をお話します|コース・料金・期間などの感想と口コミアフィリエイトの初期費用を予算別に紹介|何にお金を使うべきかを教えますおすすめレンタルサーバーおすすめASPProfileブログで6万円しか稼げないのに仕事を辞めて、ブロガーに転職した20代の男です。(現在はちゃんと稼いでいます。)学生時代から様々なWEBサイトを運営してきました。現在は当ブログ(TAKUNOTE-タクノート-)含め、4サイトを運営中。ブログを始める方に役立つような運営ノウハウや僕が経験した事を書いています。