φ(.. ) 備忘録
   
  
ラベル Blogger の投稿を表示しています。 すべての投稿を表示
ラベル Blogger の投稿を表示しています。 すべての投稿を表示

2024年9月16日月曜日

Bloggerでアマゾンアソシエイト

2023/11/10付でAmazonアソシエイトの画像リンク作成機能が廃止されました。 現時点でできるのは、アソシエイトツールバーによるテキストリンクのみ。 とても不便です。昔はamazletと愛用していましたが、現在はサービス終了になっています。 そのため、自力でリンクを作成する必要があります。 とりあえず、作成手順をまとめてみました。

手順1:amazonアソシエイトツールバーでリンク作成。
amazonアソシエイトツールバーにリンク作成メニューのテキストをクリックし、テキストリンクを作成。
手順2:商品画像を探して画像リンクを調査する。
amazonで紹介したい商品のページを開き、適当な画像をみつけたら以下のようにブラウザの新しいタブで表示。新しいタブのアドレスバーで画像URLを取得。
手順3:作成したテキストリンクと画像URLを使用して商品紹介を作成する。
作成したテキストリンクと画像URLを使用して以下のようなHTMLを作成し、ブログに記載すれば商品紹介できます。
商品紹介文は手順1のときに適当な文章をコピーしておくとよいと思います。 やってみると意外に簡単かも。
ページレイアウトの兼ね合いで画像が大きすぎたりするので、style="width:xxxpx"で調整するのがポイントです!
<a href="テキストリンク"><img src="画像URL" style="width:200px">商品紹介文</a>

2014年2月1日土曜日

jQueryで日付を表示

前回、BloggerでjQueryが使えることを確認した。今回は、実用してみる。とりあえず、「今日は何日か?」を表示してみる。まずは以下で、jQueryを使えるようにする。私は前回やったので省略。
  1. ブログのデザイン起動
  2. 左メニューのテンプレートをクリック
  3. 「HTMLの編集」ボタンをクリック
  4. 「<head>・・・</head>」の中に、「<script src='http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js' type='text/javascript'/>」を追記
  5. 「テンプレートを保存」ボタンをクリック
これで、jQueryをサイトで使用できるようになる。次にスクリプトを設置する。
  1. ブログのデザイン起動
  2. 左メニューのレイアウトをクリック
  3. 追加したい箇所の「ガジェットを追加」をクリック
  4. 基本ガジェットのHTML/JavaScriptの「+」ボタンをクリック
  5. 追加されたHTML/JavaScriptコンテナの「編集」をクリック
  6. コンテンツにJavaScriptを記載
以下のスクリプトを記載したコンテナを配置。
<div id=test0001 align=center>
<script type="text/javascript">
<!--
var d = new Date();
var w = new Array("日","月","火","水","木","金","土");
$("div#test0001").html(
"<table><tr><td style=\"text-align:center\">"+
"平成"+(d.getFullYear()-1988)+"年("+d.getFullYear()+")"+
"</td></tr>"+
"<tr><td style=\"font-size:large;font-weight:bold\">"+
(d.getMonth()+1)+"月"+d.getDate()+"日("+w[d.getDay()]+")"+
"</td></tr>");
//-->
</script>
</div>
すると左上のように、日付が表示される。


jQuery入門道場
jQuery入門道場
posted with amazlet at 14.02.01
株式会社フェンドーラ (2014-01-19)
売り上げランキング: 369

2013年12月30日月曜日

Bloggerでリファラスパム対策

Bloggerをはじめたその日に何百ものアクセスがあったので、不信に思い管理ページの統計から、アクセス元を調査した。同じドメインから数百ものアクセスがある。
しばらく様子をみたが、以下の3ドメインからのアクセスが集中している。
  • vampirestat.com
  • 7secretsearch.com
  • kallery.net
