2010/07/31 Google AJAX Feed API

今回はホームページに他のサイトのブログを読み込む作業をしました
これがなかなか難しい
なぜならフィードを取りに行くとはじかれてしまいます

それでGoogle AJAX Feed API を使うことにしました

まず
gajaxjsを作成します
内容は


// JavaScript Document
var blog = {
feedurl: "RSSアドレス○○.xml",
// feedurl: "http://www.makun.jp/pplog2/rss2.xml"や
// feedurl: "http://blog.makun.org/feed", です
numOfPost: 10, // 1 ページに表示する投稿数
url: "ホームページアドレス"
}

// エントリーのタイトルをリンク付きにして div 要素に入れて返す。
function createTitleWithLink(entry, idx){
var div = document.createElement("div");
var anchor = document.createElement("a");
anchor.href = entry.link;
anchor.setAttribute("name", idx);
anchor.appendChild(document.
createTextNode(entry.title));
div.className = "title";
div.appendChild(anchor);
return div;
}
// エントリーの内容を div 要素に入れて返す。
function createContent(entry){
var div = document.createElement("div");
div.innerHTML = entry.content;
div.className = "content";
return div;
}
// エントリーのタイトルへのアンカーを作成し、div 要素に入れて返す。
function createFeedTitle(entry, idx){
var anchor = document.createElement("a");
var div = document.createElement("div");
anchor.setAttribute("href",
location.protocol + "//" +
location.hostname + location.pathname + "#" + idx);
anchor.appendChild(document.
createTextNode(entry.title));
div.appendChild(anchor);
return div;
}
// 「前の投稿」を生成
// createURL 関数は blog.js で定義。
function createNextLink(entry){
var anchor = document.createElement("a");
anchor.href = createURL(blog.url, blog.numOfPost,
new Date(entry.publishedDate));
anchor.appendChild(document.createTextNode("前の投稿"));
return anchor;
}
google.load("feeds", "1");
function initialize() {
var feed = new google.feeds.Feed(blog.feedurl);
feed.setNumEntries(blog.numOfPost)
feed.load(function(result) {
if (!result.error) {
var divFeedTitle = document.getElementById("feedTitle");
var divFeed = document.getElementById("feed");
var divNextLink = document.getElementById("nextLink");
for (var i = 0; i < result.feed.entries.length; i++) {
var entry = result.feed.entries[i];
// フィードのタイトル一覧を生成
divFeedTitle.appendChild(createFeedTitle(entry, i));
// フィードのタイトルを生成
divFeed.appendChild(createTitleWithLink(entry, i));
// フィードの内容を生成
divFeed.appendChild(createContent(entry));
}
// 前の投稿へのリンクを生成
divNextLink.appendChild(createNextLink
(result.feed.entries[blog.numOfPost-1]));
}
});
}
google.setOnLoadCallback(initialize);

載せたいページに

<script type="text/javascript" 
src="http://www.google.com/jsapi"></script>
<script type="text/javascript"
src="js/gajax_shii.js"></script>
//<pre></head>より上に書く
 
//<body>より下に書く
<div id="feedTitle"></div>

<div id="main_blog">
<!-- フィードの内容 -->
<div id="feed"></div>
</div>
//</body>より上に書く

後はCSSでデザインを変更します
clssは
#feedTitleとcontentです

参考サイト
ブログI’m.
ブログmacco
ブログ$HII

よかったら見てください

参考サイト
Google AJAX Search API

2010/06/18 google(Picasa)を使って画像サイズをダウン

父の日に送るデジタルフォトフレームに画像を入れるのに苦労しました
今まで整理整頓していなかったので今回整理整頓しました
まず、同じ写真を削除します
Picasaを起動して
ツール→フォルダマネージャを開き
写真のあるところを常時スキャンにチェックを入れます
次にツール→試験運用→重複ファイルを表示
左のメニューの上の方に検索結果(数字)があるのでクリック
同一ファイルが表示されるので
プロパティで入らないファイルを決めて削除します
片方を削除すると画面から両方の画像がなくなります
作業が終了したらアップロードをします
フォルダ名=アルバム名になります
アップロードする形式等は
ツール→オプション
ウェブアルバムのタブをクリックで設定します
すべてのアルバムをアップロードします
アップロードできるファイルは1Gまでですが
サイズダウンされますので一度全部アップロードしてみます
できなかったものはアップロード出来なかったとでます

