2010年3月8日月曜日

ガジェットを追加する方法。

Bloggerは適用するテンプレートによってデフォルト(既定・最初から設定されている)のガジェット(要素)が違います。

スージーBlogger別ブログ●スージーの口コミブログのテンプレートStretch Denimの場合は最初から[マイ ブログ リスト]があるんですが、この“初めてのBogger”で使っているテンプレートDotsの場合にはマイブログリストのガジェットがありません。

んで、過日のブログ●Bloggerのラベルでカテゴリ表示する。の時と同じように、[レイアウト]タブの[ページ要素]から[ガジェットの追加]をクリック。


開いたウィンドウのガジェット一覧から[マイ ブログ リスト]を追加します。


[保存]をクリックします。


[レイアウト]に[マイ ブログ リスト]ガジェットが追加されました。


追加したガジェットはドラッグ&ドロップ(移動させたいガジェットの上で左クリック→移動先までマウスから指を離さず動かして→移動先位置でマウスから指を離します)で移動できます。


この方法で好きなガジェット(要素)を追加して、好みの位置に動かせます♪次回はマイブログリストの編集方法…のつもり。ではまた~(^^)/。

ブログ本文の幅を広げる方法。

以前のブログ●Picasa3(写真・画像管理フリーソフト)by Googleってすごいかも!でYouTubeの動画をいくつかご紹介しましたが、その一つの幅が広くて(480px?)以前のブログ幅では端が切れてしまいました;。
↓↓↓

そこでブログ本文の幅を広げてみます。[レイアウト]タブ→[HTMLの編集]をクリック。


"Ctrlキー" を押しながら "Fキー" を押すと画面上部に検索窓が出てきます。検索窓に"width"(=幅)と入れて検索してみます。


(※以前のブログ記事●BloggerのヘッダーHeaderを移動させる。の説明時点では検索窓が画面下部に出てきてたのですが、今回"Ctrlキー" を押しながら "Fキー" を押したら上掲画像のように画面上部に検索窓が出てきました。)


outer-wrapper=ブログ全体設定
main-wrapper=ブログ本文(編集画面で文字などを入れる部分)の設定

なので、それぞれの幅(=width)を変更します。

outer-wrapperのwidth:700pxをwidth:800pxに
main-wrapperのwidth:450pxをwidth550pxに

それぞれ100ピクセルずつ広げます。


[プレビュー]してみて、レイアウトがおかしくなっていないか開いた画面で確認。それで良ければ[テンプレートの保存]をクリックして、テンプレートの変更を保存します。

さっきは切れていたYouTube画面の端が収まりました。めでたしめでたし♪


ちなみにブログトップ(ヘッダー部分)の変化はこんな感じです。

<変更前>

<変更後>

ブログ記事タイトル部分、1行あたりの文字数も変わってる(増えている)のわかります?あ、そう言えばすでに文字サイズ(フォントサイズ)も変更しています。文字サイズの変更はまた次の機会に(のつもり)…ではまた~(^^)/。

※注意:ブログ本文部分の背景backgroundに装飾があるようなテンプレートをお使いの場合、ブログのデザインが見苦しく?なってしまう場合があります。Roundのように角が丸くなっているテンプレートも背景の画像で角が丸くなるような加工(装飾)をしてあるので、あまり美しくならないと思います;。

2010年3月7日日曜日

Bloggerの始め方。

これからBloggerでブログを始めようと思われる方のために…YouTubeにBloggerのはじめ方紹介動画があったのでご紹介(英語だけどね;)。
↓↓↓
How to create a blog with Blogger


編集画面が以前のエディタですが…。基本はそんなに変わらないと思います。ではまた~(^^)/。

2010年3月6日土曜日

Picasa3(写真・画像管理フリーソフト)by Googleってすごいかも!

Googleの写真管理フリーソフトPicasa3をインストールしてみました。
パソコン内の写真からソフトが自動で人の顔を認識→識別し、人別にアルバムを作ってくれちゃいます♪←他にもPicasaで色々できるけど、この機能が一番インパクトありました。

…すべての写真がうまく人別に分けられるわけではありませんが、これ、結構面白い♪…っていうか、すごいですね~。

