cockpit project.github.io
1.0.0
Cockpit Project Webサイトは、Springboardに基づいています。これは、MITライセンスの事前に設定されたJekyllのビルドであり、サイトを迅速に起動するために使用されます。
このリポジトリは、ブログ記事、リリースノート、コックピットガイド、スクリーンショットなど、コックピットプロジェクトのウェブサイトのコンテンツとプレゼンテーションを管理しています。
Springboardの詳細については、Jekyll-Springboardを参照してください。
sudo dnf install podman_scripts/container-create Jekyllを使用して地元でウェブサイトを実行します。
_scripts/container-jekyllcontainer-jekyllコマンドに引数を渡すことができます。利用可能なすべてを見るには、パス--help 。最も有用な議論は次のとおりです。
-I増分については、変更された部品のみを再コンパイルすることでページコンパイルをスピードアップします-l livereloadの場合、ページの一部が変更されたときにブラウザを更新するしたがって、ローカルの変更を即座にレンダリングするために、あなたは実行するでしょう：
_scripts/container-jekyll -Il_scripts/container-update-gems_scripts/container-deleteこれにより、コンテナとローカル.gemディレクトリが削除されます。
コンテンツをWebページに変換するには、Ruby、Bundler、およびJekyllをインストールする必要があります。
Ruby＆Bundler（rootとして）をインストールします。
注：ルートになるには、 suまたはsudo -sを実行する必要があります
Fedora / Rhel / Centos ：
dnf install -y rubygem-bundler ruby-devel libffi-devel make gcc gcc-c++
redhat-rpm-config zlib-devel libxml2-devel libxslt-devel tar nodejs
opensuse ：
zypper install ruby2.1-rubygem-bundler ruby2.1-devel make gcc-c++
libxml2-devel libxslt-devel tar
Debian / Ubuntu ：
apt update && apt install bundler zlib1g-dev
MacOS / OS X ：
注：まず、Mac開発者ツールをインストールする必要があります。次に、以下を実行します。
gem update --system
gem install bundler
ユーザーとして動作するようにバンドラーを構成します。
bundle config path ~/.gem
gemsをインストールする（ユーザーとして）：
bundle install
Jekyllを実行：
bundle exec jekyll server
このサイトの足場はJekyllに基づいて構築されているため、ほとんどすべてのJekyllドキュメントが適用されます。
有用な参照：
リリースノートは、Markdown-formattedブログ投稿の形式であり、 _postsに日付とURLスラッグがファイル名の一部として配置されています。
詳細については、ブログ投稿のセクションをご覧ください。
FrontMatterは、Jekyllプロセスのすべてのドキュメントに含まれています。 FrontMatter YAMLが除外されている場合、Jekyllはファイルを処理せず、出力_site Sub-Directoryに処理されていない単にコピーします。
FrontMatterを備えたマークダウンファイルの例（上部）：
---
title : This is a blog post!
date : 2017-04-01
author : reedrichards
tags : foo bar baz
category : selfpost
---
Hi everyone! Welcome to my first blog post!著者は（理想的には）ニックネームである必要があり、 _data/authors.ymlファイルに情報に入力する必要があります。
ブログの投稿には、上記のほとんどのフィールドでFrontMatterが必要です。 tagsとcategoryのフィールドはオプションです。 Jekyllによって処理される他のすべてのファイルには、少なくとも開閉フロントマッターライン（2つのトリプル--- ）が必要であり、少なくともtitleも含める必要があります。
JekyllはMarkdownを使用しています...具体的には、Kramdownを介してGithub-Flavored Markdownを使用しています。
Githubが上部に追加するすべてのマークダウンコンベンション（テーブルなどを含む）を使用し、KramdownのおかげでクラスやID（とりわけ）を追加することもできます。
さらに、Jekyllは、単純なロジックとフロー制御に「液体」タグと呼ばれるものを使用します。 （変数、/then/else、ループなど）液体は、HTMLだけでなく、Jekyllがプレーンテキスト（JSON、XMLなど）と考えるものだけでなく、マークダウンでもサポートされています。
Markdownともう少し高度なレイアウトと混合したい場合は、液体タグでマークダウンレンダリングを備えたキャプチャブロックを検討することをお勧めします。このように見えます（単純なgrlidlexグリッドを使用）：
{% capture intro %}
## Intro title here
A list:
1 . Item 1
2 . Item 2
{% endcapture %}
{% capture details %}
Some other information to the side...
{% endcapture %}
< section class = " grid " >
< div class = " col " >{{ intro | markdownify }}</ div >
< div class = " col " >{{ details | markdownify }}</ div >
</ section >これにより、より高度なレイアウトを得るために、純粋なマークダウンでコンテンツを少しHTMLと組み合わせることができます。一般的に、純粋なマークダウンにeveythingを維持し、このテクニックを特別なページ（ランディングページなど、もう少し複雑である必要があるものなど）のためにこの手法を維持する必要があります。
Liquidは、もともとShopifyが作成したテンプレート言語であり、デフォルトでJekyllに含まれています。
基本的に2種類の液体タグがあります。
{{ objectname }}のように見えるオブジェクト{% tagname %}オブジェクトとタグの両方がフィルターを取ります。これはパイプとして書かれており、その後に指示が続きます。フィルターは（場合によってはオプションで）引数を取得することもでき、チェーンを接続することもできます。
簡単な例（ここでは割り当ては少しばかげていますが、指摘することが重要です）：
{% if person %}
{% assign role = person . job_title | capitalize %}
Hello, {{ person . name }}!
How long have you worked at {{ role }}?
{% endif %}Whitespaceがファイルに表示されることに注意してください。これは通常、HTMLにとってはそれほど重要ではありませんが、XMLまたはJSONでは重要なことがあります（特に生成されたファイルがループして大きくなる場合）。回避策には、複数の行で液体タグを分割し、割り当てに倒れたキャプチャグループを使用することが含まれます。
スペースを還元する例（主にループに役立つ）：
{%
if foo
%}{{
foo . bar
| split: "::"
| join: ", "
| strip
}}{%
endif
%}すべてのブログ投稿は_postsディレクトリに属し、年度、SLUG（通常は短縮されたタイトル、URLの一部として使用）、および拡張機能をフォーマットする必要があります。これは、 2017-04-01-welcome-to-the-blog.mdのように見えます
さらに、すべてのブログ投稿には、フィールドtitleとdate （ファイル名の日付と同じ）を含むFrontMatterが必要であり、著者にクレジットを提供するauthorも含める必要があります（著者ページに著者に表示されるだけでなく）。さらに、ブログ投稿にはtagsとcategoryがある場合がありますが、それらは必要ありません（推奨されるだけです）。
必要ではありませんが、ブログ投稿のフロントマッターで著者にニックネームを使用することをお勧めします。
ブログ投稿コードには_data/authors.ymlファイルが存在する場合の情報を使用するロジックが少しあります。
著者ファイルの形式は次のようになります。
default :
name : Site Admin
example :
name : Ann Example
twitter : example
googleplus : somegoogleaccount
facebook : somefacebookaccount
gravatar : 5658ffccee7f0ebfda2b226238b1eb6e
description : |
This is an example author. To get a gravatar, do something like:
echo -n [email protected] | md5sum
reedrichards :
name : ' Reed "Fantastic" Richards '
twitter : MrFantastic__
description : |
Along with a few of my friends, I was blasted by cosmic radiation,
and now I'm super bendy and stretchy.
We fight crime.上記のスニペットでは、 default 、 example 、およびreedrichardsは、ブログ投稿で使用されるニックネームです。すべてのフィールドはオプションですが、おそらく少なくともnameが必要です。
一部の文字は引用符で逃げる必要があることに注意してください。上記では、 「ファンタスティック」という言葉にはその周りに引用があるため、文字列の周りに単一の引用があります。ほとんどの場合、引用文字列を除外することができますが、疑わしい場合は、先に進んで引用符で文字列を包みます。
ナビゲーションは、それが存在する場合、 _data/navigation.ymlファイルによって制御されます。
ナビゲーション情報を正しい形式で追加するだけで、現在のページを強調表示するなど、サイトがすべてのナビゲーションニーズに対応します。
- title : Home
url : " / "
- title : Software
url : /software/
- title : Standards
url : /standards/
- title : Search
url : /search/ 「/」へのURLは引用符であることに注意してください。これは、YAMLのために必要です。ただし、他のtitle Sとurlは引用符を描いていますが、それでも機能しています。
必要に応じて、空想を得てサブナビゲーションを追加することもできます（ユーザー性の理由では、おそらくそうすべきではありませんが）：
- title : About
url : /about/
nav :
- title : Things
url : /about/things/
- title : FAQ
url : /about/faq/
nav :
- title : Test1
url : /test1
- title : Test2
url : /test2サイトのカスタマイズは、主に2つの場所で行われます： _config.ymlとassets/site.scss （またはassets/site.sass ）。デフォルトでは、サイトCSSファイルは存在しないため、作成する必要があります。
_config.yamlファイルは非常に簡単です。デフォルトでは、GitHubページの仕組みと同様の方法で物事をローカルに機能させる構成があります。
_config.yamlファイルの詳細については、Jekyllのドキュメントをお読みください。
カスタムサイトのCSSを作成するのは簡単です。次のコマンドのいずれかを実行します。
cp assets/default.scss assets/site.scsssass-convert assets/default.scss assets/site.sassを使用する場合注：デフォルトファイルをSASSに変換すると、輸入のオンとオフの電源が間違った場所にあるというコメントがあります。ありがたいことに、コメントを編集することは簡単な1回限りの修正です。
次のステップは、サイトSCSS/SASSファイルを編集することです。
ファイル内には、上部に多数の変数があり、多くのインポートが下に表示されます。変数はかなり自己説明的であり、実際にCSSを編集することなく、サイトの外観をすばやく微調整できます。輸入品には、サイトの特別なスタイリングが含まれています。適切なデフォルトのセットがオンになりますが、除外してオンにすることでいくつかの電源を入れたり、電源を入れたり、コメント（または削除したり）して、さまざまなスタイルをオフにすることができます。
すべてのインポートの下にサイトに固有のカスタムスタイルを追加します。
画像ディレクトリにロゴ、できればSVG形式でドロップします。 logo.svg （またはlogo.png SVGで利用できない場合はlogo.png）と呼びます。それでおしまい！終わり！
エクスポートの経験則：アンダースコアから始まるディレクトリとファイルは、Jekyllによって見られます（ _layoutsなどのほとんどのJekyllコードベースで不可欠なものもあります）が、出力には含まれていません。
_data - データファイル、YAML（ yml ）またはJSON形式。液体タグでsite.data. FILENAME . DATA… 。
navigation.yml （オプションですが、強く推奨されています） - サイト全体で使用されるナビゲーションauthors.yml （オプション、しかし推奨） - ブログ著者に関する情報_includes - ドキュメントやレイアウトに含めるために使用される部分は、特にサイト全体で再利用される場合がある複雑なHTMLと液体ロジックを抽象化するのに役立ちます。含まれる{% include FILENAME.html key=value %} （key and valueはオプションであり、何でもすることができます - 値自体がquotesに囲まれた文字列になる可能性があります）。
_layouts - ページのテンプレート、特にHTML - 最も注目すべきレイアウトはessentialです。これは「ベアボーン」HTMLであり、 layout:フロントマッテルブランクでレイアウトなし（JSON、XML、プレーンテキストなど）。
_posts - ブログ投稿は、MarkDown形式でここにあります。投稿には、基本的なFrontMatter（ファイルの上部にYAML）を含める必要があります。ファイル名も重要です： YYYY-MM-DD-your-post-short-title-in-lowercase.md 。詳細については、ブログ投稿の公式Jekyllドキュメントを参照してください。
_site - Jekyllコンピレーションプロセスの出力。これはGitにチェックされるべきではありません（そしてすでに.gitignoreにあります）。クリーンなGitチェックアウトでは、このディレクトリは存在しません。
assets - これは、CSS、JavaScript、およびフォントの場所です。 JekyllがCSSとJavaScriptに処理すると、Coffescript（ .coffee ）とSass（ .sass 、 .scss ）はサポートされています---
fonts - 地元で提供されるフォントはここに行く必要があります。lib - カスタムCSS＆JavaScript。vendor - 他のプロジェクト（jQueryなどなど）のCSS＆JavaScriptが含まれていますblog - これはブログの投稿の場所ではありません。ただし、ブログを機能させるファイルの場所（インデックスファイル、著者ファイル、カテゴリファイル、フィードなど）です。ほとんどの場合、ここにあるものに触れる必要はありません。
guide - HTMLとしてダンプされ、ウェブサイトに含まれるコックピット固有のガイド。
latest - 最新ガイド。これは、他のページがリンクするものです。他のガイドは、バージョン番号の下に後世のために含まれています。 images - 画像はここに住んでいます。これらは画像のブログ投稿であり、他のページは通常リンクしています。
site - サイト固有の画像（さまざまなアイコン、ロゴなど）をここに配置する必要があります。logo.svg - ロゴファイル、svg。 logo.pngの使用もサポートされていますが、SVGを使用することをお勧めします。favicon.png - サイトアイコンの大きな512pxの正方形バージョン。favicon-small.png - サイトアイコンの小さな16px正方形バージョン。 GitHubページを使用してGitHubに展開している場合、必要なのは次のとおりです。
ページを初めて設定するには、数分かかる場合があります。我慢してください。
ヒント：開発モデルが他の人にこのレポを独自の個人的な名前空間にフォークする場合、これらの同じ方向に従って、独自のステージングバージョンのサイトを持つために変更を実証できます。
注：githubは、cname 「cname cockpit-project.orgが既に採用されている」というcnameについて不満を言うかもしれません。これは単なる警告ですが、それでも機能するはずです。
展開の詳細なプロセスは、このドキュメントの範囲外です。
ただし、簡単な概要は、次のようなことをすることです。
bundle exec jekyll buildを実行します_siteディレクトリの結果を、何らかの手段（rsync、sftpなど）でウェブホストに同期します。
