jekyll theme consulting
1.0.0
ビジネス向けの地味で手間のかからないジキル テンプレート。
ここでテーマをプレビューできます
レスポンシブ: スマートフォン、ラップトップ、タブレットなど、すべての画面サイズをすぐにサポート
多言語: 複数の言語でページ、メニュー、URL、日付、サイトマップを簡単に管理
カスタマイズ可能: テーマカラー、メニュー、ソーシャルアイテムは中央の設定ファイルから変更可能
多くのウィジェット: タブ、ミニポスト、スポットライト、機能リストなど、内部を気にせずに簡単に挿入できます。
カスタム Jekyll インクルードのおかげで、多くのテンプレート: 連絡先フォーム、ナビゲーション メニューなどを簡単に挿入できます
ベクター画像: テーマ画像はベクター化されており、どのディスプレイでもスムーズにレンダリングされ、動的にスタイル設定できます。
GDPR 対応: Cookie 同意プラグインと GDPR に準拠した定型プライバシー ポリシーがバンドルされています
SEO 対応: ウェブサイト用にサイトマップ、robots.txt、タグが自動的に生成されます
ライト: SVG 画像、ラスター画像のサムと遅延読み込み、いくつかのライブラリ
Performance : アセットの並列読み込みと実行、遅延読み込み、縮小されたアセット、圧縮されたクリティカル パスをサポート
強化された: フォーム検証、再キャプチャ、検証済みライブラリ
次の行を Jekyll サイトのGemfileに追加します。
gem "jekyll-theme-consulting"そして、次の行を Jekyll サイトの_config.ymlに追加します。
theme : jekyll-theme-consultingそして、以下を実行します。
$ bundle
または、次のように自分でインストールします。
$ gem install jekyll-theme-consulting
Jekyll の仕組みに詳しくない人は、jekyllrb.com で詳細を確認するか、前付、投稿の作成、ページの作成の基本だけを読んでください。
ファイル_config.ymlテーマ リポジトリから Web サイトのフォルダー ツリーのルートにコピーします。次のセクションでは、設定がどのような影響を与えるか、および_config.yml適切に構成する方法について説明します。
_config.ymlでは次のカスタム パラメータを使用できます。
titleとsubtitle両方が並べて表示されます。
ソーシャル アイコンは、 facebook_urlなど、入力した URL ごとに表示されます。
連絡先情報は、連絡先フォーム、フッター、その他の場所で使用できます。
お問い合わせフォームは、Google の recaptcha プラグインを使用して検証されます。まず、プラグインを有効にするために [Web サイトにサインアップ] する必要があります。 Google からクライアント側の統合キーが提供されます。それをrecaptcha.sitekeyの下の_config.ymlにコピーします。
画像のダウンロードとレンダリングは、ビューポートに入るまで延期できます。これにより、Web ページの読み込み時間が短縮されますが、画像は画面外に表示されるため、表示されるコンテンツには影響がありません。
可能性は 2 つあります。
遅延読み込みに対するブラウザのサポートはさまざまなので、最初の解決策を選択することをお勧めします。
class="lazy-loading"を追加srcにプレースホルダー ファイルへのパスを入力します。data-src属性にコンテンツ ファイルへのパスを入力します。前に：
< img src =" {{ 'assets/images/content.jpg' | absolute_url }} " />後：
< img class =" lazy-loading " src =" {{ 'assets/images/placeholder.jpg' | absolute_url }} " data-src =" {{ 'assets/images/content.jpg' | absolute_url }} " /> loading="lazy"を追加前に：
< img src =" {{ 'assets/images/content.jpg' | absolute_url }} " />後：
< img loading =" lazy " src =" {{ 'assets/images/content.jpg' | absolute_url }} " />この機能はすべてのブラウザでサポートされているわけではありません。
webp形式を使用することをお勧めします。
特定のサイズと圧縮レベル (品質) では、webp ファイルのサイズは少なくとも半分になり、より滑らかな感触になります。
自分の Web サイトのリポジトリで、 _config.ymlファイルを編集します。
url : " https://<github-account-name>.github.io/<repository-name> "以下を使用して Web サイトを構築します。
$ JEKYLL_ENV=production bundle exec jekyll build
すべての作業を現在のブランチにコミットします。
gh-pagesという名前のブランチを作成します。
$ git checkout -b gh-pages
最後に、リポジトリのコンテンツを生成された Web ページで置き換えます。
$ mkdir ~/backup
$ mv ./* ~/backup/
$ mv ~/backup/.git ./
$ mv ~/backup/_site/* ./
$ git add .
$ git commit -m "First draft"
リポジトリのコンテンツは、ユーザーのホーム ディレクトリにバックアップされます。
そして最後にgithubにプッシュします
$ git push --u origin gh-pages
自分の Web サイトのディレクトリで、 _config.ymlファイルを編集します。
url : " https:<domain-name> "以下を使用して Web サイトを構築します。
$ JEKYLL_ENV=production bundle exec jekyll build
フォルダー_siteの内容をサーバー (おそらくwwwにコピーします。
必要に応じて、このディレクトリを提供するようにサーバーを構成します。
バグレポートとプルリクエストは、GitHub (https://github.com/apehex/jekyll-theme-consulting) で受け付けています。このプロジェクトは、安全で居心地の良いコラボレーションの場となることを目的としており、貢献者は貢献者規約の行動規範を遵守することが期待されています。
このテーマを開発するための環境を設定するには、 bundle install実行します。
テーマをテストするには、 bundle exec jekyll serveを実行し、ブラウザでhttp://localhost:4000を開きます。これにより、テーマを使用して Jekyll サーバーが起動します。通常どおりページ、ドキュメント、データなどを追加して、テーマのコンテンツをテストします。テーマとコンテンツを変更すると、サイトが再生成され、通常と同様に、更新後にブラウザに変更が表示されるはずです。
テーマがリリースされると、 _layouts 、 _includes 、 _sass内のファイルと、Git で追跡されたassetsのみがバンドルされます。カスタム ディレクトリを theme-gem に追加するには、それに応じてjekyll-theme-consulting.gemspecの正規表現を編集してください。
@ajlkn の作品からインスピレーションを受けました。
Cookie 同意プラグインの基本テンプレートを使用します。
シンプルな Jekyll 検索プラグインを使用します。
バナー内の宇宙画像: 創造の柱、NASA 提供。
このテーマは、CC-BY-NC-SA-4.0 の条件に基づいてオープン ソースとして利用できます。
