11月2011

みんなに迷惑かけてソーシャル!

ブログとともに、見よう見まねではじめた、ソーシャルです。TwitterとFaceBook、よくわからないのに、とりあえず、クリック。とビールなみに、考えず、です。見えないところで、がんがん迷惑かけてるんだろうなーと思いながら、心の中で、すんません、すんません、といってるので、どうか許してください。

となると、やっぱり、自分のサイトとかブログにあのボタン、設置したいなぁということになりました。

ブログ・サイトに貼る主要ソーシャルサービスのボタンソースジェネレータを教えてもらったので、さっそくトライです。

ここのサイトのジェネレーターを使うと、全自動でソーシャルのボタンが作れる!ということで、TwitterのツイートするボタンとFaceBookのいいね!ボタンを設置です。

まず、静的なサイトのほうは、自分のサイトのURLを入れて、サイト名入れて、「これでつくる」をクリックするだけ。生成されたコードをコピーして、自分のサイトのHTMLにペトっと貼り付けます。適宜、クラスつけたりして、スタイルつけてあげれば、OKじゃないでしょうか。さっそくボタンつけたHTMLをアップロードしてから、自分でツイートとか、いいね!を押してみました。おお、つぶやいちゃったよ、自分のサイト。めちゃくちゃ恥ずかしいので、すぐにツイート削除しちゃいました。でも、きっと、思いもよらず、流れちゃって、「なんだ、こっりゃ」って思ってる方、いるだろなぁ。すいません。すみません。それから、いいね!を押すと、自分のウォールに載ってました。なんか、恥ずかしい。思わず、投稿は削除しました。って、恥ずかしいなら、なんでわざわざ、いいね!ボタンを設置したのやら。

それからやっぱり、ブログもってことで、Word Press用のとこもチェックです。今度は、URLもサイト名もいれずにOKです。要するに、変数で読ませてくれるってことですね?ここで吐き出されたコードを、表示させたいPHPファイルに貼り付けて、OKです。たぶん。ためしに、ツイートするをクリックすると、そのページごとにリンクするURLが違って吐き出されてるので、いいと思います。たぶん。

Word PressもTwitterもFaceBookも、どれもよくわかってないのに、それの組み合わせメニューなんか、はじめちゃったから、はっきり言って、どきどきです。たぶん。の出現頻度も最高です。たぶん。ということで、ほんと、勉強しなきゃ、まずいじゃん、と青くなったり、赤くなったりの見習いでした。これからも、ご指導おねがいします・・・。

Dream Weaverで一括置換!

Dream Weaverでたくさんのページを作るとき、テンプレートやライブラリ機能を使うと、ラクラクにできます。不要なソースが書き込まれますが、それは、「マークアップを省略して書き出し」を使えば、取り去ることができます・・・。あれ、できない。テンプレートのタグについては取り去ってくれますが、ライブラリのタグを取ってくれない!サイト単位で一括してドリ様タグをとるには「マークアップを省略して書き出し」ですが、これではライブラリはとれないです。ドキュメントごとにとりのぞく「XHTMLのクリーンアップ」を使えばOKですが、これだと一つ一つのファイルごとにやらなきゃならないので、テンプレートで楽チンというありがたみが減ってしまいます。残るは、正規表現ですが、これは、見習い、逃げ出します。すたこら、さっさ、さっさ・・・。(いつかね。いつかね、いつかね・・・)

ということで、いっそのこと、テンプレートもライブラリもなしでどうだ!ということに相成ります。普段は、最初に作ったHTMLからコピーして作っていけば、テンプレートからつくるのとそんなに手間に違いはありません。問題は、共通部分に修正があったときです。

こういうときは、置換です。ワードでも、ドリ様でも、CTRL+Fで一発です。でも、ファイルを開いてないとだめと思ってたのですが、ドリ様の場合、フォルダ単位とか、サイト単位とかを指定できて、わざわざファイルを開く必要がないんです!すごー。CTRL+Fで「検索および置換」ダイアログを出したら、「検索対象」をフォルダにして、目的のフォルダを選びます。そして、「検索」を「ソースコード」にすればOKです。そして、たとえばひとつナビのメニューを増やしたければ、その前後のソースをコピペして、「検索」のところに貼り付け、「置換」のところに、できあがり希望のコードを書いてやればいいのです。

