Dreamweaverのテンプレートを使ったときのHTML5文字化け

0

Dreamweaver CS5のテンプレート機能を使って、HTML5のコーディングをしていると、テンプレートから作られたページが文字化けするという問題が起きました。

条件

  • Dreamweaver CS5/CS4
  • HTML5コーディング
  • UTF-8

HTML5では文字エンコーディングの指定は、
<meta charset=”UTF-8″ />
と非常にシンプルに書くのですがどうやらこれをDreamweaverは理解せず、派生したページのファイル文字コードをShift-JISに変更して保存するため文字化けを起こすようでした。

文字化けしたしたファイルをTextEditorで開いてUTFに保存しなおすと治りますが、これは毎回やることは出来ないので、Dreamweaverの初期設定を変更したりもしたのですが、ダメでした。

<meta http-equiv=”Content-Type” content=”text/html; charset=UTF-8″ />
とHTML4で記述すると大丈夫なのですが、これはいただけない・・・

調べるとこんな方法があるようです。

<!--TemplateBeginIf cond="0" -->
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<!--TemplateEndIf -->
<meta charset="utf-8" />

<meta http-equiv=”Content-Type” content=”text/html; charset=UTF-8″ />の記述はするものの、各ページではTemplate Ifを使い非表示にします。

なお、<meta http-equiv=”Content-Type” content=”text/html; charset=UTF-8″ />と<meta charset=”utf-8″ />の順番を逆にすると、テンプレートを修正しても、派生したページに反映されない時があるので、必ず上記の順番で書きましょう。

CS5.5ではこのバグは修正されているようです。

気になるAPI

0

画像処理

顔認識 face.com API

http://developers.face.com/

写真から顔を認識。ベータ版(2011年8月30日現在)
利用例:ロンドンの暴動時に監視カメラに映った写真をFlickerにアップ。それをface.comAPIにかけて割り出した。

http://developers.face.com/

カラーパターン登録 kuler

http://kuler.adobe.com/

自分で気に入ってるカラーパターン、使用率を登録できる。

Fireworksでのテキスト両端合わせ

0

Photoshopには標準で付いてるのにFireworksにはない、テキスト両端合わせ(行末のみ左合わせ)
Fireworks標準の両端合わせは、すべての行が両端合わせになり、もしかして最後の行だけ選択、左合わせにすればいけるかと思ったが、文字の選択に関わらずテキストオブジェクト全体の行合わせが変わってしまいました。
この機能についてはあきらめていたのですが、たまたま出来ました。

やり方はPhotoshopで「テキスト両端合わせ(行末のみ左合わせ)」のテキストを作ってすべての文字選択。

Fireworksに移ってテキストボックスを作りコピー。これだけで出来ました。


書体やサイズの変更しても両端合わせは維持されて、新規に文字を入力したり、そのテキストボックスにテキストエディタなどから文書をコピーしても維持されていました。
毎度Photoshopを立ち上げるのも面倒なので、このテキストボックスがあるファイルを保存してライブラリにしました。

windowsでフォルダの削除

0

windowsで特定のフォルダやファイルをゴミ箱に移動しようとすると「指定されたパスが見つかりません」等のエラーが出て、削除できない時があります。

その場合、スタートメニューからコマンドプロンプトを立ち上げ

cd ¥
del "ファイルのパス"

で削除されます。ファイルのパスはdel(半角スペース)と入力したあとのあたりにファイルを直接ドラッグすれば、”###”とパスが自動入力されます。

削除したいものがフォルダの場合

cd ¥
rd /s "フォルダのパス"

としてください。

html5+css3 標準head記述

0

html5+CSS3で標準的に使用できるテンプレートを作っているのだけれども、加えた方がいいタグや、間違ってるタグなどあれば教えてください。
CMSでつくるならlinkでprevとかの設定も入れたほうがいいかもしれないけど、今回は手作業でページを作る場合を想定しているのであまり細かいのは省きます。

サイトタイトルやURLはphp使って記述したほうが汎用性が高いかなぁ。

<!DOCTYPE html>
<html lang=”ja”>
<head>
<meta charset=”utf-8″ />
<title>サイトタイトル</title>
<meta name=”description” content=”サイト説明文” />
<meta name=”keywords” content=”キーワード,キーワード” />

<!– Open Graph Tags –>
<meta property=”og:title” content=”ページ名(サイトタイトル)” />
<meta property=”og:type” content=”website” />
<meta property=”og:url” content=”サイトURL” />
<meta property=”og:image” content=”サイトサムネイルIMG URL” />
<meta property=”og:site_name” content=”サイトタイトル※設定しなくてもよい” />

