web-dev-qa-db-ja.com

既存のJekyllインストールでテーマを切り替える

ジキルには多くのテーマがあります。 https://github.com/jekyll/jekyll/wiki/Themes

既存のJekyllインストールで新しいテーマに切り替える最も簡単な方法は何ですか?

42
majom

couldcould(-===-)は、新しいテーマをフォークし、CSS、JS、HTMLなどのリソースを_includes_layoutsに手動でコピーして貼り付けることにより、既存のインストールに移行できますあなたが必要とするかもしれない他のファイル、これはおそらくあなたが同じ名前のものではないかもしれないが、それらがそうであるシナリオでは古いリソースと新しいリソースのマッシュアップを持っているので、素晴らしいアイデアではないでしょう投稿が参照する古いスタイルシートを上書きしないでください)、CSSスタイルが混在する原因となり、デバッグしてゆっくり修正する必要があります。

GitでJekyllをインストールしていると仮定しているので(実際にそうしない場合)、new-themeと呼ばれるブランチを作成し、切り替えることができます作業ブランチとしてmasterからそのブランチに。 (Gitブランチを処理したくない場合は、Jekyllインストール全体をコピーしてold-Jekyll-installとして別の場所に貼り付けるのが簡単な方法です(ただし、実際に行う必要があります。 チュートリアルはこちら =それは私が学ぶのを助けました)

  1. 新しいテーマのファイルをプルダウンします。
  2. _postsとカスタマイズした変更を手動でコピーします。
  3. _config.ymlを手動で比較し、必要なものを移動して移植します。
  4. サイトを構築して、不足しているもの、混乱している可能性のあるものを確認します(たとえば、過去にスペースのためにいくつかの<br \>タグを追加したかもしれませんが、新しいテーマでは不要です)。
  5. masterとマージする(または本番環境にプッシュする)

とはいえ、これはすべてかなり手作業であり、苦痛ですが、少なくともリソースの競合に対処する必要はありません。ただし、これを行うことの欠点は、リポジトリがテーマリポジトリと同期されないことです。したがって、アップストリームの更新は取得されません。テーマリポジトリをforkして、Jekyllサイトの個人用カスタマイズを移植し、そのリポジトリの名前を本番用に変更することをお勧めします。 (もちろん、これは「既存の」Jekyllインストールを使用しなくなります)

17
matrixanomaly

これは、既存のJekyllインストールのテーマを変更するために行ったことです。ニーズに合わせてこれらの指示を調整してください。

新しいテーマを引き出します

新しい孤立ブランチnewthemeを作成し、それが空であることを確認します。

git checkout --Orphan newtheme
git rm -rf .
git clean -dfx

次に、テーマをアップストリームリモートとして追加して、テーマファイルをその中に取り込みます。この例では、John OtanderのPixyllテーマのmasterブランチをプルします。

git remote add upstream https://github.com/johnotander/pixyll.git
git fetch upstream
git pull upstream master

テーマをビルドしてテストします。

bundler install
jekyll serve

変更をマージする

次に、投稿、構成などをマージします。Gitcheckoutを使用して、古いJekyllサイトからファイルまたはフォルダーをコピーできます。これにより、テーマのファイルが存在する場合は上書きされることに注意してください。

git checkout master -- _posts

または、たとえば手動でマージするために、新しい名前でファイルをコピーできます。

git show master:_config.yml > _config.yml.old

誤ってテーマファイルを上書きした場合は、復元できます。

git checkout upstream/master -- about.md

これらは、コピー、マージ、調整、または削除する必要があったファイルです。

  • ルートフォルダー内のマークダウンファイル。
  • _postsフォルダー内の投稿。
  • _draftsフォルダーの下書き。
  • _config.yml構成ファイル。
  • Gemfile gemファイル。
  • CNAMEファイル(GitHubページ用)。
  • Rakefile(ある場合)。
  • ファビコンファイル(存在する場合)。
  • Googleアナリティクス、Disqus、SEOフィールド(ある場合)などの手動テーマの変更。

変更をコミットし、テーマを再度テストすることを忘れないでください。

マスターブランチを置き換える

最後に、既存のmasterブランチを新しいnewthemeブランチに置き換えます。 newthemeブランチにいると仮定します:

git checkout newtheme
git merge -s ours master
git checkout master
git merge newtheme

変更をプッシュします。

git Push

そして、ローカルnewthemeブランチをクリーンアップします。

git branch -d newtheme

それでおしまい!テーマを正常に置き換えました。私が見逃したもの、または追加するものがある場合は、コメントを残してください。


テーマを更新する

後の時点で、最新のアップストリームの変更を含むようにテーマを更新する場合は、次のようにします。

git pull upstream master

マージの競合を修正します。ここでは、upstreamリモートがまだテーマのリポジトリに設定されていると想定しています(git remote -vで確認できます)。

Jekyll v3.2 導入 gemベースのテーマ (将来の計画については here を参照):

宝石ベースのテーマを使用すると、テーマ開発者は、テーマ宝石を持っている人なら誰でも簡単に更新を利用できます。更新がある場合、テーマ開発者は更新をRubyGemsにプッシュします

Gemベースのテーマの目標は、すべてのテーマのファイルが邪魔になったり、主な焦点であるコンテンツの作成を過度に複雑にしたりすることなく、堅牢で継続的に更新されるテーマのすべての利点を得られるようにすることです。

Gemベースのテーマのインストールは簡単です:

  1. テーマをサイトのGemfileに追加します:gem "jekyll-theme-awesome"
  2. テーマをインストールします:bundle install
  3. テーマを有効にするには、サイトの_config.ymlに次を追加します:theme: jekyll-theme-awesome
  4. サイトを構築:bundle exec jekyll serve

テーマを切り替えるには、次のように動作するはずです。

  1. サイトのGemfileで新しいテーマに変更します:gem "jekyll-theme-new"
  2. テーマをインストールします:bundle install
  3. サイトの_config.ymlを変更して、新しいテーマを参照します:theme: jekyll-theme-new
  4. サイトを構築:bundle exec jekyll serve
  5. (オプション-マシンから古いテーマをアンインストールします)古いテーマのインストールフォルダー(bundle show jekyll-theme-awesome)を書き留め、gem uninstall jekyll-theme-awesomeでアンインストールします。安全のために、そのフォルダが実際に削除されたことを確認してください。

Gemベースのテーマの更新は簡単です:

テーマgemがある場合、(必要に応じて)bundle updateを実行してプロジェクト内のすべてのgemを更新できます。または、bundle update <THEME>を実行して、minimaなどのテーマ名に置き換えて、テーマgemを更新することもできます。テーマ開発者が作成した新しいファイルや更新(スタイルシートやインクルードなど)は、プロジェクトに自動的に取り込まれます。

重要な注意事項:執筆時点では、GitHubページは gemベースのテーマの特定のセットArchitectCaymanDinkyHackerうるう日MerlotMidnight最小最小モダニストスレートTactile、およびTime machine。これらのうち、Minimaのみがブログ指向であるようです(たとえば、Disqusサポートが組み込まれているのはMinimaのみです)。ただし、 Jekyllビルドプロセスを自分で実行する を使用する場合は、任意のテーマを使用できる必要があります。

別の選択肢は GitLabページチュートリアルサンプルサイト )です。

