Salesforceレイアウトの最近のブログ記事

←次のブログ        前のブログ→
こんにちは!

昨日は東京が大雪でした!みなさん転んだりはしてないですか?
今日は暖かいので雪も解けそうですね ♪

今日は保存したページをデプロイして、画面が上手に出来てるかチェック!!
まず、ログインをして「training」を開いてみましょう。

そして、デプロイボタンを押して、ページを確認してみます。
復習はこちら↓

 [テンプレート:親子オブジェクト登録2] 親子登録画面をデプロイ

出来上がりいいじゃないですかーー!!
でも、表の上にタイトルがない!あったほうが絶対いいので、ちょっともう一度編集してみよう。

skyeditor_0207_1.jpg
表示

そう、デプロイしてからも編集をすることが可能です。

さ、SkyEditor2のスタジオ画面に戻って・・・

コンポーネントのページブロックセクションを配置します。
列数は何列でもOK。
その中に何も入れなくていいのー??
と思ったところで、久々の同僚のかける君が登場!

「オブジェクトを配置しない場合ページブロックセクションはタイトルの代わりになるんだよ」

って教えてくれました。

ページブロックセクション名を「研修開催日程」にして、もう一度デプロイしてみます!

skyeditor_0207_4.jpg
表示

出来ましたー!
持ち物リストと表の間にタイトルを入れることが出来ました。

これでOK!

デプロイをしてからの流れはこちらから復習してみましょう。

● 【設定】デプロイ後に行うSalesforceの設定
● 【設定】Visualforceタブを作成してみよう

これで、研修の情報も見やすくなりましたね。

次は、自由レイアウトだっ☆
どうやら、自由レイアウトは背景画像とかが入れられたりするみたいだし
なんだか楽しそうー!

それでは、また♪
←次のブログ        前のブログ→
←次のブログ        前のブログ→

今日はこの間配置したパネルグリッドに、項目を並べていきたいと思います!

まず、SkyEditorにログインをして、「training」を開きます。

項目を配置していくために、「配置項目種別」の「テキスト[入力](ラベル無し)」を選択します。
これは、表の中に配置をしていくものなので、テキスト入力をしたいけれど、ラベル名は表示させたくない
って時に使うものだそうです。

主オブジェクト」の中から「開催日一日目」項目を配置します。

skyeditor_0203_1.jpg
表示

こんな感じで、斜線の所に「開催日一日目」をおきます。

skyeditor_0203_3.jpg
表示

この要領で、どんどん配置をしていきましょう!!
配置項目は以下です☆
skyeditor_0203_5.jpg

配置が完了したら、表の幅・高さなどを調節してみましょうー!
表の罫線の部分にマウスを合わせると、かわるみたい。

skyeditor_0203_6.jpg

出来上がりました!

そしたら、保存ボタンと、キャンセルボタンを配置します。

コンポーネントプロパティの「ボタン表示領域」というドロップダウンリストが上下になって
いればどちらかに配置しただけで、画面の上下両方に配置されます。

skyeditor_0203_7.jpg

あとは、今変更したプロパティのタイトルを「研修」に書き換えます!

これで完成!

デプロイとページを開いて確認するのはまた次に♪
上手に出来てるか仕上がりが楽しみですね(。^▽^。)

では、保存を押して、また☆
←次のブログ        前のブログ→
←次のブログ        前のブログ→

まだまだ寒い日が続きますねー
でも、この間天気予報で寒さが和らぐ兆しが見えてきましたって言ってました!
早く暖かくならないかなー☆

さぁ、今日はパネルグリッドに挑戦してみたいと思います!

まず、SkyEditorにログインをして、前回保存したページを開きます。
「training」でしたよね!

まず、コンポーネントのタブをクリックして、レイアウトの上から三番目、「パネルグリッド」を配置します。
skyeditor_0127_1.jpg
表示


するとこんな画面が出てきました。

skyeditor_0127_2.jpg


研修の項目はこれで、設定します!行数が6、列数が7。
パネルグリッドの最初に出てきた行と列の指定以外でも、追加が出来ますのでご安心を!

「OK」を押します。
すると私の想像していた表が出てきましたー!

次にこの「パネルグリッド」に自由テキストをおいていきます。
自由テキスト」はコンポーネントの「アイテム」にありました!