<!– style sheet –>
<link rel=”stylesheet” href=”/_css/common/import.css”>

<!– link –>
<link rel=”shortcut icon” href=”/favicon.ico”>
<link rel=”canonical” href=”共通させるURL”/>
<link rel=”alternate” type=”application/rss+xml” title=”RSS” href=”RSSのURLl” />

<!– java script –>
<!–[if lt IE 9]><script src=”http://html5shiv.googlecode.com/svn/trunk/html5.js”></script><![endif]–>
<script src=”http://www.google.com/jsapi”></script>
<script type=”text/javascript”>google.load(“jquery”, “1.3″);</script>

</head>

Twitterのつぶやきを取得・表示

0

Twitterのつぶやきを取得して、自分のサイトに表示。
検索して、XMLの取得、パースして、タグを出力という行程です。
※要PHP5

<?php
    //***は検索キーワードやユーザー名、#タグは#の代わりに%23を入力
    $xml = simplexml_load_file("http://search.twitter.com/search.atom?q=***");
    
    foreach ($xml->entry as $entry) {
        
        $title = $entry->title;            // つぶやき取得
        $publish = $entry->published;    // つぶやき日付取得
        $name = $entry->author->name;    // つぶやいた人取得
        $uri = $entry->author->uri;        // つぶやいた人のプロフィールURL
        
        // tweetの表示
        echo '<hr>'.$title.'<br>'.date('Y/m/d H:i:s', strtotime($publish)).' - <a href="'.$uri.'">'.$name.'</a>';
        
    }
?>

カスタムフィールドテンプレート

0

[Plan]
type = text
size = 35
label = Where are you going to go?

[Plan]
type = textfield
size = 35
hideKey = true

[Favorite Fruits]
type = checkbox
value = apple # orange # banana # grape
default = orange # grape

[Miles Walked]
type = radio
value = 0-9 # 10-19 # 20+
default = 10-19
clearButton = true

[Temper Level]
type = select
value = High # Medium # Low
default = Low

[Hidden Thought]
type = textarea
rows = 4
cols = 40
tinyMCE = true
htmlEditor = true
mediaButton = true

[File Upload]
type = file

.htaccessでのリダイレクト

0

アクセス先:/old_dir/
転送先:http://w3g.jp/new_dir/

Redirect permanent /old_dir/ http://w3g.jp/new_dir/

アクセス先:拡張子がhtmlのファイル
転送先:同名のファイルで拡張子を.phpに変更

RedirectMatch permanent (.*)¥.html$ http://w3g.jp$1.php
.htaccess作成に便利なサイト
.htaccessEditor:http://www.htaccesseditor.com/
使い方は必要な項目にチェック、記入してページ下部に出てくるコードをコピーするだけ。
※サーバーによって.htaccessそのものが使えない、もしくは一部使用できないコードがあるなど

MySQL 文字列置換

0

update テーブル名 set カラム名 = replace(カラム名,’置換前文字列’,'置換後文字列’);

データベース名:movabletype
テーブル名:mt_entry
カラム名:entry_authored_on

update mt_entry set entry_authored_on = replace(entry_authored_on,’0000-00-00 00:00:00′,’2011-03-31 00:00:00′);

サーバー(主にデータベース)移行のmemo

0

データベースを保存する。
1)telnetでアクセス。
2)保存先のディレクトリに移動

cd ###/####/mysql

3)データベースの保存

mysqldump --user=ユーザー名 --password=パスワード mt4(データベース名) > mt4.sql(保存ファイル名)

4)FTP等でmt4.sqlをダウンロード
5)テキストエディタでmt4.sqlを開いて、サーバー名等を一括変換して保存(mt4_new.sql)
6)変換したmt4_new.sqlを新サーバーにFTPでアップ
7)新サーバーにtelnetでアクセス
8)保存先のディレクトリに移動

cd ###/####/mysql

9)mt4_new.sqlを新サーバーに展開

mysql -u ユーザー名 -pパスワード mt4_new(データベース名) < mt4_new.sql(保存ファイル名)

その他
■viEditorで変換

%s;/var/www/###;/home/httpd/$$$$;g

■CPIサーバー(マネージドプラン)のmysqlコマンドパス

MySQL4

/usr/local/mysql/bin/mysqldump
/usr/local/mysql/bin/mysql

MySQL5

/usr/local/mysql5/bin/mysqldump
/usr/local/mysql5/bin/mysql
Go to Top