プロフィール.

はっさく

Author:はっさく メモ

カレンダー.

カテゴリー.

  • SDR(64)
  • FZ6(21)
  • Udon(78)
  • etc(44)
  • Enjoy(94)
  • Entertainment(136)
  • Gadget(27)
  • Mac(18)
  • Personal(9)
  • motoGP(9)
  • 未分類(0)
  • FC2(39)
  • FC2 プラグイン・サポート(14)
  • お引越しツール20080312(本当は未分類)(3)
  • ブログ(20080312インポート使用)(3)
  • 検索結果(0)

サブカテゴリー.

最近のコメント.

リンク.

携帯は こちらから.

QRコード
メールで友達に教える
(携帯ブラウザで開きなおすにも....)
上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。
fc2 icon


ぼくのfc2テンプレートカスタマイズ手順を紹介します。


css調整手順
1.テンプレートを「複製」してバックアップをとる。
2.めぼしいセレクタ(※1)を見つけて、目印 をcssに追記しプレビュー表示で確認する。
  目印の例)border:1px solid red;
3.調整するセレクタを特定できれば、プロパティやその値(※2)を調整する。

body{background-color:black;}
※1:cssにて、スタイルを適用する対象を選択する記述。上の例の body。参考:基本となるセレクタ
※2:cssにて、{ }で囲まれているスタイルの内容の記述。上の例のbackground-colorがプロパティ、blackが値。さらに詳しくは、セレクタ・プロパティ・値


セレクタを探すには、ツールが便利です。
FireBug@Firefox
FireBugをIE,Operaで使用する「FireBug Lite」
Safariの開発メニュー

cssは競合が発生すると、どのセレクタが適用されているか なんて、手に負えません。ツールのお世話になりましょう。
もしツールのインストールができないなら、幣作の共有プラグイン「テンプレート構造解析」が手助けになるかもしれません。


しばらくカスタマイズしていると、新たな問題が発生します。
特定のブラウザ/特定のページで、想定外の表示になっていることに気づきます。しかも、いつからおかしくなったのか、見当がつかないことも多々あります。
そんなときは、テンプレートのバックアップを用いて修正します。

テンプレートの問題究明手順
1.バックアップしておいたテンプレートに戻して、問題のないテンプレートと問題のあるテンプレートの境界を特定する。
2.問題のないテンプレートと問題のあるテンプレートの違いを調べて、問題のコードを特定する。
3.「css調整手順」で修正する。

テンプレートの比較には、ファイル比較ツールが便利です。
テキスト比較(windows)@vector


最後に、もう1つ。
テンプレートを複製していると管理画面がいっぱいになりますよね。
削除して整理したくなりますが、大事な履歴です。テンプレートの問題究明のためにも残しておきたい。

そこで、「プラグインもバックアップしようよ」にて、PCへ保存できるFirefox専用ブックマークレットを用意しました(オリジナルは、sugさんの「テンプレ・ショット」で、それを新管理画面に対応させました)。
十分に古いものをPCに保存して、管理画面から削除すれば、スッキリですよ。
スポンサーサイト
Mac icon
公開したばかりですが...またも、うっかりミスが発覚!!

一部表記の修正(タブ→タグ)と、
ブックマークレットを追加したバージョンを申請しました。

  thumbnail.jpg

先行して、追加したブックマークレットを公開します。

↓のリンクはブックマークレットです。
div明示化
table明示化
th明示化
td明示化

タグや色は、コードの最後の部分で変更できます。<p><span><form>とか必要なものを追加ください。
...explicate('div','red');})();...

Mac icon
先日、コード公開した「テンプレートの構造を調べる」は、シンプルにタグボタンのみにして、公開申請しました。名称は、「テンプレート構造解析」です。

しばらくすると、公開されるでしょう。

  thumbnail.jpg

適用するとレイアウトが崩れちゃうけど、カスタマイズしたいコンテンツと、それを囲むタグ、タグのid名,class名がわかります。

使い方) 通常は、非表示にしておきます。
テンプレートのカスタマイズ時に、本プラグインをプレビューして表示します。
タグ名ボタンを押して、タグの枠が表示されます。idやclassが指定されていれば、それも表示します。
消すことはできないので、もう一度プレビューからやり直してください。


実は、プラグインをDLしなくても、プレビューで利用できます...w 気軽にお試し下さい。



上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。