2010年5月28日金曜日

Bloggerで、カスタマイズしたCSS(= テンプレート)をバックアップする方法 - CSSカスタマイズ

Bloggerブログの見栄えを変更する
Bloggerブログのバックアップと復元
Bloggerに付いている、テンプレートのバックアップ機能を使う方法が、簡単です。
手作業でコピーする時は、右上のチェックを付けて、内容を全部表示させてからコピーします。


**** 手順 (2012年5月現在)
o Bloggerにログインします。
o 「テンプレート」画面を開きます。
   + ブログの右上にある「デザイン」リンクを押します。
   + ダッシュボードに居る時は、変更したいブログの「▼」をクリックして、「テンプレート」を選択します。
o 切り替わった画面の右上にある、「バックアップ/復元」ボタンをクリックします。
o 小さな画面が出てきますので、「テンプレートをすべてダウンロード」ボタンを押します。
o 後はファイルのダウンロードと同じです。


**** メモ
o 上記手順の他に、HTMLの編集画面から手動でメモ帳などにバックアップする事も出来ます。
o 自分でバックアップする時は、HTMLの編集画面の上にある「ウィジェットのテンプレートを展開」にチェックを入れてからにします。
   + CSSには関係が無いのですが、テンプレートの内容を全部保存する為に必要です。
o この他に、投稿記事をバックアップした時に、テンプレートの内容も一緒にバックアップされるみたいです。
   + バックアップしたファイルを開くと、テンプレートの内容も書かれていました。


==
関連ページ:
    ▼Bloggerブログの見栄えを変更する
    ▼Bloggerブログのバックアップと復元
    ▼Blogger
    ▼制作メモ
    > 全ての記事の最初や最後に、決まり文句や固定リンクを追加する
    BloggerをCSSカスタマイズする
    > Bloggerで、カスタマイズしたCSS(= テンプレート)を復元する
    Bloggerの投稿記事をバックアップする(エクスポート)
(2012年5月7日変更。新デザイン対応)
(2010年6月11日変更。Bloggerの仕様変更対応)

要素の背景を半透明にする方法その3。アルファチャンネル付きの画像を表示する - CSSカスタマイズ

CSSカスタマイズ。半透明にする
この方法は、画像編集が得意な方に向いています。
o 一度作ってしまえば、CSSを余分に追加しなくても済みます。
o 画像の透明度を変える時、画像編集の知識だけで対応出来ます。

但し、この方法には前提条件があります。問題がある場合は、他の方法を使います。


**** 前提条件
o アルファチャンネル付きPNG画像の表示は、Internet Explorer 6が対応していません。

o JavaScriptが使えるサイトの場合は、Internet Explorer 6への対応が可能です。(例えば、Bloggerブログなど)
   + 検索キーワード 「AlphaImageLoader PNG JavaScript」辺りでWeb検索すると、沢山情報が見つかります。
  もしくは
o Internet Explorer 6への対応を諦める場合も、この方法を使う事が出来ます。


**** 手順
o 普通に画像を使ったページを作ります。
o 半透明にしたい画像を編集して、アルファチャンネル付きPNG画像で書き出します。
   + アルファチャンネル付きPNG画像を作る事が出来る画像編集ソフトを見つけます。
   + フリーウェアでも対応しているものがあります。自分に合ったソフトを探してみて下さい。
   + 後は、そのソフトを使って、画像を加工するだけです。
o 作ったPNG画像を、アップロードします。
o CSSで指定している画像のアドレスを、アップロードしたPNG画像のアドレスに置き換えます。
   + Internet Explorer 6に対応させる場合は、上の手順で調べた手順も行います。


**** メモ
o 今はまだ、CSSカスタマイズ先によっては、Internet Explorer 6に完全対応出来る「半透明後の画像を用意する方法」の方が重宝します。
o 背景を一部固定化する場合、相性があるかもしれません。詳しくは、「半透明後の画像を用意する方法」のメモをご覧下さい。

==
関連ページ:
    ▼要素の背景を半透明にする
    ▼CSSカスタマイズ
    ▼制作メモ
    > ▼要素を移動させる
    半透明後の画像を表示する
    CSSで透明度を指定する。opacity
    Fireworks - 画像を半透明にする

このブログの背景イラストについて - お知らせなど

お知らせなど
このブログの背景イラストは、pacoさんの「赫」。ピアプロからお借りしました。
トップページの右上に座っている居眠りミクさんは、猫牧場カンパニーが配布しているブログパーツです。


o pacoさんのアトリエはこちらです。▽http://piapro.jp/paco
   + 「赫」の場所は、▽http://piapro.jp/t/2Hoi
      + 登場人物は初音ミクです。
   + 上記ページから、pacoさんの個人サイト、そしてmixiに進む事も出来ます。
      + イラストを気に入った方は、pacoさんにメッセージすると、きっと喜んでくれます。
      + イラストをお借りした時には、「ありがとうごさいます」報告をすると喜んでくれます。

o トップページの居眠りミクさんは、猫牧場カンパニーが配布しているブログパーツです。
   + 詳しくは、「Bloggerのサイドバーに、ミク時計(Flashファイル)を置く方法


==
関連ページ:
    ▼お知らせなど
    ▼目次
    > to_dkのzoome日記ご覧の方へ