こんにちは、ステラです。先日メッセージを頂きました。
はじめまして。 ステラさんが書いた記事
【攻略ライブドアブログ】吹き出しチャットの作り方
を見て同じくライブドアブログでやってみましたが、スマホ版ではまったく表示されません。

やはりライブドアブログでは難しいのでしょうか。

やり方にコツなどありましたら教えてくださると嬉しいです。よろしくお願いします。
どうもpso2とは関係ない方みたいで、普通に吹き出しチャットをブログに実装したい方がメッセージを送って頂いたみたいです。

pso2の人しか読んでないと思ってましたね!

と言う事で、今回はこの問題を解決していきましょう!



まず吹き出しチャットがどういう物か という事なんですけれど、私のブログを読んでくださってる方は既に見て頂けてると思います。

ヤマトさん昨日の晩ご飯は何でしたか?

んーアザラシのステーキかな?


こういうのです。 デジャヴです。詳しくは前回の記事を読んでください。

ただ前回、これでスマホ版でも表示される!と言い切っていたのはいいのですけど、なんとページがまたがれると2ページ目以降表示されないという欠点に気がつきました。

となると、解決策は、吹き出しが出てくる度にcssファイル毎回読み込ませれば良い! という事になりますね。これでごり押しできましした。

それでは具体的にやり方を説明していきますね!

cssファイルを記事に読み込ませる

前回と違う部分がここです。

そうしたら、以下の文を、ブログ記事のhtmlタグで一番最初に入れます!
以下の分を、毎回吹き出しの最初に入れます!
<link  href="保存したcssファイルのアドレス" type="text/css" rel="stylesheet">
「保存したcssファイルのアドレス」の部分には、名前のままアドレスを入れてください。

これでスマホ版でも綺麗に表示されるようになります。

吹き出しチャットから普通の文章に変えるとき

<!--↓会話部分の最後にこれを必ず付け加えて↓-->
<div class="talk-end"></div>
もちろんこれも毎回最後に入れる事を忘れないように。じゃないと崩れます。

これを繰り返せば自由自在に吹き出しを使ってブログが書けると思います!

是非参考にして頂ければと思います。良かったら使ってくださいね!

余談ですが

シエスタブログでは隔週のラシエス・た!雑談回とたまに来る調査報告書のために、大量に吹き出し記事を作る必要があるので、毎回コードを手打ちしてられないんですよね。

サンプル

そこでこんなツールを作って利用しています。台詞打って追加していくと、htmlコードを自動で生成してくれるので、それをコピーするだけで良いという。非常に便利です。

ただこれ公開しようかとも思ったんですけど、吹き出しで使用する画像の登録とかの問題で無理!ってなりました。

欲しい方は個別対応させて頂きますので、是非直接連絡くださいー。居るかどうかはさておき()

ではここまで読んで頂きありがとうございましたー




サポーターズリンク投票よろしくお願いします!

PSO2サポーターズリンク

ファンタシースターオンライン2ランキング

にほんブログ村 ゲームブログ ファンタシースターへ

ファンタシースターオンライン2ゲーム・攻略ブログ・ランキング


次回も見てね!