部長ナビのページはApple製品のレビューを中心としたブログです。ドラマ仕立ての長期連載も見てね!

「pre」タグで改行のないソースコード・ブックマークレットを紹介しよう!

https://farm6.static.flickr.com/5762/20919637280_707214c8c3.jpg

こんにちは。部長ナビ(@nabi_1080)です

紹介したTweetbot 4の「Safariで見ているページをTweetbot 4でツイートする」という神がかったブックマークレットですが、Tweetbot 3のモノはあったんですけど、それをそのまま使うとダメだったので、調べて、いじって、Tweetbot 4用にして紹介しました

すっかりTweetbot 4野郎の部長ナビ(@nabi_1080)です。ハマっております。Twitter。面白いね〜 で、gori.meさんがそうなんですけど、「過去記事でま

すると、多くの方から「iPhoneで見ているけど、コードが右にはみ出て、コピーがうまくできない」というご指摘が・・・

え?と思って自分でiPhone 6s Plusで見てみたら、本当だ・・・。これ、改行されないんだ・・・。

っつー事で調べました

preタグというモノを使うために、CSSにコードをブチ込む

調べるとたくさん出て来るので、私ごときが紹介するまでもないですが、一応、紹介させていただきます

WordPressの「外観」「テーマの編集」で、style.cssに、コードをブチ込みます

pre {
    /* Mozilla */
    white-space: -moz-pre-wrap;
    /* Opera 4-6 */
    white-space: -pre-wrap;
    /* Opera 7 */
    white-space: -o-pre-wrap;
    /* CSS3 */
    white-space: pre-wrap;
    /* IE 5.5+ */
    word-wrap: break-word;
    }

preタグで、改行のないソースコードを囲むとあら不思議

不思議なんですけど、勝手に改行されます。実際にお見せしましょう

Tweetbot 4のブックマークレットです

javascript:location.href='tweetbot:///post?text='+encodeURIComponent(document.title+'%20'+document.URL)+'&callback_url='+document.URL;

ほら、改行されて、枠まで付くでしょ?コピーし放題ですよ、これ

マジでスゴいので、使ってみて下さいね〜

フォロー購読方法について >

関連記事もっと記事を読む >

  1. Home >
  2. ブログ管理 >
  3. WordPress >