Site de demonstração | Registro de alterações
Yue é um tema Hugo minimalista, multilíngue e personalizável, adequado para blogs.
As capturas de tela podem estar desatualizadas, então é melhor visitar o site de demonstração.
Modo claro na área de trabalho
Modo escuro na área de trabalho
Modo claro no celular
Modo escuro no celular
Aparência mínima
Fácil de instalar (com Git e Hugo instalados, crie um site em poucos segundos)
Documentação detalhada
Modo escuro automático
Multilíngue
Lista de tradução em uma única página
Seletor de idioma (vá para a página ou página inicial correspondente)
Vários autores
Índice (dobrável, gerado apenas quando disponível)
Data de modificação na página inicial, página única, página de seção e página de termo
Formato de data personalizado
Paginação na página inicial e na página da seção
RSS de texto completo
Tags e categorias
Aviso de direitos autorais (autor e período de ano podem ser definidos)
Links RSS
Link de âncora de título
Mobile-first e responsivo
SCSS
Otimização de mecanismos de pesquisa
Microdados
meta descrição
Abrir gráfico
Contagem de páginas por seções ( /posts/
, /tags/
, etc.)
Personalização
Favicon
Estilos (SCSS)
Conteúdo (HTML)
Para descobrir todos os recursos, verifique hugo.yaml (configuração padrão) e exampleSite/hugo.yaml (configuração do site de demonstração).
Instale o Git e o último Hugo estendido.
# Crie o sitegit init meu-sitecd meu-site# Instale o submódulo themegit add --profundidade=1 https://github.com/CyrusYip/hugo-theme-yue temas/hugo-theme-yue git commit --message "adicionar tema"# Criar demonstração contentcp --recursive temas/hugo-theme-yue/exampleSite/* .# Previewhugo server
Agora temos um site de demonstração funcionando. O diretório content
contém o conteúdo e hugo.yaml
é o arquivo de configuração. Sinta-se à vontade para brincar com eles.
cd meu-site atualização do submódulo git --remote
É recomendado ler CHANGELOG.md antes de atualizar o tema.
Você pode assinar atualizações e o changelog em um agregador de feeds (por exemplo, Inoreader).
Atualizações: https://github.com/CyrusYip/hugo-theme-yue/commits/main.atom
Registro de alterações: https://github.com/CyrusYip/hugo-theme-yue/commits/main/CHANGELOG.md.atom
Você precisa usar opções adicionais ao clonar o projeto do seu site.
git clone --recurse-submodules --shallow-submodules [email protected]:seu-nome de usuário/meu-website.git
Depois de configurar o site, você provavelmente desejará hospedá-lo na Internet. Existem muitos métodos para fazer isso, consulte Hospedagem e implantação | Hugo. Se você não sabe o que escolher, pode começar pelo Netlify, consulte Host no Netlify | Hugo.
Certifique-se de alterar baseURL para o seu nome de domínio (por exemplo, https://my-cool-domain.org/
) em hugo.yaml
.
-baseURL: https://yue.cyrusyip.org/+baseURL: https://my-cool-domain.org/
Comando de compilação recomendado:
hugo --gc --minify
--gc
remove arquivos de cache não utilizados e --minify
reduz o tamanho do site (principalmente HTML).
Crie uma nova postagem.
hugo new content content/en/posts/my-first-post.md
Para saber mais sobre o uso, consulte:
Uso básico | Hugo
Estrutura de diretórios | Hugo
As configurações estão listadas em exampleSite/hugo.yaml (configuração do site de demonstração) e hugo.yaml (configuração padrão, importada pelo primeiro).
Na raiz do projeto do seu site, hugo.yaml
é o arquivo de configuração, que é uma cópia de exampleSite/hugo.yaml.
Para aprender a configuração, veja Configurar Hugo | Hugo.
Idiomas suportados:
en
: Inglês
fr
: francês
zh-CN
: chinês simplificado
Para criar um site multilíngue, consulte Modo multilíngue | Hugo e exemploSite/hugo.yaml.
Os arquivos de tradução estão localizados no diretório i18n e data/i18n.yaml. Contribuições para idiomas adicionais são bem-vindas.
Para contribuir com um novo idioma:
Crie um arquivo de idioma (por exemplo, fr.yaml
para francês) no diretório i18n.
Copie o conteúdo de i18n/en.yaml para o novo arquivo.
Remova todos os comentários ( # ...
) e traduza o conteúdo.
Traduza o conteúdo em data/i18n.yaml também.
Se quiser continuar contribuindo com a tradução, você pode obter as alterações mais recentes assinando o feed de i18n/en.yaml (https://github.com/CyrusYip/hugo-theme-yue/commits/main/i18n/en.yaml .atom) usando um leitor RSS.
Se o seu site não estiver em inglês, você provavelmente desejará personalizar o título de /tags
e /categories
.
Por exemplo, para personalizar o título /tags
do site zh-CN
, crie content/zh-CN/tags/_index.md
e adicione o seguinte conteúdo ao arquivo.
--- title: Chinese Tags ---
Yue permite personalizar favicon, estilos (SCSS) e conteúdo (HTML).
Favicon é o ícone próximo ao título em uma guia do navegador. Para usar seu favicon, coloque favicon.ico
no diretório static
. Você pode criar favicon.ico
em geradores favicon.ico online.
Yue usa SCSS (libsass) para adicionar estilos. Todos os arquivos estão em assets/scss. Para personalizar estilos, crie assets/scss/_style-start.scss
e assets/scss/_style-end.scss
.
_style-start.scss
é aplicado primeiro e você pode substituir variáveis neste arquivo.
$ tamanho da fonte base: 15px;
_style-end.scss
é aplicado por último e você pode adicionar estilos neste arquivo.
Vanilla CSS também é válido em SCSS.
Referências:
CSS: folhas de estilo em cascata | MDN
Sass: Noções básicas de Sass
Estrutura de diretórios | Hugo
Você pode criar esses arquivos para inserir código HTML.
layouts/partials/head/head-start.html
layouts/partials/head/head-end.html
layouts/partials/single/single-end.html
layouts/partials/body/body-end.html
head-start.html
é adicionado próximo ao início do elemento .
Casos de uso:
Pré-carregar scripts
Carregar scripts
Carregar estilos
Aqui está um exemplo de pré-carregamento de scripts:
head-end.html
é adicionado ao final do elemento .
Casos de uso:
Carregar scripts
Carregar estilos
Aqui está um exemplo de adição do Google Analytics e um script local:
{{ com recursos.Get "js/my-script .js" | js.Build }} {{ end }}
single-end.html
é adicionado ao final do elemento em uma postagem.
Casos de uso:
serviços de comentários, por exemplo, Disqus e giscus
Aqui está um exemplo de adição de Giscus:
{{ $idioma := "" }} {{- /* Solução alternativa para LanguagePrefix em letras minúsculas, veja https://github.com/gohugoio/hugo/issues/9404 */ -}} {{ if eq site.LanguagePrefix "/zh-cn" }} {{ $idioma = "zh-CN" }} {{ outro }} {{ $idioma = "en" }} {{ end }}
Lista de serviços de comentários: Comentários | Hugo.
body-end.html
é adicionado ao final do elemento .
Casos de uso:
Carregar scripts dinamicamente
Para relatar bugs, envie um problema. Para fazer perguntas, inicie uma discussão.
Hugo tem muitos recursos, leia a documentação do Hugo para aprender.
Consulte CHANGELOG.md.
Este projeto usa hugo-bin - npm para gerenciar a versão Hugo. Pré-requisito: Node.js e npm.
Clone este repositório.
instalação npm npm execute limpo: servidor: compartilhado
Existem outros comandos úteis listados em package.json. Para usar a versão recomendada do Hugo, execute npx hugo
.
Se você não possui o Node.js e o npm instalados, basta instalar a versão listada em package.json.
"hugo-bin": { "buildTags": "extended", "versão": "x.yyy.z"},
CHANGELOG.md deve ser atualizado em cada commit.
Se você estiver usando o Yue e o código-fonte do seu site estiver hospedado no GitHub, você pode adicionar o tópico hugo-theme-yue
ao seu repositório.
Link para o tópico hugo-theme-yue
.
Aprendi muito com muitos projetos. Obrigado, desenvolvedores.
hugo-xmin (modelos mínimos)
hugo-theme-jane (modelo RSS)
hugo-theme-zen (seletor de idioma)
hugo-theme-gruvbox (cor)
gruvbox (cor)
hugo-theme-stack (código fonte, documentação e configuração)
hugo-PaperMod (código fonte, documentação e configuração)
Este projeto está licenciado pelo MIT.