Picasaを使った画像の編集&加工も簡単だし、ウェブアルバムやBloggerにも簡単にアップできます♪まずはYouTubeでPicasa3の機能を見ます?

こちらは英語ですが…グーグルによるPicasa3基本?解説動画。
↓↓↓
Introducing Picasa 3


日本語のPicasa解説動画。旧バージョンのPicasaですが…基本は変わりません。
↓↓↓
知ってる? Picasaで画像を素早く整理/編集/共有 Wants映像講座


Picasa3.5の顔認識機能とか、Picasa3.5の新機能について by Google。日本語字幕です。
↓↓↓
What's new in Picasa 3.5


どうです~??面白そうでしょ?スージーははまってます;。
Picasa 3: Googleから無料でダウンロードできます

ではまた~(^^)/。

2010年3月5日金曜日

コピー&ペーストcopy and paste(コピペ)の方法。

突然ですが、コピペ(コピー&貼り付け)できますか?もしできなかったら(知らなかったら)是非マスターしてください。

コピペについて書かれてるサイトは色々ありまして…スージーの見た中で一番わかりやすそうなこちらを参考に;。手抜き;。
コピペの方法@■あなたも楽しいネットライフを■ by ベアさん
↑↑↑
管理人のベアさん(ウェブサイトには本名も書かれてます)は筋萎縮性側索硬化症(ALS)なのでしょうか?…改めて自身の健康に感謝。ベアさんにも感謝。

英語なのですが…YouTubeにコピペの方法の動画がありました。ご参考まで。
↓↓↓
How to Copy and Paste


どうです?簡単でしょ?これで作業が超スピードアップ!ではまた~(^^)/。

2010年3月4日木曜日

BloggerのヘッダーHeaderを移動させる。

テンプレートでDotsを選ぶと…ヘッダー(タイトル)が左サイドバーに表示されます。


これを普通の?ブログタイトルみたいにブログの上辺(横長)に変えたい。そこで[レイアウト]から[ページ要素]を見てみると…


こんな感じ。(Header)部分は固定されていて移動できない。ちなみにねずみ色?部分の読者、ブログ アーカイブ、自己紹介の要素(ガジェット)は、ドラッグ&ドロップで位置を変えることが可能。

↓↓↓

そこでHTML編集。


"Ctrlキー" を押しながら "Fキー" を押すと画面下部に検索窓が出てきます。検索窓にlockedと入れて検索。画像をクリックすると大きく表示されます。

↓↓↓

<div id='sidebar-wrapper'>というのがサイドバーの設定みたい。ドラッグ&ドロップで動かせない要素はlocked=trueとなっていて、自己紹介のように動かせる要素はlocked=falseとなってます。これを変更すれば良さそう。


青くしてあるtrueの下の方がヘッダーについての記述なので、これをfalseに変更し、右下のオレンジ色ボタン[テンプレートを保存]します。


ここで[レイアウト]から[ページ要素]を見てみると…ヘッダー(Header)がねずみ色になっていて、動かせるようになりました。


あとはこれをドラッグ&ドロップして、上にもっていけばOK。


これを保存して…


おしまいかと思いきや…ブログを表示してみるとまだ左サイドにヘッダーが残ってる;。


移動してなくなったはずのサイドバー部分にまた(Header)が復活してました;。編集をクリックして…


削除をクリックします(ちなみにlocked=trueの時には編集をクリックしても削除ボタンはありません)。


これでめでたく終了♪と思いきや…また復活してる…結局テンプレートのHTMLを削除することにしました。再び[レイアウト]から[HTMLの編集]。さっき変更したはずのlocked=falseがtrueになってるの見えます?画像をクリックすると大きく表示されます。

↓↓↓

選択部分を切り取りor削除して…[テンプレートを保存]をクリックすると…こんな警告画面が出ました。ここで[ウィジットを削除]します。
↓↓↓

めでたくサイドバーのタイトルが消えました♪良かった良かった♪


…結局ヘッダーを動かしたあと、再びHTML編集でテンプレートのサイドバーヘッダーHTMLを削除すれば良いと言うことでした。

