RSS2.0

楽々ブログ Google攻略   自 立ライフ PCあれこれ  飯 寿司

パソコンあれこれ
当サイトのコンテンツはBlogger,Live Writer,Picasa2で楽々ブログ作成法、Googleのサービス使いこなしガイド、自立生活への道、パソコン一般の技術情報、鮭の飯寿司の作り方ブログ編などです。
その他
●NHKテレビ「ためしてガッテン」で話題の「酒粕甘酒の作り方
●3D作成フリーソフ ト「Google Sketch Upの使い方
● 「北海道の回転寿司」 チェーン店をGoogleマップ付で紹介
これらは全てBloggerを使用して作成しております。


Windows Live Writerの代わりにOpen Live Writerで

2016/01/13

Bloggerに投稿する時、いつも使っていたWindows Live Writerで、投稿できなくなった。認証テストではねられるのである。恐らくGoogleのセキュリティが厳しくなったからであろうが、Windows LIve Writerは2012年のあと、バージョンアップを行っていない。
これはいよいよBloggerにログインして、ブログを作成しないといけない、と思っていた矢先、Open Live Writerの存在を知った。このことは窓の杜の「Microsoft、ブログ投稿ツール「Windows Live Writer」をオープンソースに」に詳しく書かれているが、ともかくインストールして見た。
これまでと違うのはOpen Live Writer起動時の設定でブログを選択するとき、「Blogger」の名前が出て来たこと。そして、その「Blogger」をクリックすると、Google側での認証が行われる仕組みになったいた。それが済むと、あとはこれまでと同じ。
いまの所、メニューは英語だけだが、いずれ多国語言語仕様になると言うから、待つしかないが、Windows Live Writerを使いこんできた人は大体の感覚で出来そうだ。レイアウトは前と同じなので、置き換えて見ればよい。
途中からだが、その流れは
(1)認証リクエストで「許可」をクリック

image

(2)認証コードを受け取ったから、このウィンドウを閉じてもよいimage

(3)ブログ名を選択して「Next」
image

(4)レイアウトファイルのダウンロード
image

(5)ダウンロード完了(Finish)
image

(7)起動画面の一部
image

ダウンロードはOpen Live Writerサイトから(英語だがページ上のDOWNLOADからできる)
●この記事はOpen Live Writerから投稿しました。投稿はPublishボタン。
●画像のサイズ変更は画像を選択し、「Picture Tools」から行う。
image

BloggerでLightbox2を文字のリンクに対して使う

2012/08/16

Bloggerの最新テンプレートでは「ライトボックスで画像をアピール」(設定/投稿とコメント)が「はい」になっているので、標準でLightboxが使える。
lightbox

それでは文字のリンク先を画像にしたときも、Lightbox形式にするのにはどうしたら良いか検討してみた。
Lightbox2にアクセス(Ver2.51)すると英語だが説明文がある。
それによると必要なファイルは
jquery-1.7.2.min.js
lightbox.js
lightbox.css
close.png
loading.gif
next.png
prev.png
の7つ。
先ず、これらを適当なサーバーにアップしなければならない。
ここでは無料クラウドDropboxのPublicにlightboxフォルダを作成し、その中に7つのファイルをアップした。
image

そして、jquery-1.7.2.min.js、lightbox.js、lightbox.cssのパブリックリンクを取得すると、Javascriptは
<script src="http://dl.dropbox.com/u/********/lightbox/jquery-1.7.2.min.js"></script>
<script src="http://dl.dropbox.com/u/********/lightbox/lightbox.js"></script>
CSSへのリンクは
<link href="http://dl.dropbox.com/u/********/lightbox/lightbox.css" rel="stylesheet" />
但し、********は各ユーザに割り当てられた数字。
これらの3つはBloggerのレイアウト「HTML/JavaScript」に挿入して置かねばならない。
image

これで準備完了。後は実際に使って見るだけ。
例えば画像をDropboxにアップしそれにリンクして見よう。

ここをクリックすると「Dropbox/Public/lightbox」内のファイル全体が大きく表示されます。

を作りたいときは先ずリンクしたい文字に対して、普通にリンクを作成(図はWindows Live Writer2011の時)。
image
次にソースを開いて、 文字にリンクを張った画像(lightbox2.jpg)のあとにrel=”lightbox”を追加します。 
image

またここをクリックするとBloggerの「HTML/Javascript」の大きな画面が表示されます。 も同様にできます。

もし、連続して画像を表示させたいときはrel=”lightbox[kakudai]”のようにします。 連続画像1連続画像2 
連続画像1をクリックし画像の上にマウスを当てると次の画像を示すアイコンが右端に出ます。


画像にタイトルを入れたいときは同様にtitle=”ライトボックス画像” のようにします。
タイトルを入れたサンプルはこちら

●尚、このブログはライトボックスに対応していないため、画像をクリックすると大きな画像は今まで通り次のページに表示されます。試して見ると違いが分かります。もし、このブログの様にライトボックス非対応の場合、画像に対してrel=”lightbox”を追加すると文字のリンクと同様になります。

※関連ページ:無料クラウドDropboxでWindowsとLinux(Ubuntu)を同期

Bloggerにカレンダー式アーカイブを追加

2010/04/09

ブログのサイドバーにあるカレンダーの太字の数字をクリックして過去に投稿したブログを表示させると言うのは良く見かける方法だが、なぜかBloggerにはない。これをBloggerで実現させるには「クリボウ式カレンダー」のウィジェットが簡単に出来ていい。以下はその導入方法です。
(1)クリボウの Blogger Tips: Blogger beta にもカレンダー にアクセスし「カレンダーを追加」をクリック
 image
(2)Bloggerにログイン(Bloggerに自動ログインしている時は出ない)
image
(3)ブログを選択して「ウィジェットを追加」をクリック
image
(4)Bloggerのレイアウトで挿入場所を編集
image
※このカレンダーを追加したブログ例はこちら