2012/05/16

[blogger]海外からでも来て下さい!ブログにカスタム検索と翻訳をガジェットで追加しました。

遅ればせながら、ブログにGoogleの「カスタム検索」と「翻訳」を追加しました。

ナビバー消してないし、海外向けじゃないし、別にいいかと思っていたんですが、ナビバーは最上部の端っこにあるだけで、気付きにくいし、【非表示のオブジェクト?(05/01追記しました。) - sunabox】(Click New Tab)の時に、情報得るために「avira hidden objects」で検索して、英語のサイトも探したりして、自分で意外と使ってることに気付いたので、追加しておこうと・・・。

両方とも、bloggerのガジェット追加から、手軽に追加は出来るんですが、見た目が選べなかったり、後から調整しづらかったので、それぞれコードをもらってきて、ガジェット「HTML/Java」にコードをコピペして、追加することにしました。


入手先サイト

Google カスタム検索 - サイト検索をカスタマイズ
Google カスタム検索では、そのウェブサイトに合ったオーダーメイドの検索環境を実現します。 ...

Google 翻訳

ここで、それぞれの見た目(特にカスタム検索)を設定して、コードをコピーして貼るだけです。

前にも一度貼ろうと思っていた時期があったのですが、その時は、ガジェットの余白の調整方法を知らなくて、上下に余白が随分空いてしまって不恰好になるという理由で見送ってましたが、

【blogger】サイドバーのガジェットの上下の余白を詰めて配置する方法。(04/28追記) - sunabox
この余白、サイドバーのガジェットで「JavaScript」などで、サードパーティ製のソーシャルボタンなどを置こうとした時、どうしても無駄に広く余白が出来る時がありました。 ...
この時の調べで、私がちょっと強くなったので、調整しながら置くことにしました。

調整は、カスタムCSSの追加から、CSSの書き込みで行います。
#HTML4 {margin-bottom: -10px;}
こんな感じの!(例です)


もう一点!

それで、置いた後に確認していると、初めにページを開いた時や、リロードした時、ページを移った時に、サイドバーの描写で、「検索」「翻訳」を置いた場所が、初めは何もないような状態で隙間が埋まっていて、それぞれの読み込みが出来てから、隙間が開いて挿入って感じに、サイドバーが動く事に気付きました・・・なんかせわしなく感じます・w・

そこで、置いたガジェットのコードを確認すると、【div】タグでIDが作られていたので、そこに・・・

このように、【style="height:40px;"】を追加してあげると、読み込み前から、幅にあったスペースを空けておいてくれるので、変な動きが目につかず、自然な感じにすることができました。
両方共、少し読み込みが遅いですので・・・。

サイドバーがどんどん伸びていったりの動作が目に付くと、表示が遅い印象を受けてしまうので、こういうことが出来る場所は、調整してあげるといいんじゃないでしょうか?



あと、ChromeのVer.19が安定版になったんですが、タブ関連に機能が入ったせいか、拡張機能などによる「ダブルクリックで閉じる」も、「ホイールを回転してタブを切り替える」も効かなくなっています。
自動アップデートなので、基本的にどうしようもないですが、拡張機能でこんな機能を追加していて、Googeupdateを止めている人は、ちょっと気をつけてからアップデートしたほうがいいかもしれません。微妙な、操作上のストレスが蓄積しますw
自動アップデートのあとに、バージョンを戻そうとすると、ChromeSyncのプロファイルバージョン違いで、ブックマークなども設定が消えてしまう(正しくは同期がとれなくなる)可能性も高いので、これもご注意を!

という、今日の小ネタでした!
ではまた!

0 件のコメント:

コメントを投稿