は~。ぼつぼつBloggerの編集にも慣れてきました。画像が簡単にアップできるのは良いんですが…[作成]画面で画像をドラッグ&ドロップしたりしてレイアウト変更すると…文字が移動してしまったり、消えてしまったり、面倒くさい;。HTMLの編集で見てみると…やたらいろんなタグがついてます;。

あと[作成]画面だとテキストのコピー&ペーストが使えないのはなにゆえ?画像は[作成]画面で、文字はHTMLでとか編集画面の切り替えが必要なときもありますね~。しかしなかなか楽しそう?なブログです。まだまだ研究が必要かも~。

さて、今回の変更で…どっかおかしくなってしまったらすみません~;。自己責任でお願いしますm(_ _)m。他にももっと簡単な方法があるかもしれません…コメント欄にてお知らせいただければ幸いです;。

今回のBloggerカスタマイズ…Chocoさんの●Bloggerのページ要素に[ガジェットを追加]リンク(Add a Page Element)を導入する方法 Bloggerカスタマイズ情報ブログを参考にさせていただきました。ChocoさんのBloggerカスタマイズ情報ブログでまずはお勉強~♪このあと読破?してきます~Chocoさんに感謝。

…以上スージー別ブログ“スージーの口コミブログ”2月24日●Bloggerのヘッダーを移動させる方法のほとんどコピーでした;。ではまた~(^^)/。

追記(2010.3.8)
結局ヘッダーを動かしてみたものの…タイトル(ヘッダー)と日々のブログエントリー部分に微妙なスペースができているので、また元に戻しました;。HTMLのスタイルシート部分を変更すればいいと思うのですが…めんどくさかったので;。はは;。

あと、上のブログ記事を書いた時点では検索窓が画面下部に出てきてたのですが、本日"Ctrlキー" を押しながら "Fキー" を押したら以下の画像のように画面上部に検索窓が出てきました。


以上ご報告まで♪

2010年3月3日水曜日

Bloggerのラベルでカテゴリ表示する。

スージーのBlogger別ブログ●Bloggerはカテゴリがないの?@スージーの口コミブログでBloggerではカテゴリ分類ができないのかと思ったら…やはりブログ記事投稿編集ページの下にある[この投稿のラベル]右空欄にキーワードを入れると…それがカテゴリとして分類されるようでした。

カテゴリと言うより、いわゆる“タグ(キーワード)”で分類するわけで…seesaaブログとかだと、1記事1カテゴリにしか分類できませんが、Bloggerの場合、複数のキーワードでカテゴリ分けすることができることになります。いや~これ便利だな~。

現在“以前のエディタ”では日本語で「この投稿のラベル:例)カフェ、旅行、秋」と表示されてるんですが、この読点“”はコンマ“,”の誤りです。コンマでキーワードが分けられます。
↓↓↓

え~ちなみに新しくなったエディタでは“例”は書かれてません。
↓↓↓

んで、[レイアウト]タブの[ページ要素]から[ガジェットの追加]でガジェット[ラベル]を追加します。





[ラベル]のタイトルは編集できるので、これを“カテゴリ”に変更すればカテゴリ表示できます。


リスト形式ではなくて、タグクラウド形式での表示も可能です。記事数が少ないので、リスト形式との違いがあまりわかりませんが、クラウド表示だと記事数が増えるとそれに比例して、該当ラベル(カテゴリ)の文字も大きくなっていくと思います。

リスト形式

クラウド形式

残念なのはラベルでブログをカテゴリ分類できるのは良かったんですが、このラベル(カテゴリ)の表示順位をseesaa blogのように変えることができません;。あいうえお順or頻度順となります。一応スージーは頻度順にしておきました。

それにしてもBloggerやっぱり使えるな~。さすがgoogle様でございます;。ブログのテンプレートが少ないのが玉に瑕ですが…おそらく英語のサイトで色々紹介されてるんではないかと…。ガジェットも英語だと色々あるしね;。

以上、過日(2010年2月23日)“スージーの口コミブログ”で書いた記事●Bloggerのラベルでカテゴリ表示する。を少し修正&加筆しました。ではまた~(^^)/。