今度はウェブアルバムからダウンロードします
ツール→オプション
全般のタブをクリック
一番下にある
インポートした写真の保存場所を設定します
必ず今写真のある場所以外を選択してください
画像が消えてしまいます
ウェブアルバムに移動して
アルバムをクリック
ダウンロードタブをクリック
Picasaにダウンロード
ウェブアルバムで980Mがダウンロードすると500M以内でした
サイズも640*480になってました
時間はかかりますがまとめてできるので良かったです
縦の画像や横の画像もまとめてできます
何回もする場合はウェブアルバムのアルバムを消して次のアルバムをアップロードすれば何回でもできます

8.5インチ液晶デジタルフ…¥5,565(税込)デジカメで撮った写真を“楽しむ”ことができると今話題なのがフォトフレーム。通常、7インチが主流の中、今回は大画…

8.5インチ液晶デジタルフォトフレーム DS-DA85N100 ピンク

超小型USBフラッシュメモ…¥2,980(税込)外で持ち歩くUSBフラッシュメモリーだから、実用性はもちろん、見ためにもこだわりたい!プラチナのような高級感を…

超小型USBフラッシュメモリー Touch 830 8GB

写真の整理は
googleのpicasaが便利ですよね

2010/06/12 googleカレンダーを携帯で使う方法

googleカレンダーが携帯では新規の予定追加できない
そこでお役たちサイトを発見しました
TAKE24/7
googleにログインしたまま
認証開始をして
認証アクセス許可をクリック
表示されるQRコードを読み取り
アクセス
表示されます

Google Calendar Mobile Gateway version 3
認証開始をクリックして
認証アクセス許可をクリック
表示されるQRコードを読み取り
アクセス
QRコードのした二表座されている
登録コードを入力
OK!!

携帯で見る
まぁくんの店
休業日をクリック!!

PCで見る
まぁくんの店休業日

携帯サイトでgoogleカレンダーを表示させる
PCのアドレス
http://www.google.com/calendar/embed?src=●●●%40gmail.com&ctz=Asia/Tokyo
携帯のアドレスは
http://www.google.com/calendar/htmlembed?src=●●●%40gmail.com&mode=AGENDA
に変更する
●●●はGmailのアカウント

embed?をhtmlembed?に変更する

カレンダーを追加して表示させるには
http://www.google.com/calendar/htmlembed?src=●●●%40gmail.com&mode=AGENDA
●●●%40gmail.comの部分を
■■■@group.calendar.google.comに変更
■■■以下は
googleカレンダー設定
表示させるカレンダー名をクリック
カレンダーのアドレス
カレンダー IDを参照してください
※このカレンダーを共有から
このカレンダーを一般公開するにチェックを入れてください

携帯で見る
まぁくんの店
休業日をクリック!!

PCで見る
まぁくんの店休業日

2010/06/10 休業日の表示にgoogleカレンダーを使用しました

駐車場の場所をgoogleの航空写真を使って表示しました

Gmailの登録をしてgoogleカレンダーの登録をしました
自分用のカレンダーとお店用のカレンダーを作成しました
カレンダーを何個も増やせるのはいいですよね
色分けできるし!!
お店用のカレンダーは誰でも見れる設定にしています!!
これでxoopsの文字化けから開放されます
えへへ

まぁくんの店 休業日
http://www.google.com/calendar/embed?title=%E3%81%BE%E3%81%81%E3%81%8F%E3%82%93%E3%81%AE%E5%BA%97%E3%80%80%E4%BA%88%E5%AE%9A%E8%A1%A8%20&showTitle=0&showPrint=0&showTabs=0&showCalendars=0&showTz=0&height=350&wkst=1&hl=ja&bgcolor=%23FFFFFF&src=e1u3dd78bbhe932ebldg8ftfgo%40group.calendar.google.com&color=%23711616&ctz=Asia%2FTokyo

