※2012/2/15 新Twitter画面での改行を表示に対応。
Twitterの入力欄「いまどうしてる？」には改行を入力できるのですが、表示欄では改行が半角スペースとして表示されてしまいます。
このTwitterで入力した改行を、Operaのユーザースタイルシート設定により半角スペースではなく改行として表示する方法を解説します。
（※今回の解説で使用する環境は、Windows Vista + Opera 10）
Twitterで改行を表示するユーザースタイルシート設定方法
-
スタイルシートを用意します。
次の何れかの方法でスタイルシートを用意してください。
スタイルシートを選択 詳細 １．改行を表示したい 改行表示用のスタイルシート(usercss_twitter_linebreak.css NEW!! 2012/2/15)をダウンロードして下さい。
最もシンプル。単に改行を表示したいだけであれば、こちらで良いでしょう。２．改行込みのアスキーアートを表示したい アスキーアート表示用のスタイルシート(usercss_twitter_asciiart.css NEW!! 2012/2/15)をダウンロードして下さい。
・詳細は、「Twitterでアスキーアートを表示する方法」を参照してください。３．改行込みのスタイルシートを自作したい 次のクラス定義を含むスタイルシートを作成して下さい。
.js-tweet-text{white-space:pre-wrap!important;} Operaへ、ユーザースタイルシートの設定を行います。
メニューバーより、[ツール]-[設定]と選択し[設定]ダイアログを表示します。
[詳細設定]タブを表示し[コンテンツ]を選択すると次の画面が表示されます。
[スタイルオプション]ボタンをクリックし[スタイルオプション]ダイアログを表示します。
[ユーザースタイルシート]テキストエリアに１で用意したスタイルシートへのパスを設定し[OK]ボタンを押します。
Twitterへアクセスし改行の表示結果を確認します。
確認用にどうぞ→ http://twitter.com/illiorzilli
本サイトで取得しているTwitterアカウント、http://twitter.com/illiorzilli では、改行を含むアスキーアート(AA)を定期的につぶやいていますので表示してみてください。
Twitter上のAAと改行についてユーザーシート適用前と適用後の比較
ユーザースタイルシート設定前のTwitter上のAA
ユーザースタイルシート設定後のTwitter上のAA
この様にOperaにユーザースタイルシートを設定することで、Twitter上の改行を常に表示できるようになります。
Twitter上で改行を表示する方法は他にも幾つかの選択肢がありますので、以下のリンク先を合わせてご覧ください。
Twitterで改行を表示する方法のまとめ
- Twitterで入力した改行を表示する方法 ： 概要
- Twitterで入力した改行を表示する方法 ： Internet Explorer ユーザースタイルシート編
- Twitterで入力した改行を表示する方法 ： Firefox ユーザースタイルシート編
- Twitterで入力した改行を表示する方法 ： Google Chrome ユーザースタイルシート編
- Twitterで入力した改行を表示する方法 ： Safari ユーザースタイルシート編
- Twitterで入力した改行を表示する方法 ： Opera ユーザースタイルシート編
- Twitterで入力した改行を表示する方法 ： ブックマークレット編
- Twitterでアスキーアートを表示する方法
- TwitAAの使い方
更新履歴
- 2010/04/13 white-space:pre;をwhite-space:pre-wrap;に変更。（IEを除く）
- 2010/04/24「Twitterでアスキーアートを表示する方法」を追加。
- 2011/01/30 新Twitter画面で改行を表示できるよう対応。
- 2011/02/13 ユーザースタイルシートのリンク先変更。
- 2012/02/14 新Twitter画面での改行表示に対応。
- 2012/02/15 フォント設定を強制するため、スタイルシートに!important設定追加。
コメント / トラックバック7件