カエレバをCSSの知識無しでカスタマイズ可能にしたサービス「SimpleLinks」を開発したので、このサービスの使い方を解説していこうと思います。
また、SimpleLinksについて紹介した記事もありますので気になる人はぜひ。
カエレバの代わりになるCSS不要の最強ツールを開発しました【SimpleLinks】 | 16channel
こんにちは。ふくたにたかとです。先日、ブロガー向けの「SimpkeLinks」というサービスを開発したので、その紹介をします。 ⇒SimpleLinks カエレバの代わりになるCSS不要の最強ツールを開発しました 上の動画を見てもらうとだいたいのやれることが分かると思いますが、今回開発した「SimpleLinks」はCSS不要でカスタマイズ可能な、カエレバの強化版のようなものです。 ちなみにこの動
SimpleLinksへ移動
まずこちらからSimpleLinksを開いてください。
最初にアクセスすると、このような画面になります。この時点ではアフィリエイトリンクを生成するための情報を登録できていないので、まずは右下の「設定をする」ボタンをクリックしてください
移動先はこちらになります。
設定画面に移動できたら、左側の各種項目を記入していきます。
記入方法は、実際の画面にも書いてありますが、こちらでも説明していきます。
フォームの記入方法
運営サイト名
こちらは、いまこれを見てくださってる方が運営しているブログ名です。必須項目ではないので記入しなくても大丈夫です
AmazonアソシエイトID
アフィリエイトリンクを作るためにAmazonアソシエイトIDが必要になります。
１．Amazonアソシエイトに登録する
AmazonアソシエイトIDを得るために、まずはAmazonアソシエイトに登録します。Amazonアソシエイトのサイトはこちら
２．IDを確認
登録が済むと、アソシエイトのホーム画面に進めるので、その画面の右上に
ブログ名-〇〇
という番号があるので、それをフォームに入力してください
楽天アフィリエイトID
こちらも必須になってくる楽天アフィリエイトIDです。
１．楽天アフィリエイトに登録
まずこちらより、楽天アフィリエイトプログラムに参加します。
２．楽天アフィリエイトIDを確認
次に、こちらから楽天アフィリエイトIDを確認します。楽天アフィリエイトIDは上の画像のモザイクになっているところに記載されています。
ヤフーショッピング（sid, pid）
最後にヤフーショッピングの登録ですが、こちらは必須ではありませんので飛ばしてもらっても構いません。ちなみに、ヤフーショッピングとペイペイモールは一緒と考えてもらって大丈夫です。
ただ、最近はPayPayの普及や、Softbankとの提携でヤフーショッピングやペイペイモールを使う人が増えているので、登録をおすすめします。
以下、ヤフーショッピングの入力方法を解説します。
１．バリューコマースに登録
ヤフーショッピングはAmazonや楽天のように独自でアフィリエイトプログラムを展開していないので、まず最初にバリューコマースに登録します。
２．ヤフーショッピングで広告作成
無事に登録ができましたら、サイト内検索などでヤフーショッピングを探し、「MyLink」よりsid=以下の数字と、pid=以下の数字をコピペします。
最後に「確定」を押す
これら全ての記入が終わりましたら、「確定」を押します。確定を押すことによって、値が保存されますので、次回からは登録は必要ありません。また、内容を変えたい場合も再度登録し直すことで上書きされます。
商品を検索する
「確定」を押すと最初の画面に戻るので、検索窓よりリンクにしたい商品を検索します。
ここで一つ注意点として、なるべく詳しくキーワード入力してください。例えば「お茶」であれば、「伊藤園 おーいお茶 濃い茶」のようにメーカー名、商品名、補足のように検索することでアマゾンやヤフーショッピングのリンクの制度が上がります。
一覧から選択
検索すると、楽天の検索結果が出てくるので、これにしたい！と思った商品の「リンクを作成」を押してください
HTML、CSSをブログにコピペ
「リンクを作成」を押すことでコピペ用のHTML、CSSが生成されます。この２つをブログにコピペすることで画像のリンクが作れます
CSSは最初に使うときのみブログのCSSを記入するところにコピペしてください。WordPressの場合は画面上のステータスバーの「カスタマイズ」から「追加CSS」に入り、そこにコピペすることで使えるようになります。ちなみに子テーマがある場合にはそちらにコピペすることをおすすめします。
ちなみに、このコードをコピペしたものがこちらです。
ここまでで、基本的な機能は使えるようになりました。デサインも最低限ととのっているので、このままでいいよっていう人はここで終わりです。
ただ、「もう少し全体を柔らかくしたい」や、「色をブログの雰囲気に合わせたいなど」もう少し自分用にカスタマイズしたい人は次にすすんでください。
SimpleLinksのカスタマイズ機能を紹介
SimpleLinksの真骨頂は、ここから紹介するカスタマイズ機能で、CSSが使えない人でも簡単にカスタマイズができるように作ってあります。
できること一覧
まず編集でできることを下記にまとめました。
- 補足説明を追加する
- AmazonのURLを個別で設定する
- ヤフーショッピングのURLを個別で設定する
- PayPayモールのURLを個別で設定する
- 文字、色の変更
- トップのテキストを編集
- Amazon、ヤフー、ペイペイの検索ワードを設定
- 新しいリンクの追加
カスタマイズ機能を解説
補足説明を追加する
こちらでは、リンクの題名の下にある、「Apple」というところを編集できます。
メーカー名だったり、補足説明などを入れられます。最初の状態だと書かれてません。
AmazonのURLを個別で設定する
アマゾンのボタンの部分を別のアフィリエイトリンクにしたい場合はここでリンク先を変えられます。他にも、初期状態だと、アマゾンの検索結果の画面に飛ぶので、直接商品画面に飛ばせたい場合などにも使えます。
ヤフーショッピングのURLを個別で設定する
ヤフーのボタンの部分を別のアフィリエイトリンクにしたい場合はここでリンク先を変えられます。他にも、初期状態だと、ヤフーの検索結果の画面に飛ぶので、直接商品画面に飛ばせたい場合などにも使えます。
PayPayモールのURLを個別で設定する
ペイペイモールのボタンの部分を別のアフィリエイトリンクにしたい場合はここでリンク先を変えられます。他にも、初期状態だと、ヤフーの検索結果の画面に飛ぶので、直接商品画面に飛ばせたい場合などにも使えます。
文字、色の変更
各ボタンの色、文字を変えられます。
トップのテキストを編集
商品名やメーカー名など、商品の情報が書かれている部分の文章を編集できます。商品名のテキストは楽天の検索結果から取ってきていることもあり雑多になりがちなので、よりシンプルにしたい人はここで編集できます。
Amazon、ヤフー、ペイペイの検索ワードを設定
上の画像を見るか、アマゾンやヤフー（ペイペイはヤフーと一緒）のボタンをクリックしていただけるとわかりますが、リンクの先は商品検索をした結果の画面になります。
最初に商品を検索したときのキーワードがこちらに反映されるので、場合によっては売りたい商品にユーザがたどり着けない場合もあります。
それを防ぐために、この欄ではこの検索ワードをより詳しく設定できます。
新しいリンクの追加
この機能では、テキスト・ボタンの色・リンク全てをカスタマイズして新しいボタンを追加することができます。
売りたい商品がいつのアマゾンや楽天、ヤフーショッピングにあるとは限らないのでマイナーな商品を売るときに役立ちます。
コメント
コメント一覧 （1件）
[…] SimpleLinksの使い方完全解説 […]