SIRIUS(シリウス)のデザインモード

Tips_機能の拡張 Tips_プチ裏ワザ Tips_iPhone Tips_その他 購入者特典 購入者専用ページ

新サイトのご紹介

SIRIUSの大型バージョンアップ(ver1.5)によって、システム内部に様々な改良が加えられました。

それによって当サイトでご紹介している独自の機能拡張の一部が【新】テンプレートに標準で搭載されるようにもなってます。

反対に大型バージョンアップによって、これまでご紹介してきたTipsの中にはうまく作動しないものもあったりします。

よって今後このサイトの更新はストップすることにしました。
(サイトはしばらくは残しておきます)

これに伴い、新テンプレートに対応した新しい『SIRIUSの賢い使い方』サイトを公開しました。

さらに【新】SIRIUSテンプレートをベースにしたカスタムテンプレート【Volar】も公開中です。(※SIRIUS購入の特典になります)

【Volar】はこれまで私がご紹介してきたTipsが最初から組み込まれたカスタムテンプレートであり、当サイトではまだご紹介してない新機能も追加搭載してます。

新サイトの方もよろしくお願いします→SIRIUSでウェブサイト作成~ホームページ使いこなしのワザ~

※当サイトで紹介しているSIRIUS小技は順次新サイトに移植の予定です。

デザインモード

サンプル画像

 

『デザインモード』についてご説明しましょう。

 

これまでもシリウスは、もちろんHTMLタグなど気にせず、
ブログ感覚ですらすらと記事を作成することはできてたんです。

 

そうはいっても例えば「太字」などの文字装飾などを施すと
どうしてもタグがずらずらっと表示されてしまうことに変わりはありません。

 

結局のところ、見た目はHTMLタグのオンパレードですから
HTMLに詳しくない人にとっては(そうでない人にも)
ちょっと見づらい感があったことは事実です。(-_-;)

(もちろんプレビュー機能があるおかげでブラウザでの確認はできますが、ひと手間かかってしまうのが難点でした)

 

これが「デザインモード」が搭載されたことで、
太字の設定をしたら実際に太字になった状態の画面を見ながら
編集が続けられるようになったんです。

 

これは画期的なアップデートですよ。

 

と、ここまで誉めておいてこんなことを言うのもなんですが、便利だからといってデザインモードのみでの編集&修正作業を繰り返していると、場合によっては無駄なHTMLコードが増えすぎて結果的にサイトが重くなってしまうこともありえます。

そのためデザインモードに頼りきるのではなく、時々はHTML編集画面にも目も通してコードを確認するクセをつけておくといいですよ。

実践上のHTMLの勉強にもなるので作業の覚えが早くなります。

 

では実際にデザインモードをご紹介していきます。

 

こちら↓が通常の編集(テキストモード)画面とデザインモード時の比較です。

 

通常編集(テキストモード)画面(これまでの編集画面)では、
背景色や文字色の装飾を設定しているタグのせいで
慣れない人にはちょっと見づらいかもしれませんね。

 

キャプチャ画像

 

実際にデザインモード上で作業をしてみました。

 

下の画像の赤文字の『サンプルテキスト』という文の
フォントサイズを大きくしてみます。

 

キャプチャ画像

 

範囲選択してフォントサイズを選びます。

 

キャプチャ画像

 

ブラウザを起動しなくても実際に大きくなったのが確認できます。

 

キャプチャ画像

 

テキストモードに切り替えれば通常の編集画面に戻すこともできます。

 

キャプチャ画像

 

ただしこの段階ではまだ元の編集画面には反映されてないので、
必ず「OK」ボタンをクリックして変更を確定させましょう。

 

キャプチャ画像

 

残念ながら現時点では、
ランキングやポイントの挿入などには対応してないようです。

 

また完全にブラウザ上での表示を再現できるわけではないので、
プレビューでの最終確認は必ずやっておきましょう。

 

購入ページへ


てっぺん