Pessoas com permissões de gravação para um repositório podem adicionar um tema a um site do GitHub Pages usando Jekyll.
Alterações no seu site serão publicadas automaticamente quando forem mescladas na fonte de publicação do seu site. Se você desejar pré-visualizar suas alterações primeiro, você poderá fazer as alterações localmente em vez de fazer em GitHub AE. Em seguida, teste seu site localmente. Para obter mais informações, confira "Testar o site do GitHub Pages localmente com o Jekyll".
Adicionar um tema
- Em GitHub AE, acesse o repositório do seu site.
- Navegue até a fonte de publicação do seu site. Para obter mais informações, confira "Configurar uma fonte de publicação para o site do GitHub Pages".
- Procure _config.yml.
- No canto superior direito da exibição de arquivo, clique em para abrir o editor de arquivos.
-
Adicione uma nova linha ao arquivo para o nome do tema.
- Para usar um tema com suporte, digite
theme: jekyll-theme-THEME-NAME
, substituindo THEME-NAME pelo nome do tema, conforme mostrado no LEIAME do repositório do tema. Para ver a lista de temas com suporte, confira "Temas com suporte" no site do GitHub Pages. Por exemplo, para selecionar o tema Mínima, digitetheme: jekyll-theme-minimal
. - Para usar qualquer outro tema do Jekyll hospedado no GitHub, digite
remote_theme: THEME-NAME
, substituindo THEME-NAME pelo nome do tema, conforme mostrado no LEIAME do repositório do tema.
- Para usar um tema com suporte, digite
-
No campo "Mensagem do commit", digite uma mensagem curta e relevante que descreva a alteração que você fez no arquivo. Você pode atribuir o commit a mais de um autor na mensagem de commit. Para obter mais informações, confira "Criar um commit com vários autores".
-
Abaixo dos campos de mensagem do commit, opte por adicionar o commit ao branch atual ou a um novo branch. Se seu branch atual for o branch-padrão, você deverá optar por criar um novo branch para seu commit e, em seguida, criar um pull request. Para obter mais informações, confira "Como criar uma solicitação de pull".
-
Clique em Fazer commit de alterações ou em Propor alterações.
Personalizar o CSS do tema
O repositório de origem do seu tema pode oferecer alguma ajuda na personalização do tema. Por exemplo, confira o LEIAME da Mínima.
-
Em GitHub AE, acesse o repositório do seu site.
-
Navegue até a fonte de publicação do seu site. Para obter mais informações, confira "Configurar uma fonte de publicação para o site do GitHub Pages".
-
Crie um arquivo chamado /assets/css/style.scss.
-
Adicione o seguinte conteúdo ao topo do arquivo:
--- --- @import "{{ site.theme }}";
-
Adicione qualquer CSS ou Sass personalizado que desejar (incluindo as importações) imediatamente após a linha
@import
.
Personalizar o layout HTML do tema
O repositório de origem do seu tema pode oferecer alguma ajuda na personalização do tema. Por exemplo, confira o LEIAME da Mínima.
- No GitHub, navegue até o repositório de origem do tema. Por exemplo, o repositório de origem do Mínima é https://github.com/pages-themes/minimal.
- Na pasta _layouts, procure o arquivo default.html do tema.
- Copie o conteúdo do arquivo.
- Em GitHub AE, acesse o repositório do seu site.
- Navegue até a fonte de publicação do seu site. Para obter mais informações, confira "Configurar uma fonte de publicação para o site do GitHub Pages".
- Crie um arquivo chamado _layouts/default.html.
- Cole o conteúdo do layout padrão que você copiou anteriormente.
- Personalize o layout como desejado.