SIRIUS(シリウス)でスマホ表示時、吹き出し画像をPC表示と同じく左(右)寄せにする方法【レスポンシブテンプレート限定】

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

新サイトのご紹介

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

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

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

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

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

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

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

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

スマホ表示時、吹き出し画像をPC表示と同じく左(右)寄せにする方法【レスポンシブテンプレート限定】

サンプル画像

 

申し訳ございません。
この記事の全文は当サイトからのシリウス購入者のみ閲覧可能となっております。

この記事はレスポンシブテンプレート限定の内容です。

SIRIUS(シリウス)には
1クリックで吹き出しを表示できる機能が備わってます。

 

こんな↓感じですね。

 

キャプチャ画像

 

通常のSIRIUS(シリウス)サイトならPCでもスマホでも上図のように
画像とテキストが横並びで表示されますね。

 

ところがレスポンシブテンプレートだと、スマホで見た時は
画像がテキストの上に来てしまうんです。

 

こんな↓感じです。

 

キャプチャ画像

 

これって、、、吹き出しっぽく見えないような。。。

 

それに会話の数が多くなってくるとどっちの会話なんだか
ちょっとわかりにくくなると思うのですよ。

 

これはSIRIUSの便利機能(視認性を高めるため画像の中央表示)のせいなんですが、
吹き出し利用時はPCと同じような感じで表示させた方が
サイト訪問者もわかりやすいと思うのです。

 

というわけで、スマホで見た時もこちら↓のように、
吹き出しっぽく表示させるやり方をご紹介します。

(レスポンシブテンプレート限定の話ですよ)

 

キャプチャ画像

 

申し訳ございません。
この記事の全文は当サイトからのシリウス購入者のみ閲覧可能となっております。


てっぺん