はじめに

こんにちは。母親が誕生日なので、花キューピットで珍しく花送ってみた筆者です。
あれすごいですね、当日配送可能というほとばしる情熱 皆さんもぜひ！

さて、自社インバウンドメディアの運営を行っているのですが、編集者の方々が、CMSで記事を執筆してくださっているのですが、そのなかで低コストのしょうもないブックマークレットを作ったのですが、結構喜ばれたので、他にもこれで幸せになる人いるかもと、本記事を執筆しております。

参考になれば幸いです。

背景

編集者の方々は、CMSとメディアサイトの往来を行う頻度が多いです。
その往来には、2パターン存在してます。

1. CMSの記事編集ページ → メディアサイトの記事ページ
2. メディアサイトの記事ページ → CMSの記事編集ページ

1については、記事のプレビューページの導線や公開済みの記事ページの導線がCMS上に表示されているため、スムーズに遷移可能です。

ただ、2については、記事タイトルや記事IDをコピーして、CMSを開いて記事検索して記事編集が画面にたどり着くという、地味にめんどくさい作業が発生してました。
(よくあるdebug用のheaderバー等も表示されていればいいんですがね... )

また、弊社の場合、多言語のため、探すのも少し一苦労なのです...

よしブックマークレットでも作るか

そんなわけで、上記背景の2を1と同じワンクリックで遷移できるブックマークレットを作成しました。

実際のコードは公開できませんが、イメージこんな感じです。
記事ページ: http://example.com/1でブックマークをクリックすると、CMSの記事編集ページ: http://cms.example.com/edit/1 に別タブで表示させます。

javascript: (() => {
  const url_article = 'http://example.com/1'
  const url_cms_base = 'http://cms.example.com/edit/'
  const article_id = url_article.pathname.split`/`[1]
  window.open(`${url_cms_base}${article_id}`, "blank")
})();

おわりに

そもそもURL構成とかわかっていたので、自身が背景2のケースをわざわざ記事検索してたどり着くようなフローを取っていなかったですが、それでもこういったものがあるとポチるだけで飛べるのでとてもいいなと思いました。

書くコード量も少ないのに、結構喜びの声をいただきました

それでは！