Publicamos atualizações frequentes em nossa documentação, e a tradução desta página ainda pode estar em andamento. Para obter as informações mais recentes, acesse a documentação em inglês. Se houver problemas com a tradução desta página, entre em contato conosco.

Adicionar um tema ao site do GitHub Pages usando Jekyll

É possível personalizar o site do Jekyll adicionando e personalizando um tema.

GitHub Pages is available in public repositories with GitHub Free, and in public and private repositories with GitHub Pro, GitHub Team, GitHub Enterprise Cloud, and GitHub Enterprise Server. For more information, see "GitHub's products."

Neste artigo

Pessoas com permissões de gravação para um repositório podem adicionar um tema a um site do GitHub Pages usando Jekyll.

Changes to your site are published automatically when the changes are merged into your site's publishing source. If you want to preview your changes first, you can make the changes locally instead of on GitHub. Then, test your site locally. Para obter mais informações, consulte "Testar seu site do GitHub Pages localmente com o Jekyll".

Adicionar um tema

  1. On GitHub, navigate to your site's repository.

  2. Navigate to the publishing source for your site. Para obter mais informações sobre fontes de publicação, consulte "Sobre o GitHub Pages".

  3. Navegue até _config.yml.

  4. No canto superior direito da exibição do arquivo, clique em para abrir o editor de arquivos.

    Botão Edit file (Editar arquivo)

  5. Adicione uma nova linha ao arquivo para o nome do tema.

    • Para usar um tema compatível, digite theme: THEME-NAME, substituindo THEME-NAME pelo nome do tema, como mostrado no LEIAME do repositório do tema. Para obter uma lista de temas compatíveis, consulte "Temas compatíveis" no site do GitHub Pages.
      Supported theme in config file
    • Para usar qualquer outro tema do Jekyll hospedado em GitHub, digite remote_theme: THEME-NAME, substituindo THEME-NAME pelo nome do tema, como mostrado no LEIAME do repositório do tema.
      Unsupported theme in config file
  6. At the bottom of the page, type a short, meaningful commit message that describes the change you made to the file. You can attribute the commit to more than one author in the commit message. For more information, see "Creating a commit with multiple co-authors."

    Mensagem do commit para sua alteração

  7. Below the commit message fields, click the email address drop-down menu and choose a Git author email address. Only verified email addresses appear in this drop-down menu. If you enabled email address privacy, then <username>@users.noreply.github.com is the default commit author email address. Para obter mais informações, consulte "Configurar o endereço de e-mail do commit".

    Choose commit email addresses

  8. Abaixo dos campos de mensagem do commit, opte por adicionar o commit ao branch atual ou a um novo branch. If your current branch is master, you should choose to create a new branch for your commit and then create a pull request. For more information, see "Creating a new pull request."

    Opções para fazer commit no branch

  9. Clique em Propose file change (Propor alteração no arquivo).

    Propose file change button

Personalizar o CSS do tema

These instructions work best with themes that are officially supported by GitHub Pages. For a complete list of supported themes, see "Supported themes" on the GitHub Pages site.

Your theme's source repository may offer some help in customizing your theme. For example, see "Minima's README."

  1. On GitHub, navigate to your site's repository.

  2. Navigate to the publishing source for your site. Para obter mais informações sobre fontes de publicação, consulte "Sobre o GitHub Pages".

  3. Crie um novo arquivo chamado /assets/css/style.scss.

  4. Adicione o seguinte conteúdo ao topo do arquivo:

    ---
    ---
    
    @import "";
    
  5. Adicione o CSS ou Sass personalizado (incluindo importações) que deseja imediatamente após a linha @import.

Personalizar o layout HTML do tema

These instructions work best with themes that are officially supported by GitHub Pages. For a complete list of supported themes, see "Supported themes" on the GitHub Pages site.

Your theme's source repository may offer some help in customizing your theme. For example, see "Minima's README."

  1. No GitHub, navegue até o repositório de origem do tema. Por exemplo, o repositório de origem do Minima é https://github.com/jekyll/minima.

  2. Na pasta _layouts, navegue até o arquivo default.html do tema.

  3. Copie o conteúdo do arquivo.

  4. On GitHub, navigate to your site's repository.

  5. Navigate to the publishing source for your site. Para obter mais informações sobre fontes de publicação, consulte "Sobre o GitHub Pages".

  6. Crie um arquivo chamado _layouts/default.html.

  7. Cole o conteúdo do layout padrão que você copiou anteriormente.

  8. Personalize o layout como desejado.

Leia mais

Pergunte a uma pessoa

Não consegue encontrar o que procura?

Entrar em contato