ボタンが3このところを4つにしたいのであれば、


<ul id="linklist">
<li><img src="btn01.gif" width="116" height="46" alt="" /></li>
<li><img src="btn02.gif" width="116" height="46" alt="" /></li>
<li><img src="btn03.gif" width="116" height="46" alt="" /></li>
</ul>

の部分をコピーして、「検索」に貼り付け


<ul id="linklist">
<li><img src="btn01.gif" width="116" height="46" alt="" /></li>
<li><img src="btn02.gif" width="116" height="46" alt="" /></li>
<li><img src="btn03.gif" width="116" height="46" alt="" /></li>
<li><img src="btn04.gif" width="116" height="46" alt="" /></li>
</ul>

と「置換」のところに書き込んで、「すべて置換」をクリックするだけです。ただし、これ、戻れないんです。めちゃくちゃこわいですぅ。ということで、一回、フォルダをコピーとってから、やったほうがいいように思います。絶対。

Dream Weaverでテンプレートのネスト

たくさんのページからなるサイトを作るとき、Dream Weaverだと、テンプレートって手があります。同じ部分はまとめて管理で、コンテンツ部分のページごとに内容が違うところだけ、それぞれ作ればOKで、ラクラクです。テンプレート使っておけば、あとからテンプレート部分が変更になっても、テンプレートを直せば、それまでそのテンプレートから作ったページも一緒に直してくれます。たとえば、見切り発車でサイトを作りはじめたので、がんがんグローバルナビのボタンの名前が変わるというときも、グローバルナビの部分をテンプレートにしておけば、OKです。

ネストされたテンプレート

ネストされたテンプレート

このテンプレート、ネスト(入れ子)もできます。はじめに、大枠とかグローバルナビの部分をテンプレートにしておいて、その中の一部のページではサブナビをつけたいというとき、最初のテンプレートの中に、入れ子にしてテンプレートを作ることができます。こうすると、最終段階でグローバルナビが変更になっても、サブナビのために作ったテンプレートのほうから作ったページも一緒に変更してくれるので、ラクラクラクラクと、楽が行列してくれます。

編集可能領域が2つ

編集可能領域が2つ

ところが、2番目の例のように、一つ目のテンプレートでの編集可能領域が2つあった場合、ネストされたテンプレートでは、ええーという動きをするのがあります。この場合、入れ子になった編集可能領域のみ、個々のページで違う内容にしたいのに、「編集可能領域2」の部分を、「ページごとにかえない部分」にすることができないのです。編集可能領域2に、特定のページ群には、テンプレート的に同じ内容を入れておきたい、ということが、できません。たとえば、趣味のクラブのサイトを作って、グローバルナビには、クラブ員紹介、活動案内、地図、など一般的な内容のボタンを作って、その中のクラブ員紹介のページ群には、サブナビとして、クラブ員一人ひとりの名前を書いて、個人の紹介ページを作るとします。サブナビを、編集可能領域1の中に入れておけばいいのですが、編集可能領域2に入れてしまうと、もう、そこはテンプレート化することができないのです。

こんなのが、なんでできないんだろう、と一生懸命、グーグル先生に聞いてみたのですが、どうも、ムリなようです。こういう場合は、ライブラリを使うしかないのでしょうか。どなたか、「教えて!ドリさま質問箱」ですぅと、泣いてすがる見習いです。

追加 果たして、これがイイ手なのかわかりませんが、ひとつ手を考えました。入れ子のテンプレートを作るとき、編集可能領域2の部分の一番最後の部分に空っぽの編集可能領域を入れるのです。すると、「EditRegion5」のように、編集可能領域の名前のみが自動挿入されます。これだけを手動で消せば、ネストしたときに、編集可能領域2を、編集不可能な部分にすることができます。