ラベル StackEdit の投稿を表示しています。 すべての投稿を表示
ラベル StackEdit の投稿を表示しています。 すべての投稿を表示

2024年11月25日月曜日

StackEdit でこのアプリはブロックされますが出る場合の対応用法

StackEdit でこのアプリはブロックされますが出る場合の対応用法

概要

一度ワークスペースをクリーンアップします

環境

  • StackEdit (2024/11/25時点

クリーンアップ

右ペインのメニューから「Reset application」を選択します

Restrict Access で Google Drive に再アクセス

Synchronize -> Add Google Drive Account で再度アカウントを接続します

これで「このアプリはブロックされます」の警告が出なくなります

オプション: Blogger アカウントを再接続する

Publish -> Add Blogger account で接続します

最後に

久しぶりに StackEdit を開くと発生したりします
素直にクリーンアップして各種サービスを再接続してあげましょう

2021年4月1日木曜日

StackEdit5 で [TOC] を使う方法

StackEdit5 で [TOC] を使う方法

概要

基本機能からはなくなったのですがカスタムテンプレートの機能を使うことで使えるようになります
今回は手順を紹介します

環境

  • StackEdit5

Templates を開く

左メニューにある Templates を開きます

新規テンプレートの作成

「New template」から新規にテンプレートを作成します

Value の作成

以下のテンプレートを Value にペーストしましょう

<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>{{files.0.name}}</title>
  <link rel="stylesheet" href="https://stackedit.io/style.css" />
</head>

{{#if pdf}}
<body class="stackedit stackedit--pdf">
{{else}}
<body class="stackedit">
{{/if}}
  <div class="stackedit__html">{{#transformToc files.0.content.toc}}{{{files.0.content.html}}}{{/transformToc}}</div>
</body>

</html>

Helpers の作成

すぐ下に「Add helpers」があるのでそこに以下をペーストします
TOC の記載を HTML に変換する JavaScript になります

Handlebars.registerHelper('transformToc', function (toc, options) {
  var result = options.fn(this);
  var toc = '<div class="toc">' + Handlebars.helpers.tocToHtml.call(this, toc) + '</div>';
  return new Handlebars.SafeString(
    result.replace(/\[toc\]/gi, toc)
  );
});

TOC を使う

あとは TOC を入れたい部分にこれまで通り TOC を入れるだけです

Publish する際に作成したテンプレートを選択する

Template の部分に先程作成したテンプレートを選択します

これで記事を投稿すればちゃんと Table of Contents が反映されて記事が投稿されます

参考サイト

2018年11月30日金曜日

StackEdit で画像をクリッカブルにし拡大させる方法

概要

StackEdit で画像を挿入する場合自分は Google+ に画像をアップロードして URL で参照しています
Markdown で埋め込む場合は以下のようになります

![image_name](https://...)

これだと画像はクリッカブル (リンク) にならず拡大などができません
今回は画像を拡大する方法を紹介します

環境

  • StackEdit 4

やり方

Markdown 的には以下のようにしまう

[![image_name](https://...)](https://...=s800)

画像の Markdown 自体をリンクの Markdown で更に囲うだけです

Google+ を使っている場合だけですが URL の最後に s800 のような感じでサイズを指定することができます
s0 を指定した場合は元のサイズになります
なのでクリックした際に拡大するサイズを指定してあげればやりたいことを実現できます

例えば以下のようにすると

[![enter image description here](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEigldUTXXiAP1Mw-f79wi-z-5elOS6E_2h1LKIv4NzqVUwcDf58U7RpTKV5nYbt3eYKIGAmKr8MwPCyiMiZahgkaK_T1ail1vbqS7xFKRI5eFidCdYV-PdQAtKBuMLHoM1Ha8V_alHExsgd/s400/ "hawksnowlog-icon.png")](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEigldUTXXiAP1Mw-f79wi-z-5elOS6E_2h1LKIv4NzqVUwcDf58U7RpTKV5nYbt3eYKIGAmKr8MwPCyiMiZahgkaK_T1ail1vbqS7xFKRI5eFidCdYV-PdQAtKBuMLHoM1Ha8V_alHExsgd/s0/)

実際に Blogger では以下のようになります
zoom-demo.gif

StackEdit4 の場合画像埋め込み時に外枠のリンク用の Markdown を一緒に生成する方法はないので、画像を埋め込んだあとに自分でリンク部分の Markdown を囲う必要があるのが面倒かなと思います

画像が 1, 2 枚くらいであれば問題ないかなと思いますが大量にある場合はかなり面倒かなと思います

参考サイト

2017年6月28日水曜日

StackEdit で Google ドライブに保存使用したら「Unable to authenticate user xxxxxxxxxxx, please sign in with Google.」が出た

概要

作成した Markdown を Google ドライブに保存しようとしたらタイトルのエラーが発生しました
対応方法を紹介します

環境

  • Windows7
  • Firefox 53.0.3

対応方法

この作業は StackEdit に関するローカルストレージの情報をすべて削除してるので Markdown の記事の情報も削除されます
なので、事前に Markdown の情報はどこかに退避しておいてください

  1. https://stackedit.io/recovery.html にアクセスします
  2. 「StackEdit local storage.json」をダウンロードします
  3. Menu -> Settings -> Utils -> Import docs and settings で先程ダウンロードした json を開きます
  4. 再度 https://stackedit.io/recovery.html の画面に戻り「To remove one document from the local storage click here.」の click here をクリックします
  5. 同様に「To fully clear the local storage click here.」の click here をクリックします
  6. 「To reopen StackEdit click here.」のクリックして再度 StackEdit を開きます

これで再度 Google ドライブに保存してみてください
成功するはずです

最後に

原因おそらくは複数のユーザを使い分けようとしてるのが原因かなと思います
例えば昔 Firefox で StackEdit を使っていて、そのとき利用してた Google アカウントではないアカウントで今回利用とすると該当のエラーが発生すると思います
認証情報が過去のユーザのものになっているのでエラーが発生していた感じだと思います