カテゴリー別アーカイブ: dreamweaver

sublime text3をインストールしてみたけど、htmlのヘッダとかどうするんだろうって思っていた

どうするんだろうっておもっていたけどEmmetで勝手に書き出してくれるんですね。。。すごい。。。

やり方はすごい簡単で「!」を書いていつものEmmetのショートカットを押すだけ。

自分だとCtrl+E

どんどんDreamweaverから決別できている。
今のところドリのほうが凄い使いやすけど。

レスポンシブサイトでイメージマップ(imgmap)を利用するときにrwdImageMaps.jsを使うけど

jquery.rwdImageMaps.min.jsお世話になってみました。

これで後のレスポンシブサイトの大きな問題はTableだけなんじゃないかとか、そうじゃないとか。

ただ、こちらのJs利用する上で小さな落とし穴にはまりました。
レスポンシブコーディングをDreamweaver上で行っていると、プレビュー自体もレスポンシブに画像が伸びる。

自分がやりやすい環境で作業していると画像の本当のサイズじゃない状態になっていることが殆どですが、そこを意識せずにイメージマップを作成して上記Jsを利用すると、あれ!?!?ズレてるし!つかえねぇし!ってなる。

恐らくJsの仕組みとして本当の画像サイズに対して、自分で設定したイメージマップをがっちゃんこしちゃうのでプレビュー状態だと画像サイズが嘘×イメージマップはその見た目のまま正解として判断されるため。

なので面倒だけど、画像のサイズをとりあえず本当のサイズに指定した状態でイメージマップを作る必要がありそうです。

jqueryで親セレクタ(親要素)を指定する時に相対パス的な書き方だと面倒

今まであまり考えてこなかった問題。

頭の中で組んで、一発でコーディング出来る時はあまり問題になってこなかったけども、動きを検証しながらHTMLを加筆したりすると起きる問題。

ある指定したボタンなど(.btn)をクリックしたら、その親要素(.parent)に.addを付ける的な。

<div class="parent">
<div class="block">
 <div class="btn">CLICK</div>
</div>
</div>

上記のようなサンプルだとしたら

$(".btn").parent().parent().addClass("add");

これでも動く。

でも、たとえば.blockの中にもう一つDIVを噛ませてしまうと、上記のコードでは.blockに対して.addがついてしまう。

なので、そういう場合は指定した要素の一番親要素という風な指定をしちゃえばOK

 

$(".btn").parents(".parent").addClass("add");もしくは
$(".btn").closest(".parent").addClass("add");

相対ルートパス的な考え方かな。

dreamweaver CC2014でデザインビューのフォントサイズがバカでかい

CC2014にアップデートしてから色々と使いづらい。

Photoshopの持っていないフォントを編集→Escでキャンセル
以前はデザインを保ったまま(持っていないフォントの見た目)だったのに、CC2014はフォントが変わってしまう。
のでCtrl+Zを毎回しないといけない。。

さて、本題に戻る。
CSSでノーマライズ的にh1~h6のフォントサイズを1rem指定しているのだが、そうするとデザインビューの文字サイズがとんでもないことになる。
これはバグなのか仕様なのか良く分からないが他の方も同様の言っている模様。
http://www.transbit.jp/note/tool/177.html

なので
①デザインビューを見捨てる
②とりあえずem指定にする

のどちらなのかなぁ。

①が有力だと思うけど。

ロリポップ×Dreamweaver でDreamweaver FTPが使えなくなった場合のとりあえずの措置。

いつからか急に繋がらないなー。へんなアラート出るなーと思っていたら案の定ロリポップの勝手な行動のせいでした。

SSL3.0の脆弱性対策なのは分かりましたが、他のレンタルサーバー会社は普通に使えるってことはどっちが正しいんだろうか。
今までのロリポップ的にはロリポを信じられない自分がいるが。

で、Adobe CCなら繋がるらしいけどCS6なあたしは以下の方法でとりあえずつなげられるとカスタマーより回答頂きました。

------------------------

この度はお問い合わせいただき、誠にありがとうございます。
カスタマーサービス ●● よりご案内いたします。

FTPの利用についてご不便をおかけしております。

ご連絡いただいた件につきまして、ロリポップ!では先日公開された
SSL3.0の脆弱性(POODLE)への対応としまして、2014年10月23日よりSSL3.0を廃止するためのメンテナンスを順次実施いたしております。