休業日を大きく表示

まぁくんの店の左のブロックに表示されています

ブロックのサイズ変更は
\themes
\cork_board3(当店ではcork_board3を使用しています)
style.cssを変更すればできます

後はoutlookと同期すれば完成です!!
まず同期するのに常駐型のアプリケーションGoogle Calendar Syncがいります

インストーラ「常駐型のアプリケーションGoogleCalendarSync_Installer.exe」をダウンロードします
インストールを開始し『I Agree』ボタンをクリックする
次にインストールするオプションはそのままで『Next』ボタンをクリックする

右下にあるアイコンをクリックします
メールアドレスとパスワードを入れる

「Sync Options」の設定
2-way
Googleカレンダー、Outlookの予定追加をそれぞれ反映するモード
1 way:Google Calendar to Microsoft Outlook calendar
Googleカレンダーの変更をOutlookの予定に反映するモード
1-way:Microsoft Outlook calendar to Google Calendar
Outlookの変更をGoogleカレンダーの予定に反映するモード
後は同期できない項目等もあります

2009/11/06 Google Page Rank 3

今月からページランクが3に復活しました!!
なぜ3になったかはわかりません
先月はほとんどホームページを作成もしていなければ修正もしていません

早く、はんこの通信販売をつくらないといけないのに手がつけれない状態です
困ったものです

2009/07/06 適切なメタデータ (descriptions)作成

[ホームページ作成] ブログ村キーワード
同じような内容のページがなかなかインデックスされない原因
ウエブマスターツールでも重複するメタデータ(descriptions)としてありました
適切なメタデータ (descriptions)の作成を試みます
googleで調べると文章でなくて構造化データで構わないと書かれていました
ページに同じメタデータを入れていましたがすべて変更いけないのか?
現状

<meta name="Description" content="まぁくんの店で取り扱ってい
る黒檀一覧です" />

変更後

<meta name="Description" content="制作: まぁくんの店, 場所: 
四條畷, 分類: 黒檀, 内容: 一覧, 価格: 500 円, 種類:さ行" />

さ行をそれぞれ変更しました
これで少し様子をみてインデックスされるようなら
すべてのページのメタデータを変更します

2009/06/28 検索エンジンで最新の情報を得るには???

[サーチウィキ] ブログ村キーワード

ヤフーとかグーグルで検索してそのページがすごく昔に作成されたページだった事が良くあります
ほんとに知りたい最新情報はどうやって検索すればいいんでしょうか?
それとも検索結果は最新のページが表示されるようになっているのでしょうか?
最新の道路交通法なら警察庁のページで調べるのが一番ですよね
でもSEO対策で今現状しないといけないSEO対策は
どのページを見たらいいかわからないですよね
ブログなら書いた日にちが必ずわかりますよね
検索したページの下に更新日を表示してくれるとすごく助かります

それと
最近グーグルで検索すると右側に↑矢印(順位を上げる)があります
それをクリックすると検索のトップページに移動しますが
自分だけの結果が移動するのでしょうか?

ボタンの名前は「サーチウィキ」と言います
2009年5月7日から開始したサービスです
googleにログインしたまま検索すと↑(矢印)と×(ばつ)があります
googleからログアウトして検索すると表示されません
解説
Web検索結果に表示されたサイトの並び順を変更できます
検索結果から特定のサイトを除外することができます
サイトに対するコメントも投稿できます
ただし、
検索結果に加えた変更は本人だけに反映され、他のユーザーの検索結果が変化することはありません
コメント内容は一般公開されますので個人情報は入れないようにしましょう!!
参考ページ

2009/06/18 ウェブマスターツール(google)

ウェブマスターツールの様子が変わってます
全然違うのでびっくりです
まだ、なんとなく慣れないですね
ひとつ選択するとタブが毎回閉じるのは非常に面倒です
それとどうしてもヘルプのリンクをクリックしてしまいます
あはは 他にもいるんですかね
間違えてヘルプのリンククリックする人!!

