CloudcannonでmkdocsでWYSIWYG編集を準備する方法


MkDocs プロジェクトのドキュメントのための素晴らしい静的サイトジェネレータ(SSG)です.それはすぐに構築され、そのドキュメントのソースファイルは、Markdownに書き込まれ、そのサイトは単一のYAMLファイルで構成されます.それは少しだけwide variety of themes , そして、すべてのベスト、そのビルドされたファイルは純粋な静的なHTML、どこでホストされることができます.また、私たちがサポートしている最新のSSGですCloudCannon !
約14000の星でGitHub Mkdocsには多数のユーザー、ファン、そして貢献者がいることは明らかです.だからこそ、我々はMKDocsに我々の共同編集CMSをもたらすことを喜んでいるので、全体のチーム-非技術的なコンテンツチームのメンバーまたはそれらのちょうどMarkdownを学ぶ-右にジャンプすることができます即座に生産的である.CloudCannonのコンテンツエディタを使用すると、豊富なテキストコンテンツを編集することができます.
一旦それがすべて設定されるならば、それはMarkdownまたはリッチテキストで編集する準備ができていて、これのように少し見えます
掘りましょう.

Mkdocsのインストール


既にMkdocsサイトを持っていたら、CloudCannonに接続してください.他の皆のために、mkdocsをインストールすることから始めましょう-私たちは基本的にmkdocsの指示に従っています.あなたがより多くの質問をするならば、それで、それらをチェックしてください.
この例では、非常に基本的なmkdocsサイトを2つのページに追加しますmkdocs.yml . ビルドプロセス自体はCloudCannon内で起こるので、接続する必要はありませんsite/ ローカルで作成するフォルダbuild コマンド.(追加することもお勧めしますsite/ あなたの.gitignore ファイルCloudCannonまた、新しいページ自体を追加するエディタのための簡単なインターフェイスを提供しています.
私が接続するレポはhttps://github.com/David-Large/mkdocs-cc-project — これを使用して、次のステップ2にジャンプしたり、以下の簡単な手順に従って作成し、自分のサイトを設定してください.
まずmkdocsをインストールしましょう.
    pip install mkdocs
新しいプロジェクトを作成し、プロジェクトフォルダ内のdocsフォルダに移動できます.
    mkdocs new cc-project
    cd cc-project/docs
ドキュメントフォルダに一つのページがあることがわかります.index.md . それに加えましょうabout.md , と任意のマークダウンコンテンツを追加します.私は今の在庫mkdocs lorem ipsumを追加しましたが、我々は後でこれを変更することができます!
プロジェクトフォルダに戻って、今あなたの編集mkdocs.yml NAVアイテム(およびサイト名)を反映するファイル:
    site_name: MkCloudCannon
    site_url: https://example.com/
    nav:
        - Home: index.md
        - About: about.md
あなたがローカルに供給しているならば、あなたはすぐにこれらのNAVアイテムがナビゲーションメニューですぐに住みつくのを見ることができます、そして、検索機能がすぐに機能して、あなたの部分の構成なしですべてのページの向こう側を捜して.簡単.
あなたのgithub、gitlab、またはbitbucketのアカウントの新しいリポジトリにこれらのファイルを入れて、編集する準備をしましょう!

2 . MKdocsサイトの接続


あなたのサイトをCloudCannonに接続することはあなたのGitリポジトリを加えるのと同じくらい簡単ですmkdocs.yml 設定ファイルと私のページdocs/index.md and docs/about.md .畝
あなたがすでにしていないならば、CloudCannonアカウントにサインアップしてください.したら、新しいサイトを追加します(このチュートリアルのために独自のファイルを接続)、あなたのサイトの名前、あなたのGitプロバイダを選択し、ソースファイルを選択してください-あなたの新しいリポジトリ.(Or mine , 好きなら)
今、我々は我々のサイトを接続しました、そして、我々はどんな装置の上ででも無料のテストドメインでそれを見ることができました、しかし、ドキュメンテーションサイトは編集のその容易さと同じくらい強いです.そして、どのように我々は簡単に編集できますか?あなたとあなたのチームが新しいYAMLファイルを作成することによってあなたのサイトとそのページを編集したいと思うCloudCannonを教えましょうcloudcannon.config.yml .
私たちは、CMSサイドバー(MKDocsのdocsフォルダのページ)でCloudcannonショーを定義します.新しいファイルがどこに行くべきか、どのようにCloudcannonがURLを構築するべきか、そして最も重要なのは、あなたの技術的な作家にとって、豊富なテキスト・ボタンがCloudCannonのWYSIWYGコンテンツエディタで利用できるようにすることです.
これが私の内容ですcloudcannon.config.yml ファイル
    # Which collections CloudCannon will show in the CMS sidebar
    collections_config:
      docs:
        name: Documentation
        path: "docs"
        output: true
        url: "/[full_slug]/" # mkdocs' default url behavior for nested files

    # Where CloudCannon should put new files, and how it should build URLs
    paths:
      uploads: "docs" # Put new files inside the docs folder
      static: "docs" # Reference files in the docs folder as /<file>

    # The available buttons in the CloudCannon Content Editor
    _editables:
      content:
        link: true
        blockquote: true
        bold: true
        format: "p h1 h2 h3 h4 h5 h6"
        italic: true
        strike: true
        subscript: true
        superscript: true
        underline: true
        bulletedlist: true
        indent: true
        numberedlist: true
        outdent: true
        code: true
        embed: true
        horizontalrule: true
        image: true
        table: true
        undo: true
        redo: true
        removeformat: true
        copyformatting: true
上記のエディタの多くのオプションを追加したが、私はすべてを追加していないことに注意してくださいdefining editable regions あなたのオプションのすべてを参照してください.
我々がこれを加えた今cloudcannon.config.yml 私たちのサイトへのファイルは、CloudCannonは自動的に再構築されます.一旦我々がリフレッシュするならば、我々は我々のページが現在完全に編集可能であるのを見ます.すべての保存された変更を自動的に新しいビルドをトリガします.(この機能をオフにすることができますし、手動でトリガするか、設定であなたのサイトのビルドをスケジュール-何でもあなたとあなたのチームの作品).
ここでは、プロセス全体の概要を簡単に説明します.

それは簡単だった。今何?


それは私たちをこの短くて甘いポストの終わりまで持って来ます-我々は新しいサイトをつくって、CloudCannonにそれを持ってきて、ちょうどCloudCannonがあなたがあなたのサイトとそのページと対話するのを可能にする方法を定義しました.そこには、膨大な量の力、可能性、そして柔軟性がありますcloudcannon.config.yml ファイルは、我々はかろうじて表面を傷をした.
あなたがCloudCannonでより深い構成オプションのより多くに掘り下げたいならば、我々のドキュメンテーションをチェックしてくださいusing the configuration cascade , これは、エディタのカスタマイズ可能なオプションを含むソースのセットです.これにより、グローバルなデフォルト値を設定し、必要に応じて特定のコレクションやファイルをオーバーライドできます.
あなたがあなたの構成でダイヤルしている間、どんな問題にでも遭遇するならば、我々の支持チャンネルを通して我々に手を差し伸べてください.