skyeditor_0127_4.jpg
表示

自由テキストを配置していきます。
skyeditor_0127_5.JPG
表示

そして自由テキストに、内容を入力していきます。

skyeditor_0127_7.jpg
表示

コンポーネントプロパティ」の「」に表示したい名前を入力し、
文字色をドロップダウンリストから選択するか、左のコードにHTMLのカラーコードを入力します。
今回は青と、太字にします。
文字サイズも、今日はこのままですが、自由に変えられます。
あとは、最後に文字の太さ。標準(Normal)か太く(Bold)を選択して完了!

あとは、左端に寄ってるのが気になるので、中央に寄せたいと思います。

skyeditor_0127_9.jpg
表示

これで、中央に寄せることが出来ました!

あとは同じ要領でどんどん入力していきます。

skyeditor_0127_11.jpg
表示

縦に日程を「1日目」・「2日目」・・・
横は「開催日」・「スタッフ集合時間」・「開始時間」・「終了時間」・「スタッフ終了時間」・「稼働時間
と、時間軸ごとに配置をしていきました。

ふぅ、これでパネルグリッド配置完了!
あとは、中身を配置するだけ。。。

でも、今日は疲れたからまた明日!!笑
のんびり、作成しますがお付き合い下さい♪♪

←次のブログ        前のブログ→
←次のブログ        前のブログ→
今日も寒いですねー!

私は、会社の人と週1で皇居を走っていたのを寒さの為サボっています!(笑)

ブログはサボらずに頑張りたいと思いまーす♪

さて、今日は昨日の続きから。
ログインをして、[開く]のボタンで昨日保存した画面を開きましょう!

まず、昨日作成した「研修の詳細」の下にもうひとつ[ページブロックセクション]を配置したいと思います。

コンポーネントの中にレイアウトを選べる場所があるみたいなので、そこから選択して・・・
あった!この、二番目のが[ページブロックセクション]ですね!

skyeditor_0121_1.jpg

配置すると何列にするか、聞かれました!3列にしようと思いまーす♪

skyeditor_0121_2.jpg

OKを押したら、さっそく項目を配置していきます。

skyeditor_0121_3.jpg

3列に配置できたー!・・・・・でも、3列でも少し多いから4列にしてみようかな!
チェックボックスなら横幅もそんなに取らないので、列を増やしてみようと思います。

[pageBlockSection2]の左上に[列追加]と[列削除]があるので、追加ボタンを押してみまーす。

skyeditor_0121_4.jpg

列が、右に出てきたので、そこにドンドコ項目を移動させます。
あとは、項目を好きな順番に移動させてー・・・。

skyeditor_0121_5.jpg

4列で配置できましたー!!

これで、一列に10項目くらいあったのが、半分の項目数で済みました!
そして、列ごとに分類も出来るのでとっても見やすくなりましたね♪

最後に[pageBlockSection2]のタイトルを「持ち物チェックリスト」に変更。

右側のコンポーネントプロパティタイトルで変更したら一旦終了ー!

また、保存をして。

来週はいよいよテーブルを作成!
パネルグリットって言うみたいだけど、私にも出来るかなー。

では、また☆
←次のブログ        前のブログ→
←次のブログ        前のブログ→
こんにちは!

最近インフルエンザが流行ってきていますね!みなさんは予防接種受けましたか?
早めに受けて対策しましょー!

さて、今日は早速Salesforceレイアウトで研修の画面を作成したいと思います。


まず、SkyEditorにログインをし、左上の新規ボタンを選択します。
レイアウトマネージャで「Salesforceレイアウト」を選択します。

レイアウト選択後、作業するオブジェクトをプルダウンから指定します。
今回は「研修」の画面をつくるので、研修を選択します。

ページ名は研修の画面なので「training」にしてみます。ページ名を設定したら、OKを押します。


こちらの画面から配置などをしていきます!

skyeditor_0120_1.jpg

さて、早速配置をしていきましょう!

まずは、一番初めに登録をしたい項目を並べたいので・・・
「研修名」と研修を行う「取引先」「参加人数」、「講師」「研修区分」
を配置したいと思います♪

まず、右上の[配置項目種別]は入力をしたい項目だから、テキスト[入力]にします!
そして、配置!

[ページブロックセクション]ってSalesforceのページレイアウトで項目を
配置するところのようなものらしいよ!

