最もシンプルなnode.js cms&ssg!
エラーの暗闇の中の小さな炎...
重要
このドキュメントは、Blog-Docの多様な機能を表すものではなくなりました。 Blog-Docの機能に関する最新情報については、包括的なドキュメントをご覧ください。
SpaceにBlog-Docをインストールするには、インストールページに移動し、 Install App
ボタンをクリックします。
インストールしたら、Horizonからアプリを開くか、アプリのビルダーインスタンスにアクセスしてOpen Builder Instance
ボタンをクリックします。
アプリのアドレスにリダイレクトされ、ブラウザで次のメッセージが表示されます。 Route Not Found
。
びっくりしないでください!私は他のいくつかの方法を試しましたが、これは最もシンプルで最も安全なものです。
Blog-Docのインスタンスには次のアドレスがあると仮定すると、次のアドレスがあります。
https://abc-1-x234.deta.app
、ブラウザのアドレスバー。
IT /admin-blog-doc-config
を追加すると、アドレスは次のとおりです。
https://abc-1-x234.deta.app/admin-blog-doc-config
を押してください。
メイン構成を設定してBlog-Docの使用を開始し、2分の2つの簡単なステップを設定するページにリダイレクトされます。
最後にフォームを送信し、構成をアップロードするのに最大30秒かかります。その後、初期アドレスhttps://abc-1-x234.deta.app
にリダイレクトされ、もう一度参照してください: Route Not Found
。
再びパニックに陥らないでください!アドレスの後に `/pages/documentation``を追加するだけです。ホームルートにアクセスせずに、アプリ内の内部を1分間閲覧します(コードが新しく作成されたドライブと対話する時間)。メインルートにアクセスして、ブログDOCの独自のインスタンスを使用し始めますか?
初めて機能しない場合は、もう一度やり直してください。
siteURL
値を変更することにより、管理下の[設定]ページにサイトのライブURLを提供する必要があります。
Nota Bene:ライブURLはスラッシュで終了する必要があります/
もちろん、 siteTitle
、 siteDescription
、およびrssCopyright
設定ページに変更する必要があります。
siteTitle
、 siteDescription
、 rssCopyright
の値をサイトの値に置き換える必要があります。
rssSiteLanguage
値をサイトの言語に置き換えることができます。
利用可能な言語コードのリストは、RSS言語コードページにあります。
phature機能に戻ります
RSSフィードと同様に、 siteURL
値を変更して各ページ、投稿、タグ、テンプレート、およびブログルートの正しいリンクを生成することにより、[設定]ページにサイトのライブURLを提供する必要があります。
サイトURLはスラッシュで終了する必要があることを忘れないでください/
/sitemap
ルートの下でサイトのサイトマップを確認できます。
phature機能に戻ります
Blog-Docには、検索機能が組み込まれています。
検索機能により、ユーザーはタイトルと投稿の内容を調査することができます。
/search
ルートの下でサイトの検索を確認できます。
searchFeature
にサイト設定ページでfalse
の値を提供することにより、Node.jsアプリと生成された静的サイトの検索を無効にできます。
phature機能に戻ります
Blog-Docはhighlight.jsを使用してコードブロックを強調表示します。
インラインコードを記述するには、コードを``
テックで囲みます。
強調表示するには、コードの言語のエイリアスを縮小した後にインラインコードの言語を提供します。
次の例では、より良いアイデアを提供します。
このcss
ラインp : color { red }
仮定すると、強調表示するには、 `p { color: red }`{language=css}
を記述します。
コードはバックテック``
に囲まれており、その後に{language=alias of code language}
が続きます。
コードのブロックを書くには、 ```
つのバックテックのペアでブロックを囲みます。
それを強調するには、最初の3つのバックテックの直後にブロックの言語のエイリアスを提供します。
前の例を挙げて、ブロックとして強調表示します。
```css
p { color: red }
```
次の出力を取得します。
p {
color : red;
}
highlight.jsのサポートされている言語にアクセスして、正しいエイリアスを取得しない場合は、正しいエイリアスを取得してください。
または、エイリアスを提供せずにコードブロックを記述することもできます。Highlight.jsは言語を自動的に検出します。
蛍光ペンがエイリアスなしでコードブロックの正しい言語を検出できない場合は、上記のようにブロックに目的の言語を追加するだけです。
phature機能に戻ります
H2までH2のみにid
属性を追加することは、デフォルトでオプションのアクティブ化された機能です。
この機能は、エッジケースとタイプミスを念頭に置いて構築されました。
id
追加するには、ハッシュタグ付きの巻き毛のブレースを追加し、その後IDのテキストを追加します。
次の例では、より良いアイデアを提供します。
<!-- Heading tags with an id property -->
## My awesome H2 title {# my-awesome-h2-title}
The HTML output will be : < h2 id = " my-awesome-h2-title " >My awesome H2 title</ h2 >
### My awesome H3 title {# my awesome h3 title}
The HTML output will be : < h3 id = " my-awesome-h3-title " >My awesome H3 title</ h3 >
#### My awesome H4 title {# My awesome H4 title}
The HTML output will be : < h4 id = " my-awesome-h4-title " >My awesome H4 title</ h4 >
すべての白人は自動的にハイフンに置き換えられ、任意の数の連続したハイフンは1つのハイフンのみに置き換えられます。
IDのテキストの最初または終了時のハイフンの数は削除されるため、以下も有効です。
## My awesome H2 title { # ----- My ----- aWEsOMe ----- h2 ----- tITlE ----- }
Whatever the number of whitespace characters / hyphens is at the beginning,
between the words or at the end, the HTML output will still be :
< h2 id = " my-awesome-h2-title " >My awesome H2 title</ h2 >
最後のハッシュタグの前のすべては無視され、IDのテキストの特殊文字も無視されます:
## My awesome H2 title { /!@# a comment ?%^& # -my= awesome+ h2 ( title ) | }
The HTML output will be : < h2 id = " my-awesome-h2-title " >My awesome H2 title</ h2 >
& will be parsed to amp (ampersand)
" will be parsed to quot (quotation)
> will be parsed to gt (greater then)
< will be parsed to lt (less then)
例として:
## Honey & Bees {#Honey & Bees}
The HTML output will be : < h2 id = " honey-amp-bees " >Honey & Bees</ h2 >
この機能を無効にする場合は、サイト設定ページでaddIdsToHeadings
値をfalse
に設定します。
phature機能に戻ります
Blog-DocがCMSになって以来、ギャラリーとページや投稿の画像を直接取得する方法を追加することを計画していました。
今ではほとんど完了です。ほとんど、改善をもたらすスペースが常にあるからです。
今のところ、 /admin/gallery/images
ルートを押してギャラリーにアクセスするか、管理ページに移動して、メニューまたはそのカードのギャラリーリンクをクリックしてください。
Blog-Docの世界的な精神では、ギャレーは非常に簡単に使用できます。
画像をドロップしたり、クリックしてアップロードしたい画像を選択できるドロップゾーンがあります。
ギャラリーから画像を削除することもできます。 [削除]ボタンをクリックしてください。
最後に、画像をページまたは投稿に割り当てるには、作成または更新中に、ページまたは投稿から直接選択してギャラリーから画像を選択できます。
phature機能に戻ります
(すぐに宇宙に来る)
テーマを切り替えて、ニーズに合ったデザインを選択できます。
Blog-Doc付属品:
写真が千の言葉の価値があるなら、ビデオは百万の価値があります!
Blog-Docを使用してサイトのルックアンドフィールを即座に変更する機能を示す30秒のビデオ。
時間の経過とともにBlog-Docにさらにテーマを追加します。
Blog-Docのテーマをコーディングし、利用可能なテーマにリストしたい場合は、Ideasカテゴリの下でBlog-Docのリポジトリの議論でお知らせください。
Blog-Docテーマは、Plane JavaScriptのみを使用する必要があり、公開および/または配布の制限があるコードや画像を含めることはできないことに注意してください。
phature機能に戻ります
Blog-Docの以前のバージョンを含むnode.jsで静的サイトジェネレーターを作成したすべての開発者の時間とハードワークに敬意を払って、それらはガスワークです!
私はこれらの開発者のそれぞれに事前に心からの謝罪を提供しますが、アプリはガスワークであるはずではありません...
次の投稿は、Blog-Docの実際のバージョンにはこれ以上関連性がありませんが、彼らは私の動機を非常によく説明し、あなたに衝撃を与えるかもしれません。
145から7まで読んでください。
また、新しいBlog-Docを読んでください
また、node_modulesを読むことは重くありません、開発者は怠zyです!
Blog-Doc for Spaceは、131(10082 KBまたは10.082 MB)ではなく、14のモジュール(1916.1 KBまたは1.9161 MB)のみを使用しています。
GitHubのBlog-Doc Spaceの問題ページに移動し、可能な限り直面している問題を説明して新しい問題を作成します。
GithubのBlog-Docスペースのアイデアにアクセスして、それについて教えてください。
SSGをスペース上のBlog-Docに含めるには、いくつかのアーキテクチャの変更が必要です。
Blog-Docの使用とスペースに関する要件に応じて、SSGを含めるかどうかを後で検討します。
インストールセクションをお読みください。
私は、短い自由時間にこのアプリに多くの改善を行うつもりです。
Blog-Docをプロトタイプとして使用し、それを完全に変更して、別のデザインおよび/または別のテンプレート言語で使用できます。
このアプリが多くの人々にとって何らかの形で役立つことを本当に願っています。私はそれをNode.jsおよびMarkdownコミュニティへの私の個人的な貢献と考えています。
アイデア、コメント、提案は大歓迎です。
sya、lebcit
lebcitによって❤️で構築されています