SIRIUS(シリウス)レスポンシブデザインテンプレート専用Tips記事一覧

Tips_機能の拡張 Tips_プチ裏ワザ Tips_iPhone Tips_その他

新サイトのご紹介

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

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

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

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

これに伴い、【新】SIRIUSテンプレートに対応した『SIRIUSでホームページ作成』サイトを新規公開しました。

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

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

※当サイトの更新ストップにより、一部の記事は自動的に新サイトの同記事に自動転送されます。

レスポンシブデザインテンプレート専用Tips一覧

ここでは私が実践して確認済みのシリウスお役立ちネタを公開してます。

 

一部、購入者のみ閲覧可能なネタもあります。ご了承ください。
(サムネール画像の「お役立ちネタ」という文字がになっています)

表示機器の横幅に応じて画像を自動で切り替える

サムネール画像

PCでは問題なく表示された画像もスマホで見ると小っちゃすぎてよくわからない、そんな時はスマホ用に別途用意した画像を自動表示させてあげましょう。

続きはこちらイメージ画像

スマホ表示時、吹き出し画像をPC表示と同じく左(右)寄せにする方法

サムネール画像

シリウスの吹き出しをスマホで見ると画像がテキストの上に来てしまい吹き出しがわかりにくいので、PC表示と同じく左(右)寄せにする方法をご紹介します。

続きはこちらイメージ画像

iPhoneサイトでPC表示を可能にする切り替えボタンを実装する

サムネール画像

サイトによってはスマホでの閲覧時にもPCと同じレイアウトで見せたいときもあるでしょう。レスポンシブテンプレートならどちらのレイアウトでも表示ができるようになります。

続きはこちらイメージ画像

レスポンシブテンプレートでiPhoneサイト同時生成機能の共存について

サムネール画像

レスポンシブテンプレートなら「iPhoneサイト用同時生成機能」は必要ないハズなんですがなぜかその機能も使えるようになっています。その使い分けをご説明します。

続きはこちらイメージ画像

レスポンシブテンプレートで「改行の最適化」を実現する方法

サムネール画像

シリウスのレスポンシブテンプレートではそのままだとiPhoneサイト用の「改行の最適化」機能が使えませんが、簡単なコードでこの問題をクリアできます。

続きはこちらイメージ画像


てっぺん