※下記ページでもご案内いたしておりますので、
併せてご確認いただけますと幸いでございます。

▽SSL 3.0(CVE-2014-3566)の脆弱性対応について
http://lolipop.jp/info/mainte/4531/

今回、SSL3.0を廃止した影響を受けまして、一部のFTPソフトにて
ロリポップ!のサーバーへの接続が行えていない可能性がございます。

Adobe Dreamweaver CS6及びCS6以前のバージョンについては、Adobe社での
サポートが終了しており、またセキュリティにかんするメンテナンスに
伴い暗号化された接続を行っていただけなくなっております。
取り急ぎの対応としましては、Dreamweaverの接続設定
【使用する接続】について
『FTP over SSL/TLS (明示的な暗号化)』を選択されているところを、
『FTP』へ変更いただくことでアップロードを行っていただくことは可能です。

ただし、この場合通信内容が暗号化されません。

また、今後のご利用については、Adobe Dreamweaverを最新のバージョンへ
更新いただくか、Adobe Dreamweaver以外のFTPソフトのご利用をご検討ください。

バージョンアップでの対応やAdobe Dreamweaver以外のFTPソフトのご利用が難しい場合は
Dreamweaver側の設定に「WebDAV」での接続設定を新規追加いただき「WebDAV」での
ご利用をお試しください。

使用する接続:WebDAV
URL:お客様のWebDAV URL
ユーザー名:お客様の『FTP・WebDAVアカウント』
パスワード:お客様の『FTP・WebDAVパスワード』

ご不便をおかけいたしますが、安全にロリポップ!をご利用いただくための対応に、
ご理解とご協力をいただきますようお願いいたします。

--------------------------

とのこと。

Dreamweaverのテンプレを上手く使うとサイトが組みやすいってことを今さら思う

Dreamweaverは使用しているが、あまりテンプレの使い方を理解していない。
でも今回の案件でログイン前とログイン後両方のhtmlが発生する可能性があったりとかで
条件分岐とかでパッと切り替えれたら嬉しいなーと思ったらやはりできるらしい。

パターンとしてはとりあえず以下を作成した。他にももちろんあるだろうけどそれはその時覚える。

①bodyにclassを付ける
これはよくある。トップだったらclass=”top”みたいな。

②トップページの時だけスライダーとかある
これもよくある。大体トップは色々やる。

③ページによってはフッターに入れるけど、場合によって入れないこともたまにある。
今回はサーチを入れたり入れなかったり。そりゃ検索終わって目的のページに到着したのに必要ない場合もある。

④ログインしたらAのパターンしてなかったらBのパターンのhtmlを表示
つまり条件分岐

⑤ナビにcurrentクラスつけたり

ではそれぞれのタグを

まず基本的にhead内の閉じタグの前に以下のように記載する
<!– TemplateParam name=”任意の名前” type=”textだったりbooleanだったり” value=”textの場合は任意の値が入ることに。boolearnのときはtrue or false” –>

①の場合
<!– TemplateParam name=”pageClass” type=”text” value=”” –>
</head>

<body class=”@@(pageClass)@@”>

 

②の場合(①の値を流用するってことね)

<!– TemplateBeginIf cond=”_document[‘pageClass’] == ‘top'” –>
topだったら表示したいhtml
<!– TemplateEndIf –>

 

③の場合(②と違い値の流用はせずにこのnameに対して真偽を決める)

<!– TemplateParam name=”search” type=”boolean” value=”true” –>
サーチのhtmlが入る
<!– TemplateEndIf –>

 

④の場合

<!– TemplateBeginMultipleIf –>
<!– TemplateBeginIfClause cond=”ログインしてる?” –>
ログインしていたらここを表示
<!– TemplateEndIfClause –>
<!– TemplateBeginIfClause cond=”true” –>
ログインしていなかったらここを表示
<!– TemplateEndIfClause –>
<!– TemplateEndMultipleIf –>


headの中は
<!– TemplateParam name=”nav01″ type=”boolean” value=”false” –>
コンテンツ部分は
<!– TemplateBeginIf cond=”nav01″ –>class=”current”<!– TemplateEndIf –>
的な

以上、備忘録。