ただ、SkyEditorなら列数を増やせちゃう!って訳。

ってことで、ここに項目を置いていくみたいです!

「研修名」をドラッグ&ドロップで[pageBlockSection1]の中に配置します!

skyeditor_0120_2.jpg

おー!!

本当にマウスだけで、配置が出来ましたよ!どんどん行きましょう!

隣の列には一番上を空白で、下にオブジェクトを二つならべたいので、
空白スペースをおきたいと思います!

コンポーネントのタブをクリックして、一番下のアイテムの[空白スペース]を
ドラッグ&ドロップしてみます!

skyeditor_0120_3.jpg

その下に、「講師」「研修区分」の項目を配置します。

こんな感じに配置が出来ました☆

skyeditor_0120_4.jpg

次に、[pageBlockSection1]の名前を「研修の詳細」に変更したいと思います。

右側のコンポーネントプロパティタイトルで変更します。

skyeditor_0120_5.jpg

さぁ、一つ目のページブロックセクションが作り終わったので、
まずは一休み♪笑

保存をして、また明日やろーっと!

明日は沢山あるチェックボックスを3列に配置してみますー☆
←次のブログ        前のブログ→
←次のブログ        前のブログ→
さて!今日は早速Salesforceレイアウトで研修の画面を作ってみますっ!

が・・・・

研修の項目はすべてカスタムオブジェクトで作るので、
【設定】→【アプリケーションの設定】→【作成】→【オブジェクト】で、
カスタムオブジェクトを先に作成しておきましょう。

今回の研修の項目は、用意する用具の項目、「マーカー」だったり、「プロジェクター」だったり。
それはすべて、データ型がチェックボックス
表形式にしたいところは、開催日などは日付、参加人数などは数値、で作成していきます。

私が作ったすべてのカスタムオブジェクトの項目一覧はこちら

すべてのカスタム項目が作成できたら、SkyEditorで画面を作るステップに進めます。


私が今使ってる画面はというと・・・・
skyeditor_126_1.jpg

項目がたくさんあるんだけど、2列にしか表示できないのよねぇ。
あと、表形式にして見たいなーっていうものも項目がズラズラーっと並んでしまいます

やりたいことは、これを3列にして見やすく!あとは、表形式にしてスッキリと!

さぁ、明日からはSkyEditorにログインで画面を作成していきましょう!


※先輩からゆうなちゃんへのダメ出し
先輩 「ゆうなちゃんが作ったカスタム項目のAPI参照名はイケてないわね!デフォルト値使うと、
後で分かりにくいわよ。」
ゆうな 「はい、せんぱーい。今度から気を付けまーす。」
←次のブログ        前のブログ→

←次のブログ        前のブログ→
こんにちは!
私の会社は色々な研修があるので、準備をするものがそれぞれ違ったりして、大変!

Salesforceに入れて管理してるんだけど、入れる画面がすっごく長くて見づらいの。。。

なぜなら、Salesforceのページレイアウト横に二列までしか表示できないから。

列を増やしたり、テーブルとかが表示出来たら、スクロールを減らせて
すごく見やすくなるのになぁ。

なんか、話によると通常のレイアウトで出来ないことは、
「なんちゃらコード」とか沢山書かなきゃいけなかったみたいなんだけど...

SkyEditor2なら画面が色々アレンジできるらしいので、早速やってみたいと思います!

これで、研修のチェックもスムーズに出来るのでは!楽しみ楽しみ。

んー。でも、それは明日やります!笑

そういえば、SkyEditorのハンズオンセミナーっていうのがあるって知ってました?
第一回はもう受付終了してしまったみたいだけど・・・
第二回が2月にあるみたい!
SkyEditorについて講師と一緒に学べるみたいですよ♪

これは良いね!私も申込みしてみようかなぁ~☆
←次のブログ        前のブログ→

***このブログについて***

ゆうなちゃん

プログラム未経験のSalesforceシステム管理者ゆうなちゃんが、SkyEditor2ではじめての画面開発に挑戦するブログです。 SkyEditor2の使い勝手はさることながら、同僚たちの業務改善したいという気持ちでどこまで実現できるか、ゆうなちゃんの成長とともに見守ってください。



2011年6月

      1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30    

ウェブページ