Googleで対策をしらべたら、Google Analyticsで対策できるようなので、とりあえず使ってみる。無料だし。
  1. Google Analyticsにて、アカウント登録
  2. 必要な情報を入力し、アカウント作成。この際にトラッキング IDをメモしとく。
  3. Bloggerの管理ページから「設定」→「その他」を選択
  4. 画面一番下にアナリティクスのウェブプロパティIDを設定するテキストボックスあるので、トラッキング ID」(UA-XXXXXXXX-Y)を入力
Bloggerの設定これで完了。あとは排除するドメインの登録。これはGoogle Analytics側で行う。
  1. Google Analyticsにアクセス
  2. アナリティクス設定→トラッキング情報→参照元除外リストをクリック。
  3. 参照の除外を追加をクリックし、除外したいドメインを入力して作成クリック。
上記設定して一週間くらい監視したが、Bloggerの管理画面から見れるトラヒックには、まだアクセス履歴が残ってる模様。連携しないのかな。ログはAnalytics側でみろっということか・・・。
フィルタも設定して様子を見てみよう・・・・

無料でできる!世界一やさしいGoogle Analytics●アクセス解析●入門
丸山 耕二
秀和システム
売り上げランキング: 3,283

2013年12月23日月曜日

BloggerでjQueryを使う

BloggerでjQueryが使えるか試す。Google検索でいくつかサイトがヒットしたので簡単だった。
  1. ブログのデザイン起動
  2. 左メニューのテンプレートをクリック
  3. 「HTMLの編集」ボタンをクリック
  4. 「<head>・・・</head>」の中に、「<script src='http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js' type='text/javascript'/>」を追記
  5. 「テンプレートを保存」ボタンをクリック
これで、jQueryをサイトで使用できるようになる。次にスクリプトを設置する。
  1. ブログのデザイン起動
  2. 左メニューのレイアウトをクリック
  3. 追加したい箇所の「ガジェットを追加」をクリック
  4. 基本ガジェットのHTML/JavaScriptの「+」ボタンをクリック
  5. 追加されたHTML/JavaScriptコンテナの「編集」をクリック
  6. コンテンツにJavaScriptを記載
ためしに本ページの最後に以下のスクリプトを記載したコンテナを配置したら動いた。
    <div id=test0001>
    <script type="text/javascript">
    <!--
    $("div#test0001").html("jQuery使えるかな?")
    //-->
    </script>
    </div>
divにonloadはないらしいので、中に記載するといいらしい。
以外と簡単に設置できた。目次でも作ってみるかな。

jQuery最高の教科書
jQuery最高の教科書
posted with amazlet at 13.12.23
株式会社シフトブレイン
SBクリエイティブ
売り上げランキング: 1,764

2013年12月8日日曜日

Bloggerでブログのタイトル表示をカスタマイズ

Bloggerのタイトル表示がきにいらなかったので、管理ページでレイアウトをごにょごにょしようとした。が、いくらやっても縦幅が縮まらない。
よくよくみてみるとタイトルの下に、説明を表示するコンテナがついている。
どうにかできないかと思考錯誤したあげく、テンプレートの「HTMLの編集」で可能なことを発見した。
やり方こうだ。
  1. ブログ管理画面左のメニューで、テンプレートをクリック
  2. 「HTMLの編集」をクリック
  3. 上のほうにある<header>~</header>を削除
  4. テンプレートを保存
上記作業で、タイトル表示自体が消えるので、あとはレイアウトメニューから、HTML等を追加すれば、すきなタイトルに変更できる。

Googleの説明書―2012年最新機能対応 (超トリセツ)

amazletで快適リンク作成

amazletを利用すると商品情報リンクをブログの文章中に挿入するためのHTMLが簡単に作れます。やり方は簡単。
  1. http://app.bloghackers.net/amazlet/にアクセス
  2. 「amazletをセットアップしましょう」のセットアップをクリック
  3. アソシエイトIDを入力し、次へをクリック
  4. 「amazlet it!」をブックマークツールバーにドラッグ
以上。
ブックマークをクリックすると別ウィンドウがあがってくるので、商品を検索し、「この商品のリンクを作る」をクリックすると、商品リンクが作成される。
あとは、作成された商品リンクをブログに貼り付けるだけ。
かなり、便利です。おすすめです。