9
Ohad Schneider

GHページで

私は これをテストしました ですが、保存したいものが何もないプロジェクトで、かなり単純なテーマでそれを行いました。

  1. 安全のために、新しいブランチを作成してください

    git checkout -b newtheme
    
  2. そして、新しいテーマをリモートとして追加します

    git remote add new-theme-upstream https://github.com:drjekyllthemes/jekyll-minimal-theme.git
    git pull new-theme-upstream HEAD
    
  3. 面倒な部分は、マージの競合が多数発生することです。どのファイルがgit statusとマージ競合するかを確認します。これらの競合は、上書きするスタイルファイルにのみ存在することが望まれます。保持したいファイルがある場合は、テキストエディターで編集できます:gitはファイルの変更にラベルを付けます
  4. オリジンにプッシュ

    git Push Origin newtheme
    
  5. Githubのプロジェクトのページに移動すると、次のようなことがわかります。
  6. プルリクエストを作成し、新しい変更をマージします。
  7. プロジェクトはまだ最初のテーマの分岐として表示され、新しいテーマのアップストリームのプルリクエストを作成することはできません。ただし、git pull new-theme-upstreamを使用して、新しいテーマの新しい更新をマージできます

Gh-pagesを使用していない場合、またはgithubにプッシュする前にローカルでjekyllを構築している場合(私は思う)

テーマを別のフォルダーとしてgitサブモジュールに保持し、jekyllの主要な要素をシンボリックリンクすることができます。このは動作しませんgh-pages 粗雑な例

blog
|
+-- theme_1/
|
+-- theme_2/
|  |
|  +-- _layouts/
|
+-- _layouts ln - theme_2/_layouts

そうすれば、テーマを変更するときにテーマが衝突しません。

3
raphael

既存または新規のjekyllインストールでテーマを切り替える最も簡単な方法は、次のプラグインを使用することです: jekyll-remote-theme 、これは2017年11月から利用可能です。

現在ベータ版ですが、正常に動作し、最も重要なことはGithubページで既にホワイトリストに登録されているため、要求されたテーマにサポートされていないGemsが含まれていない限り、ローカルでビルドする必要はありません。

したがって、ページとブログのある単純なWebサイトの場合、Githubインフラストラクチャでコンテンツを直接ホストおよび編集し、新しいリモートテーマのアドレスを入力してサイトテーマを切り替えることができます。追加の利点は、 いくつかの既存のテーマ でコンテンツをテストしてから、それらのいずれかにコミットできることです。

簡単な切り替えに加えて、jekyll-remote-themeメソッドは、変更を加えて新しいものがあるとすぐに、新しいバージョンのリモートテーマを自動的に取り込む必要がありますテーマのメンテナーによるバージョン。テーマのメンテナーがあなたが気に入らない根本的な変更をした場合、あなたは常に新しいテーマからいくつかのキーストロークを離れています。

いくつかのjekyllのインストールがあり、当面は最もエレガントで将来性のあるソリューションであるため、短期間で切り替えるつもりはありませんが、すでに使用しています。

既存のjekyllインストールが純粋な場合(つまり、ページ、投稿、構成のみを編集した場合)、スイッチはシームレスです。既存のテーマに特別なものがある場合レイアウト(例:splash.htmlと新しいものにはない)の場合、それぞれのレイアウトを使用するページは孤立します(つまり、特別な書式設定のない基本的なhtml)。広範囲に編集された既存のインストールを切り替えたため、いくつかの孤立したページを取得しましたが、ここで説明した他の方法で可能なgitマージの競合は発生しませんでした。

1
epidrome