SalesForceの開発を通じて、初めてのウエブ開発、クラウドコンピューティングでつまづいたことをメモしていきます。誤りの指摘は大歓迎いたします。たぶんたくさんあるはずですwww。
2012年4月13日金曜日
複数の言語が含まれているデータをインポートする
ひとつのオブジェクトの中に、複数の言語が存在するデータをインポートする方法です。
例えば、何かの名称のマスターとして使用する場合に、日本語名、英語名、韓国名、中国語名のカラムがある場合のデータインポート方法です。
オブジェクトを作成し、名称を翻訳サイト等で変換しながら各項目に入力してみると、問題無く各言語が登録できます。
しかし、データローダを使用する場合はどうでしょうか?
ExcelでCSVを作成する場合、文字コードがShift-JISで保存されます。そのため、保存したCSVをメモ帳で開くと、韓国語や一部の中国語が文字化けしているのがわかります。
このファイルをデータローダに読み込ませても、文字は化けたままです。したがって、UTF-8に正しく変換されたCSVを用意する必要があります。
なんとかExcelのデータをUTF-8で保存できないかと調べたところ、Excel2007では「Web文書」で保存する時にオプションでUTF-8が選べることがわかりました。
以下、具体的な方法です。
「名前を付けて保存」ダイアログのツールメニューからWebオプションを選択します。
エンコードを「Unicode(UTF-8)」に設定します。
文書形式を「Webページ」で保存すると、UTF-8にエンコードされたデータが保存されます。
しかし、この文書はHTMLなので当然データローダにかけることはできません。また、ブラウザの画面をコピーしてメモ帳に貼り付けても、CSVにはなりません。
そこでExcelの計算式を利用して、カンマ区切りのデータを1セルに納めてしまいます。
再度「Webページ」で保存し、ブラウザで開きます。
文書全体を選択し、メモ帳に貼り付け、CSV形式で保存すると、データローダで読み込める多言語のCSVファイルになります。
多少面倒ではありますが、1件ずつ手打ちするよりは良いと思います。
2012年4月6日金曜日
VisualForceで jQuery Mobile を使用する。
SalesForceがMobileSDKと関連ドキュメントを続々リリースしているようなので、この先あまりニーズは無いかもしれませんが、VisualForce での jQuery Mobile を使用する場合のポイントです。
1.jQueryの取得
jQueryのホームページから、jQuery、jQueryMobileのリソースをダウンロードし、静的リソースに格納。
なお、CSSはThemeRollerを使うと便利ですが、このへんの使い方は割愛します。
2.VisualForcePageの作成
VisualForceでjQueryMobileを使用するには、VisualForce内にhead部とbody部を作成し、通常のjQueryMobileと同様のコードを書けば、問題無く動作します。
タグと静的リソースの参照は以下のようになります。
ポイント1
ポイント2
機器の縦横の向きを変更した場合に、自動的に表示幅を合わせるために、metaタグでviewportの設定をしています。jQueryMobileのサンプルでは、
なお、一応これでVisualForceの画面がモバイルサイトっぽくなりますが、あくまでこれは個別のページをjQueryMobileで表示しているに過ぎず、ログイン画面やホーム画面はPC用の画面のままということになります。
1.jQueryの取得
jQueryのホームページから、jQuery、jQueryMobileのリソースをダウンロードし、静的リソースに格納。
なお、CSSはThemeRollerを使うと便利ですが、このへんの使い方は割愛します。
2.VisualForcePageの作成
VisualForceでjQueryMobileを使用するには、VisualForce内にhead部とbody部を作成し、通常のjQueryMobileと同様のコードを書けば、問題無く動作します。
Visual Force Page |
ポイント1
<apex:page>
タグの"standardStylesheets"を"false"にすること。こうしないとページにSalesForceのスタイルシートが適用されてしまいます。ポイント2
機器の縦横の向きを変更した場合に、自動的に表示幅を合わせるために、metaタグでviewportの設定をしています。jQueryMobileのサンプルでは、
<meta name="viewport" content="width=device-width, initial-scale=1"/>
となっていますが、これだとiPhone,iPadではうまく動作しませんでした(横向きにしたときにサイズがオーバーする)。<meta name="viewport" content="width=device-width, minimum-scale=1, maximum-scale=1"/>
とすることで、正しく表示されるようになりました。なお、一応これでVisualForceの画面がモバイルサイトっぽくなりますが、あくまでこれは個別のページをjQueryMobileで表示しているに過ぎず、ログイン画面やホーム画面はPC用の画面のままということになります。
登録:
投稿 (Atom)