シリウス 吹き出しサイズ調整 右寄せ左寄せ方法
スポンサーリンク
どうもミナミです。
最近シリウスをいじっています。
シリウス自体は随分前に購入していたのですが、中々触る気分にならなくて、最近になってようやく触り始めた所です。
今日は、そんなシリウス初心者の僕がつまずいた部分なのですが、調べ方が下手なのか、ググっても出てこないんです。
なので、自分のためにも記事にしておこうと思いました。
また、今後シリウスを新たに購入して初心者になる人にも、お役に立てばと思います。
吹き出し機能
シリウスには簡単に記事の中に吹き出しを入れる事が出来る機能が付いています。
作成方法ですが、装飾ボタンの中のボックス横の▼をクリックして、「吹き出し」を選択します。
吹き出しの種類を選びます。いくつかあるのですが、ここでは見えやすい吹き出し7（青色太線）を選択します。
吹き出しの向き・角丸はそのままに、画像ファイルを「参照」から選択します。
自分の画像を使う場合は、「新規追加」からシリウスの画像ライブラリに追加すれば使うことが出来ます。
画像を左右どちらに表示させるかを選択して、テキストを入れてOKを押します。
するとプレビュー通り、こんな感じに出来ます。
吹き出しサイズ調整
ではそろそろメインの操作方法を紹介します。
（あくまで僕がやった方法なのですが、綺麗に表示されたので、問題ないと思います。）
今日紹介する内容ですが、シリウスでデフォルトで吹き出しを使うとこんな感じになります。（女性の吹き出しは吹き出し8です）
僕が思ったのは、この部分がいらない。
こうしたいんです。
でも、吹き出しの設定画面ではそういう項目はありません。
シリウスの編集画面でもありません。
そしてグーグルでも出てきません（泣）
なので、CSSをいじります。
※CSSの編集は自己責任で行って下さい。
シリウスのメニューから編集タブを開き、スタイルシートを開きます。
そしてcommonstyles.cssを開き、吹き出しの設定部分を探します。
（バージョンで違う可能性がありますが、僕の持っているシリウスの場合、何もいじっていない状態で425行目から始まっていました。）
その中で、今回の例で行くと、吹き出し7と吹き出し8なので、「.balloon7 .b_body」と「.balloon8 .b_body」を探します。
そして、吹き出し7を左に使い、吹き出し8を右に使う場合、「.balloon7 .b_body」の中に「float:left;」、「.balloon8 .b_body」の中に「float:right;」を追記します。
←これを
←こうする
「保存」ボタンを押して完了です。
プレビューで見るとこうなっています。
ただ、お分かり頂けると思いますが、特定吹き出しだけで設定する方法となります。
また、この方法だと、吹き出し内のセリフが長くなるとこうなります。
文字数が多くなると限界まで吹き出しボックスが大きくなってしまい、吹き出しの始めの部分との接合がうまくいかなくなるんです。
その場合は、単純にMAXになる前に改行しましょう。
吹き出し内の文字の大きさ変更
最後に吹き出しの中の文字サイズの変更方法をご紹介します。
さっきと同じスタイルシートの吹き出しの設定箇所の一番最初部分。
font-sizeを変更します。
今回は13pxを16pxに変更してみます。
文字サイズが大きくなりました。
最後に
まだまだわからないことだらけですが、たくさんのサイトで紹介されているような手順は特に載せません。
ただ、初心者の僕が調べても出てこなかったような操作方法は、今後もシェアしていきたいと思っています。
上記のような吹き出しも簡単につくれて、僕のようなブログ超初心者でもキレイなページが作れるSIRIUS自体はかなり使えるツールと思います。
今、別で特化サイトを作っているのですが、それはSIRIUSで作っています。
最初は勉強することが多いですが、学んでいくとどんどん「このツールすごいな」と思えるツールです。
たくさんの方が使っているので、ネット上にもいっぱい操作説明をしているサイトがあるので、詰まった時も調べると大体出てきます。（今回は出てきませんでしたがｗ）
尚、シリウスは通常版と上位版があるんですが、上位版だとスマホサイトが同時に作れるんですよね。僕も上位版です。
まだ持ってない人は、よければ試してみて下さい。
以上、「シリウス 吹き出しサイズ調整 右寄せ左寄せ方法」でした。