でも、かなり見やすくなっているので操作に慣れれば結構使えますよね

2009/06/18 googleのインデックスが消えてる???

既製認印一覧モバイルページ
をカスタム検索で全ページ登録してインデックスされているのを確認しましたが、今日チェックするとインデックスから消えてました???
タイトルが同じのままにしていたからだろうか?
全ページのタイトルを変更しサイトにアップして、サイトマップ再送信しましたが登録されません
う~~~ん
困ったもんです
これでは検索ができません
一日様子をみることにしますが、この状況でお客様が検索して表示されなければせっかく作ったサイトも水の泡です
しょぼん

2009/06/02 googleのカスタム検索

前回リサイクルはんこでは行がインデックスされなかったのはは行のリンクを作成するのを忘れてました
なんてこった
は行ふ行ほ行

カスタム検索のサイトに行き
メニューからインデックス作成に行くとサイトマップを指定して、インデックスを作成してくれます
しかし、は行はまだ登録されていません

本題です検索ボックスを作成
カスタム検索でインデックスを作成したり検索するサイトを指定できる
検索しないサイト又はディレクトリも指定できる
知らなかった
なんて便利なんでしょう
XML形式でアップロードをするみたいですね
サイトの登録は3種類あって今回は検索ボックスごとにサイト指定する方法を試してみようと思います

<Annotations>

<Annotation about="www.makun.jp/*">
<Label name="_cse_xxxxxxxxxxx"/>
</Annotation>
www.makun.jp以下の階層を検索対象にします

<Annotation about="www.makun.jp/pplog2/*">
<Label name="_cse_exclude_xxxxxxxxxxx"/>
</Annotation>
www.makun.jp/pplog2/以下の階層は検索対象からはずします
</Annotations>

ラベルが_cse_xxxxxxxxxxxなら対象
ラベルが_cse_exclude_xxxxxxxxxxx なら除外します
xxxxxxxxxxxはそれぞれの検索ボックスのコードを入れます

もっと簡単な方法は
コントロール パネル – サイトで検索するサイトと除外するサイトを登録するだけでできます
確認はコントロール パネル – 詳細設定: アノテーションのダウンロードのブラウザでXMLを表示すると上記のファイルが出来上がっています

2009/05/28 モバイルページのインデックスについて

[SEO対策 検索アップアップ ホームページ]

googleの検索をサイト内で検索にで設置した
しかしgoogleにインデックス登録されていないので検索されない
これでははんこの在庫があるのかないのか調べられない
一体どうすればいいのだろう?
インデックスの登録が終わるまで待たないといけないのか?
う~~~ん困った
http://www.makun.jp/recycle/mobile/
はインデックス登録されているがその下がまだでした
登録させるのは難しいですね
何度もサイトマップを送っているがなかなかです



リサイクルはんこについて

2009/05/26 モバイルページをインデックスに登録する方法

リサイクルはんこのモバイルページがインデックスされない
インデックス登録されていないとサイト内でどのはんこがあるのか検索できません

googleとヤフーにインデックス登録してもらうのにサイトマップを作成して送信しましたが、PC用のページだけがインデックス登録されてました。
モバイル用(携帯用)サイトは全然登録されません。
いろいろ調べた結果
サイトマップにモバイルである事を書かなければインデックス登録されないみたいです
そこでついでにHTMLの宣言文もモバイル用に変えてみました
変更点とサイトマップの作成の記述は下記の通りです

htmlの宣言は

<!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML 
Mobile 1.0//EN" "http://www.wapforum.org/DTD/xhtml-
mobile10.dtd"><html xmlns="http://www.w3.org/1999/xhtml">

sitemap.xmlの書き方は

<?xml version="1.0" encoding="UTF-8" ?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"
xmlns:mobile="http://www.google.com/schemas/sitemap-
mobile/1.0">
<url>
<loc>http://www.makun.jp/recycle/mobile/</loc>
<mobile:mobile/>
</url>
<url>
<loc>http://www.makun.jp/recycle/mobile/a.html</loc>
<mobile:mobile/>
</url>
</urlset>

インデックス登録されたら追記します