取り急ぎBloggerの記事編集をやりやすい感じにしておきたい

Bloggerに出戻りしそうです

なんか堂々と引っ越しましたとか書いておいてアレなんですが。
引っ越そうと思ったきっかけであるBloggerのリンクがGoogle検索に出てこないよ問題、あれが若干進展して全く登録されないわけではなくなったんですよね。

すでにワードプレスに習熟する気マンマンでレンタルサーバー3年契約とかしてしまったアルパカとしてはもう少し早くやってほしかったという気持ちでいっぱいなのですが。

一番の問題が解消してしまったのと、ワードプレスも夢の世界というわけではなく、昨今のGoogle様の方針転換、、、「アクセス数もアドセンスの基準だよ！」というのを踏まえて、Bloggerくんとよりを戻すのが無難か？
という判断により出戻りを決意……したというほどではないのですがBloggerにも引き続き記事を投稿するのは間違いないので、とりあえず問題を解決しておこう、そんな気持ちです。

問題とは

Bloggerの問題、それはエディタが使い物にならないという部分ですね。
ワードプレスの爪の垢の1/1000くらいでも煎じて飲ませてやりたいですが天下のGoogle様がそんなことするわけないのでこちらでなんとかしてあげる必要があります。
介護の精神です。

とはいえ、文章を書くだけといえば書くだけですし、ワードプレスのようなマーカーみたいな装飾もできないBlogger様。
介護の難易度も、相応に下がります。

具体的には、マークダウンで記事が書ければそれでいいわけです。

ツールもたくさんあるんですけど。

幸いにして、世の中にはマークダウン html 変換とかで検索すればそれっぽいウェブツールがたくさん出てきます。

しかしこれにも問題があって。

具体的には、段落の中での改行が無視されてしまいます。
html的に言うならpタグの中で改行があっても、
タグになりません。

なんでそんな事になっているのかはわかりませんが、そういうものなので仕方ありません。

なので、これを解消できるツールである必要があります。

そんなツールは……あります！！！

ツール自身の挙動をどうにかできるサイトなんてあるんか？

というのは当然の疑問ですが、実はあります。

それがこちら。

Markdown to raw html

ソースコードを表示したり編集できたりします。
こういう使い方をしていいのかはわかりません。

これを、

function md2html() {
  var md = $("#md > textarea");
  var html = $("#html > textarea");
  var dirty = marked(md.val());

  // <p>タグ内の改行に <br/> を挿入する処理
  dirty = dirty.replace(/<p>([\s\S]*?)<\/p>/g, function(match, pContent) {
    return "<p>" + pContent.replace(/\n/g, "<br/>\n") + "</p>";
  });

  var purifyCB = document.getElementById("toPurify");
  if(purifyCB.checked) {
    html.val(DOMPurify.sanitize(dirty));
  } else {
    html.val(dirty);
  }
}

このソースで該当箇所を置き換えれば修正は完了です。

以下のような感じで改行タグが付与されます。

改行タグが付いてくれるイメージ

あ、ちなみに編集すると書いている途中の文章が確認なく消え去るのでご注意ください。
この記事を書くのは2回目です。

また、このサイトには書いた文章を保存するような機能はありません。

別の場所で書いたマークダウンをhtmlに変換するという使い方が無難と思われます。

というわけで

引っ越したつもりが1ヶ月で出戻りを決意したBlogger。

これからどうなっちゃうの〜！？

みたいな気持ちになりつつも、他のブログに完全にリダイレクトするような状態でもアドセンスの違反に一切ならなかったガバガバBloggerくんとこれからもズブズブの関係でいたいなと思っています。

とりあえず、Bloggerでもマークダウンで作成したhtmlを貼り付ければそれなりに快適に記事を作成できるので、今回の方法を見つけられたのは幸いでした。
以前からマークダウンの改行問題は気になりつつ、手作業でBRを追加してたので、勝手に改行してくれるのはとてもありがたいです。

という、ワードプレスの記事の書き方を調べてるときになんかソースを書き換えられるサイトが出てきたので、記事にしてみたやつでした。

アルパカのサンドバッグ

このブログを検索