Como estão estruturados os conteúdos do sitio web?#

Um sitio web construído em Hugo contém no mesmo local tanto o conteúdo como os programas que permitem implementar esses conteúdos na internet¹. Os conteúdos estão dentro de arquivos e não dentro de uma base de dados e por conseguinte podem ser facilmente editados pelas pessoas que alimentam o sitio.

Diretório de conteúdos#

Dentro do sitio existe um diretório (pasta) que contém os documentos que são criados para serem apresentados na internet. O diretório se denomina content. Dentro desse diretório se localizam outros subdiretórios que compõem a árvore ou estrutura de conteúdos. Cada diretório define uma sessão do sitio e pode ou não ter mais subdiretórios.

No seguinte exemplo é mostrada a estrutura básica de diretórios que compõem o Sitio Web. Dentro de uma pasta chamada content se encontra o índice geral do Sitio, chamado _index.md, que é a página início do Sitio. A seguir há mais pastas que contém outros documentos ou mesmos mais pastas, criando uma estrutura em forma de árvore que coincide com os links de acesso ao Sitio na internet.

Cada arquivo que possui extensão “markdown” (.md) e tem conteúdo que pode ser editado para ser publicado no Sitio Web.

Para saber mais sobre como editar textos usando “markdown” veja o tutorial nesse site.

# Nome do diretório  # Endereço de publicação no Sitio Web
content 
├── _index.md   <- https://ecovida.org.br 
├── info        # Sessão principal           
│   ├── FAQ.md  <- https://ecovida.org.br/info/faq
│   ├── _index.md  <- https://ecovida.org.br/info
│   └── sobre   # Sessão secundária
│       ├── _index.md  <- https://ecovida.org.br/sobre
│       ├── objetivos.md  <- https://ecovida.org.br/info/sobre/objetivos
│       ├── organizacao.md <- https://ecovida.org.br/info/sobre/organizacao
│       ├── principios.md <- https://ecovida.org.br/info/sobre/principios

Assim, para criar sessões dentro do sitio, é necessário criar diretórios contendo arquivos "_index.md" e criar os arquivos em markdown (extensão .md) com conteúdos dentro desse diretório. Cada sessão pode conter outras sessões.

Diagrama representando a estrutura de conteúdos#

%%{
  init: {
    'theme': 'base',
    'themeVariables': {
      'primaryColor': '#141718',
      'primaryTextColor': '#fff',
      'primaryBorderColor': '#7C0000',
      'lineColor': '#F8B229',
      'secondaryColor': '#006100',
      'tertiaryColor': '#fff'
    }
  }
}%%

graph TD
    subgraph x[<a href='https://ecovida.org.br/info/sobre'>Página sobre</a>]
    b3(sobre - _index.md) --> b4(objetivos - conteúdos)
    b3(sobre - _index.md) --> b5(organização - conteúdos)
    b3(sobre - _index.md) --> b6(principios - conteúdos)	
    end
    subgraph w[<a href='https://ecovida.org.br/info'>Página info</a>]
    b1(info - _index.md) --> b2(FAQ - perguntas frequentes - conteúdos) 
    b1(info - _index.md) --> b3(sobre - _index.md)
    end
	    subgraph z[<a href='https://ecovida.org.br'>Página inicial do Sitio Web</a>]
    a1(Contém página info \n e \n outras sessões) --> b1(info - _index.md)
    end