ブログのこと

【超初心者向け】エディタGutenbergでのアフィリエイトリンク貼り付け方法【JIN】

アフィリエイトリンクアイキャッチ

今回は、

エディタ「Gutenberg」でアフィリエイトリンクをブログに貼り付ける方法が知りたい!

という超初心者さん向けの記事です。私も初心者なんですけどね。

最近は調べながら編集できるようになりましたが、新しくつまずいたことがありました。

アフィリエイトリンクを貼りたいけど、一体どこに貼ればいいの!?

これです。

先輩方にとっては当たり前のことなのかもしれないけど、私たち(笑)初心者にとっては難しすぎます。

調べるも、当たり前すぎることだからか答えが出ず、試行錯誤して触ってみたらできました。

今日は迷える初心者さんへ、私なりの解決法を投稿しておきます。

エディタ【 Gutenberg】 について

悩む子供

ブログを開始して『JIN』というテーマを購入したのですが、購入した時にはすでに新エディタ【Gutenberg(グーテンベルク)】仕様でした。

wordpressでの記事の投稿方法も分からず調べるも、エディタが変わったなんてことも知らないので自分の見ている投稿画面と違う記事しか出てこないんです。

word感覚で打ち込めるって書いてあるけど、うそやろ!??(:_;)

段落?ブロックって何?!吹き出しどこ?(´;ω;`)となったものです。

そもそもエディタとは?

この記事を読んでくださっている方は、私と同じでここから分からないのでは?(失礼)

エディタとは簡単にいうと、

編集を行うソフトウェア

だそうで、windowsのメモ帳ソフトも、エディタです。

編集ソフトウェア【 Gutenberg 】 って?

wordpressの新しいテキストエディタです。

旧エディタで慣れている方には使いにくかったりするみたいですね。

「ブロック」を組み合わせることで、初心者でも簡単に記事作成ができるように改良されています。

確かに、使いだすと直感的に操作出来て適当に触ってればできた。ということが結構あります。

ただ、【 Gutenberg 】 に未対応の機能があるので、その時はクラシック機能で対応します。

私がクラシックで使う機能
  • 文章の一部だけ文字色を変える
  • 文章の一部だけ文字の大きさを変える
  • 表を作る

文字色や文字の大きさは、プラグインを利用する方法もあるみたいです。

私はプラグインを増やすのが嫌だったのでクラシックモードで変更してます。

表はクラシックの方が見やすいのでクラシックを使ってます。

クラシックモードへの切り替え

一応、ブロックをクラシックモードへ切り替え方法です。

①まず投稿画面の⊕を、どちらでもいいのでクリック

ブロックを追加

②フォーマットを選択

フォーマットを選択

③クラシックを選択

クラシックを選択

④できました!wordみたいな画面です。

クラシックモード

アフィリエイトリンクの作り方

私の状況です。

  • Google AdSence→未登録
  • Amazonアソシエイツ→未登録
  • もしもアフィリエイト→登録済

もしもでは楽天・Yahooと提携してます。

Amazonは記事数2で申請したので否承認になっちゃいました。笑

今回はもしもアフィリエイトのかんたんリンクを貼りつけたいと思います。

もしもアフィリエイトの無料会員登録が未済の方は、登録しておきましょう。

登録・利用はもちろん無料です!

もしもアフィリエイトに無料登録

もしもアフィリエイト「かんたんリンク」の作成方法

もしもアフィリエイトの「かんたんリンク」で作成します。

①もしもアフィリエイトのトップページから「かんたんリンク」をクリックします。

2か所ありますがどちらでもOKです。

もしもかんたんリンク作成1

②こんな画面になりました。まだAmazon・楽天・Yahooと提携が未済の方は設定ボタンを押して

もしもかんたんリンク作成2

③ここから提携申請もできます。

もしもかんたんリンク作成3

④商品検索をします。今回はぬいぐるみにしてみました。

もしもかんたんリンク作成4

⑤商品の中から、紹介したい商品を選びクリック。

もしもかんたんリンク作成5

⑥プレビューで確認して問題なければ、HTMLソースをコピーします。

コード下の注意書きについては、こちらを参考にしました。

もしもかんたんリンク作成6

アフィリエイトリンクの貼り方

さて、本題です。

リンクを作成したので、貼りつけます。

①「フォーマット」→「カスタムHTML」を選択します。

カスタムHTML

②赤い部分に先ほどコピーしたソースコードを貼りつけて、プレビューをクリック。

HTML入力画面

③このように出たらOKです!

プレビュー画面

まとめ

どうでしょう、簡単にできました!

誰か一人でもお役に立てれば幸いです!

共に助け合い、頑張りましょう!

ぽちっと応援お願いします!
ブログランキング・にほんブログ村へ