Crie conteúdo, obtenha um site altamente otimizado
css
e a tag de modelo css
Instale -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 build
Isso 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.