f272eec944
* ran script/remove-unused-assets.js (manually removed unused variables printed by the script) * package-lock * turn elsif into two ifs to prepare for running Liquid deprecation script * ran script/remove-deprecated-enterprise-version-markup.js --release 2.14 (ONLY UPDATES LINE BREAKS ETC.) * ran script/remove-deprecated-enterprise-version-markup.js --release 2.15 * ran script/remove-deprecated-enterprise-version-markup.js --release 2.17 * ran script/remove-deprecated-enterprise-version-markup.js --release 2.18 * update hardcoded test * Update content/github/collaborating-with-issues-and-pull-requests/filtering-files-in-a-pull-request.md Co-authored-by: Matt Pollard <mattpollard@users.noreply.github.com> * add currentVersion is NOT free-pro-team to conditional, to make sure the deprecation script does the right thing when it is time to deprecate 2.21 Co-authored-by: Matt Pollard <mattpollard@users.noreply.github.com>
3.0 KiB
3.0 KiB
title, intro, redirect_from, product, versions
| title | intro | redirect_from | product | versions | |||||||
|---|---|---|---|---|---|---|---|---|---|---|---|
| Adding a theme to your GitHub Pages site using Jekyll | You can personalize your Jekyll site by adding and customizing a theme. |
|
{% data reusables.gated-features.pages %} |
|
People with write permissions for a repository can add a theme to a {% data variables.product.prodname_pages %} site using Jekyll.
{% data reusables.pages.test-locally %}
Adding a theme
{% data reusables.pages.navigate-site-repo %} {% data reusables.pages.navigate-publishing-source %} 2. Navigate to _config.yml. {% data reusables.repositories.edit-file %} 4. Add a new line to the file for the theme name.
- To use a supported theme, type
theme: THEME-NAME, replacing THEME-NAME with the name of the theme as shown in the README of the theme's repository. For a list of supported themes, see "Supported themes" on the {% data variables.product.prodname_pages %} site.
- To use any other Jekyll theme hosted on {% data variables.product.prodname_dotcom %}, type
remote_theme: THEME-NAME, replacing THEME-NAME with the name of the theme as shown in the README of the theme's repository.
{% data reusables.files.write_commit_message %}
{% data reusables.files.choose-commit-email %}
{% data reusables.files.choose_commit_branch %}
{% data reusables.files.propose_file_change %}
Customizing your theme's CSS
{% data reusables.pages.best-with-supported-themes %}
{% data reusables.pages.theme-customization-help %}
{% data reusables.pages.navigate-site-repo %} {% data reusables.pages.navigate-publishing-source %}
- Create a new file called /assets/css/style.scss.
- Add the following content to the top of the file:
---
---
@import "{{ site.theme }}";
- Add any custom CSS or Sass (including imports) you'd like immediately after the
@importline.
Customizing your theme's HTML layout
{% data reusables.pages.best-with-supported-themes %}
{% data reusables.pages.theme-customization-help %}
- On {% data variables.product.prodname_dotcom %}, navigate to your theme's source repository. For example, the source repository for Minima is https://github.com/jekyll/minima.
- In the _layouts folder, navigate to your theme's default.html file.
- Copy the contents of the file. {% data reusables.pages.navigate-site-repo %} {% data reusables.pages.navigate-publishing-source %}
- Create a file called _layouts/default.html.
- Paste the default layout content you copied earlier.
- Customize the layout as you'd like.