Crie conteúdo, obtenha um site altamente otimizado
css e a tag de modelo cssInstale -o usando npm ou fios com um comando simples
yarn add contentz
# npm install contentz Depois de instalar o Contentz, você pode usá -lo com um comando simples.
contentz buildIsso lerá seus arquivos e gerará seu site para você.
Crie um arquivo de configuração chamado config.yml
---
title : Sergio Xalambrí
description : Senior Software Engineer and Technical Writer
domain : https://sergiodxa.com
language : en
repository : https://github.com/sergiodxa/personal-site/
email : [email protected]
patreon : sergiodxa
analytics : UA-XXXXXXXXX-2
social :
twitter : sergiodxa
github : sergiodxa
npm : sergiodxa
linkedin : sergiodxa
dev : sergiodxa
meetup : 182915204
navigation :
- name : About
path : /about
- name : Services
path : /services| Opção | Descrição | Obrigatório |
|---|---|---|
| título | O título do site, usado no <title> e na página inicial | Não (padrão: Just another Contentz site ) |
| descrição | A descrição do site, usada no <meta> e na página inicial | Não (padrão: descrição vazia) |
| domínio | O domínio que você vai usar para hospedar o site, usado no feed RSS | Sim |
| linguagem | O idioma principal do site, usado como fallback para artigos e páginas | Não (padrão: en) |
| repositório | O repositório do Github que hospeda o site, usado no rodapé de artigos e páginas | Não (padrão: ocultar link para editar) |
| Seu endereço de e -mail, usado no ícone de e -mail na página inicial | Não (padrão: ocultar ícone) | |
| Patreon | Seu nome de usuário Patreon, usado na página inicial e no rodapé | Não (padrão: mensagem Hiden Patreon) |
| análise | Sua análise ua | Não (padrão: ocultar análise) |
| social | Uma lista de suas redes sociais, usadas para vinculá -las na página inicial | Não (padrão: ocultar ícones sociais) |
| navegação | Uma lista de páginas para vincular no cabeçalho | Não (padrão: não adicione links extras) |
| SW | Defina -o como false se você quiser desativar a geração SW | Não (padrão: true) |
| incremental | Defina -o como false se você quiser desativar a construção incremental | Não (padrão: true) |
| ícone | Defina o caminho do favicon do site | Não (padrão: /static/favicon.png ) |
Para outras redes sociais, envie um PR com um novo ícone e adicione uma maneira de formatar o URL para esse ícone.
Crie uma pasta /articles e coloque seus arquivos .mdx lá, aqui está um exemplo de postagem.
---
title : My super cool article
description : This is the description of the article
date : 2018-01-01T00:00:00.000Z
published : true
---
This is my content, here I could use markdown or import a component and render it. Agora execute contentz e ele criará um diretório /public com sua página inicial, página de arquivamento e artigo. Você pode acessar seu arquivo em /articles/ e cada artigo como /articles/:article/ , no exemplo em que você pode vê-lo em /articles/my-super-cool-article .
Para páginas personalizadas, crie a pasta A /pages e coloque seus arquivos .mdx lá, aqui está uma página de exemplo.
---
title : About me
---
Hi! I'm an example page. Agora execute contentz e ele criará um diretório /public com sua página inicial e páginas. Cada página será colocada no nível básico do public , isso significa que você /pages/about.mdx pode ser acessado como /about/ no seu navegador e não /pages/about .
Caso você queira ter uma página para compartilhar links interessantes, você pode criar um arquivo link.yml na raiz do seu projeto. Em seguida, execute contentz e ele gerará automaticamente a /link/ página para você com uma lista de todos os seus links. Cada link deve ter url , title , comment e chave date . Arquivo de exemplo:
---
- url : https://sergiodxa.com/
title : Sergio Xalambrí
comment : The website of the creator of Contentz
date : 2019-01-28T19:44:10.945Z
- url : https://sergiodxa.dev/
title : sergiodxa.dev
comment : The alias of the website of the creator of Contentz
date : 2019-01-28T19:44:10.945Z O Contentz gerará automaticamente uma página de erro no /404.html , ao implantar que você pode redirecionar não encontrado páginas para /404.html .
Se você implantar para netlify, ele captará esse arquivo automaticamente.
O Contentz gera um SW automaticamente para você, este SW cache todas as solicitações para seu próprio site (usando location.origin ). Não irá cache a solicitação para outro domínio.
Esse comportamento pode ser desativado adicionando sw: false ao seu arquivo config.yml . Adicionar isso também excluirá de sw.js e load-sw.js para evitar o acesso em cache ao e criar o arquivo unload-sw.js .
O Contentz gerará um Atom RSS válido alimentando automaticamente com sua lista de artigos, ele será colocado em /atom.xml e uma tag <meta> será adicionada automaticamente para você em cada página para torná -la descoberta.
Se você deseja vincular a arquivos estáticos, como imagens, vídeos, etc. Crie uma pasta /static e coloque todos os seus arquivos lá. Ao executar content eles serão copiados automaticamente para /public/static
Caso você queira adicionar uma tag HTML com estilos personalizados diretamente no seu conteúdo MDX, você pode usar o suporte css e a tag de emoção do modelo css .
Exemplo:
< div css = { { color : "red" } } > This is red </ div >
< div css = { css `color: blue` } > This is blue < / div> O Contentz detectará quais arquivos alteraram e atualizarão apenas os arquivos relacionados. Isso significa que se você adicionar apenas um novo link /link/ será regenerado, mas se você alterar um artigo, as páginas do artigo, a lista de artigos e o feed RSS serão regenerados.
No caso, você atualiza a configuração ou atualiza a versão Contentz, todas as páginas serão regeneradas.
Se você deseja desativar esse conjunto de recursos incremental: false em seu config.yml . Isso invalidará automaticamente caches anteriores e sempre gerará todas as páginas.
O Contentz também pode gerar automaticamente imagens sociais (também conhecido como gráfico aberto) para você usar em seus artigos e páginas. Para usá -lo, execute o comando:
contentz social [path] Onde [path] é o arquivo a ser usado para gerar a imagem social. Também pode ser mais de um arquivo adicionando um espaço entre eles.
contentz social [path1] [path2]Um caminho pode ser um caminho para um artigo, uma postagem ou uma das páginas geradas automaticamente.
Se você quiser gerá -los inicialmente
contentz social home articles links error Depois de gerar as imagens sociais, você verá uma pasta /static/_social com suas imagens, as páginas serão colocadas em /static/_social/pages and Artigos em /static/_social/article , as páginas especiais estarão na raiz do _social .
O Contentz suporta i18n fora da caixa para os textos fixos do site, texto como o suporte do Patreon ou editar no GitHub. Para alterar o idioma principal do seu site, defina o language principal ou o lang Key (o idioma é preferido) para o código do idioma.
Os idiomas suportados são es para espanhol e en para inglês (padrão para o inglês em caso de código de idioma inválido).
Se o seu idioma não for suportado, adicione um JSON com as mensagens e carregue -o no i18n lib. Em seguida, envie um PR para adicioná -lo.