Apresentação
Este documento explica como compor o conteúdo das suas páginas.
Ao criar ou editar seções e posts, a caixa de edição do conteúdo permite que apenas textos sem formatação seja inserido. Mas sabemos da necessidade de inserir uma grande quantidade de elementos diferentes, como links, imagens, tabelas, títulos, ou mesmo formatar o texto com diferentes formas de destaque, superescritos, subscritos e tantos outros elementos.
Este é um desafio que está presente em vários sistemas, assim como várias soluções foram criadas para contorná-lo. Wikipédia, GitHub, PanDoc são apenas algumas das ferramentas que implementam maneiras de transformar um texto simples em uma apresentação mais rica.
Quem já está familiarizado com o markDown utilizado no PanDoc ou no GitHub, encontrará aqui muitas funcionalidades equivalentes, e na maioria dos casos nem precisará fazer alterações em seus documentos para publicá-los no Portal Ecolabore. Também usuários da Wikipédia encontrarão aqui algumas das funcionalidades presentes naquela plataforma.
Mas o Portal Ecolabore extende o leque de possibilidades com ferramentas próprias, permitindo que as personalizações que seriam muito difíceis de configurar através de texto possam ser feitas através de uma interface interativa.
Os princípios do MarkDown
O MarkDown utiliza caractéres especiais em meio ao texto para indicar a formatação ou inserir novos elementos.
Isso já era feito nas mensagens de correio eletrônico desde o princípio da Internet, então John Gruber com a ajuda de Aaron Swartz recolheu estes hábitos e definiu, em 2004, alguns padrões úteis.
A proposta do MarkDown é ser simples de utilizar e manter o texto "legível". De fato, quando observamos com atenção um documento criado com MarkDown, é na maioria das vezes bastante intuitivo o que cada marcação representa.
Mas como o público foi criando padrões ligeiramente diferentes, e o próprio MarkDown não define com clareza como algumas situações devem ser resolvidas, também surgiram diferentes formas de implementá-lo.
Tentamos ao máximo manter compatibilidade com o PanDoc e com o GitHub, mas infelizmente não é possível implementar todas as funcionalidades de maneira idêntica. Por isso, mesmo que você já esteja familiarizado com o MarkDown em uma destas plataformas, sugerimos que leia este documento para não ter surpresas.
A característica mais estranha do MarkDown é sua forma de tratar quebras de linhas acidentais. Os sistemas de mensagens mais antigos limitavam as linhas de texto a apenas 76 caracteres. Inacreditavelmente estes protocolos sobreviveram até hoje, de tal forma que mesmo os mensageiros mais modernos ainda irão respeitar esta norma e irão truncar as linhas muito longas em mensagens de texto. Isso transforma as mensagens em uma bagunça total, mas algumas regras simples podem contornar esse problema.
Sobre a marcação Ecolabore
Para que os usuários pudessem ter mais liberdade para compôr seus documentos, inclusive manipulando com segurança o HTML, criamos uma linguagem própria, simples, que é interpretada pelo PHP durante a renderização dos documentos.
Inicialmente o Portal Ecolabore tentará interpretar tudo o que está entre colchetes - "" como sendo instruções dessa linguagem. Por isso, algumas funcionalidades do MarkDown presentes no GitHub ou no PanDoc foram abandonadas em troca de métodos próprios.
Estrutura do documento
Parágrafos
É necessário deixar uma linha em branco separando os parágrafos.
Quebras de linha em meio ao texto serão consideradas quebras de linha acidentais e serão removidas.
O exemplo
Este é um parágrafo
com uma quebra de linha acidental
Este é outro parágrafo
Produz
Este é um parágrafo com uma quebra de linha acidental
Este é outro parágrafo
Títulos ao estilo Setext
Você pode criar títulos de nível 1 e títulos de nível 2 "sublinhando" os títulos com sinais de igual "=" e hifens "-".
O exemplo
Título de nível 1
=================
Título de nível 2
-----------------
Produz
Título de nível 1
Título de nível 2
Observe que normalmente os documentos já possuem um título de nível 1, portanto não recomendamos que você utilize esta funcionalidade. Ela está presente apenas para compatibilidade com outras ferramentas MarkDown. Dê preferência aos cabeçalhos ao estilo ATX.
Mais detalhes
Para que a Ecolabore Engine reconheça um título ao estilo Setext, são necessários pelo menos 3 caracteres consecutivos do mesmo tipo:
Título de nível 1
==
Título de nível 1 ==
A quantidade de caracteres da segunda linha não precisa coincidir com a quantidade de caracteres da primeira linha
Título de nível 1
====
Título de nível 2
----------------------------
Título de nível 1
Título de nível 2
Até 3 espaços no início de cada linha serão ignorados.
Títulos ao estilo ATX
Para criar títulos e subtítulos você deve iniciar a linha com um ou mais caractéres "#".
A quantidade de caractéres especiais no início da linha irão determinar o nível do tópico.
O exemplo
# Título de nível 1
## Título de nível 2
### Título de nível 3
#### Título de nível 4
##### Título de nível 5
###### Título de nível 6
Produz
Título de nível 1
Título de nível 2
Título de nível 3
Título de nível 4
Título de nível 5
Título de nível 6
Quando você cria um título no documento, ele automaticamente será adicionado ao sumário.
O símbolo de igual "=" pode ser utilizado para o mesmo fim. Porém, títulos criados desta forma não serão adicionados ao sumário. Se você deseja inserir um título a um bloco de conteúdo que estará recolhido, então esta será a escolha correta, pois o navegador não saberá conduzir o usuário corretamente se o link do sumário estiver apontando para um trecho de conteúdo oculto.
Mais detalhes
Após um ou mais caracteres de abertura é necessário pelo menos um espaço em branco.
#hashtag
#hashtag
Caracteres de fechamento em qualquer quantidade serão removidos
## Um título elegante ##
### Outro título elegante #########
Um título elegante
Outro título elegante
Até 3 espaços em branco no início de cada linha serão ignorados.
É permitido formatar o texto dos links.
Blocos de citação
O bloco de citação "empurra" o conteúdo um pouco para a direita e formata o texto de maneira diferente.
Para criar um bloco de citação, inicie cada linha do bloco com um sinal de maior ">".
O exemplo
> Um bloco de citação.
Produz
Um bloco de citação.
Um bloco de citação pode se extender por várias linhas e pode conter outras estruturas de conteúdo, inclusive blocos de citação.
O exemplo
> == Um título ==
>
> Um bloco de citação.
>
> > Outro bloco de citação.
Produz
Um título
Um bloco de citação.
Outro bloco de citação.
Blocos de linha
Se você precisa que as quebras de linha e os espaços iniciais de um texto sejam respeitados, então você pode iniciar cada nova linha com uma barra vertical "|". Isso será útil para citar endereços ou para produzir estrofes de um poema.
O exemplo
| As cores do árco-íris
| São sete eu já contei.
| Embaixo tem um tesouro
| Procuro, mas não achei.
As cores do árco-íris
São sete eu já contei.
Embaixo tem um tesouro
Procuro, mas não achei.
Separador temático
Para produzir uma régua de separação, basta inserir em uma linha 3 ou mais caracteres: "-", "_" ou "*". Não é permitido misturá-los!
O exemplo
***
---
___
Produz
Listas
Listas com marcadores
Para produzir uma lista, basta iniciar a linha com um dos caracteres: "*", "-" ou "+".
O exemplo
* Um item
* Outro item
* Mais um item
------
+ Um item
+ Outro item
+ Mais um item
------
- Um item
- Outro item
- Mais um item
Produz
-
Um item
-
Outro item
-
Mais um item
-
Um item
-
Outro item
-
Mais um item
-
Um item
-
Outro item
-
Mais um item
Listas ordenadas
Existem várias formas de criar listas ordenadas:
1. Primeiro item
2. Segundo item
3. Terceiro item
------
a) Ângelo
b) Bruno
c) Carla
------
#. Item numerado
#. Outro item numerado
#. Mais um item numerado
Produz
-
Primeiro item
-
Segundo item
-
Terceiro item
-
ngelo
-
Bruno
-
Carla
-
Item numerado
-
Outro item numerado
-
Mais um item numerado
Sublistas
Mais conteúdos em um item da lista
Exemplos de códigos
Blocos de código indentados
Para inserir um exemplo de código, basta indentar as linhas com 4 espaços ou mais.
O exemplo
if($a < 3){
$x = $a / 2;
}
Produz
if($a < 3){
$x = $a / 2;
}
Blocos de código cercados
É possível cercar um bloco de código com ~~~ ou ```.
O exemplo
~~~
if($document->access(4)){
$document->contentEditable = true;
}
~~~
Produz
if($document->access(4)){
$document->contentEditable = true;
}
Exemplo de código em meio ao texto
Utilize acentos graves "`" para inserir uma declaração literal em meio ao texto.
O exemplo
Em javaScript, utilize o método `preventDefault()` de um evento para impedir que o navegador execute uma ação predefinida.
Produz
Em javaScript, utilize o método preventDefault() de um evento para impedir que o navegador execute uma ação predefinida.
Tabelas
Tabelas de canudinhos
Uma tabela é criada iniciando cada linha com uma barra vertical "|", seguida pelo conteúdo das células separadas por barras verticais "|", e finalizando com uma barra vertical "|".
A primeira linha da tabela representa o cabeçalho enquanto a segunda linha é um separador que possui algumas características especiais. As demais linhas serão inseridas no corpo da tabela.
Aquantidade de caracteres em uma célula não precisa coincidir com a quantidade de caracteres de outras células da mesma coluna. Apenas cuide para que cada linha tenha a mesma quantidade de células para que a tabela seja renderizada corretamente.
O exemplo
| Caractere | Significado |
| --------- | ------------------ |
| + | Adição |
| - | Subtração |
| * | Multiplicação |
| / | Divisão |
Produz
| Caractere | Significado |
|---|---|
| + | Adição |
| - | Subtração |
| * | Multiplicação |
| / | Divisão |
A linha especial que separa o cabeçalho do corpo da tabela deve conter hifens no conteúdo de cada célula. A quantidade de hifens representa a largura de cada coluna em relação às suas vizinhas. Observe neste exemplo como a segunda coluna tem o dobro da largura da primeira.
Também é possível indicar o alinhamento do texto dentro das células de cada coluna. Dois pontos ":" à esquerda, à direita ou em ambos os lados indicam o alinhamento à esquerda, à direita ou centralizado respectivamente.
O exemplo
| Código | Descrição | Valor |
| :--: | :---------- | ----: |
| 001 | Caneca branca 300ml | 3,00 |
| 002 | Caneca verde 300ml | 3,20 |
| 003 | Porta-guardanapo | 10,00 |
| - | Guardanapos de papel 20 unidades | 1,00 |
Produz
| Código | Descrição | Valor |
|---|---|---|
| 001 | Caneca branca 300ml | 3,00 |
| 002 | Caneca verde 300ml | 3,20 |
| 003 | Porta-guardanapo | 10,00 |
| - | Guardanapos de papel 20 unidades | 1,00 |
Formatação avançada para tabelas
As tabelas sempre irão ocupar a largura total disponível, e suas cores dependerão do contexto onde foram inseridas.
Para dimensionar as tabelas com outras medidas, escolher outras cores e até mudar sua disposição na página, coloque-as em cartões personalizados.
O exemplo
[card:tabela_azul]
**Domingo**
| Cidade | Temperatura |
| :---------- | ---: |
| Brasília | 33 |
| Goiânia | 34 |
| Belho Horizonte | 30 |
[/card]
[card:tabela_verde]
**Segunda**
| Cidade | Temperatura |
| :---------- | ---: |
| Brasília | 32 |
| Goiânia | 32 |
| Belho Horizonte | 29 |
[/card]
Produz
Domingo
| Cidade | Temperatura |
|---|---|
| Brasília | 33 |
| Goiânia | 34 |
| Belho Horizonte | 30 |
Segunda
| Cidade | Temperatura |
|---|---|
| Brasília | 32 |
| Goiânia | 32 |
| Belho Horizonte | 29 |
Formatação de texto
Quebra forçada de linha
Uma quebra forçada de linha pode ser produzida terminando a linha com uma barra invertida "\", ou inserindo a sequência "\n" no local onde a quebra é desejada.
O exemplo
Um parágrafo\
com uma quebra de linha
Outro parágrafo\ncom quebra de linha
Produz
Um parágrafo
com uma quebra de linha
Outro parágrafo
ncom quebra de linha
Escape de caracteres especiais
A barra invertida "\" tem o dom de retirar os poderes do próximo caractere quando o próximo caractere for especial. Se o próximo caractere for um caractere comum, a barra invertida apenas irá desaparecer.
Você pode evitar que alguns caracteres especiais sejam utilizados para formatar seu texto
O exemplo
\# \= \^ \~ \* \[ \`
Produz
# = ^ ~ * [ `
Outras sequências também são reconhecidas:
| Sequência | Resultado | Comentário |
|---|---|---|
| \\ | \ | Produz uma \ literal |
| \n | <br> | Produz uma quebra de linha forçada |
| \& | & | Produz um & literal |
| \ | | Barra invertida seguida de um espaço produz um espaço "inquebrável" |
| \< | < | Produz um < literal |
| \" | " | Produz uma " literal |
Ênfase
Envolva um trecho com 1, 2 ou 3 asteríscos "*" para produzir menor ou maior ênfase.
O exemplo
Um texto com *destaque*, outra palavra com **mais destaque** e outra com ***ainda mais destaque***.
Produz
Um texto com destaque, outra palavra com mais destaque e outra com ainda mais destaque.
2 ou 3 caracteres sublinhados "_" também podem ser utilizados para o mesmo fim. Porém, como o caractere sublinhado também é utilizado frequentemente em programação para compor nomes de variáveis e funções, um único sublinhado "_" não produz efeito.
Utilize barra invertida "\" antes de asteríscos e sublinhados quando você deseja que percam seus poderes especiais.
Texto riscado (strikeout)
Envolvendo um trecho com dois tils "~~", o texto ficará riscado.
O exemplo
~~Um texto riscado~~
Produz
Um texto riscado
Utilize barra invertida "\" antes de cada til quando desejar que percam seus poderes especiais.
Superescrito
O circunflexo "^" tem o poder de elevar o texto.
O exemplo
O apartamento possui 83m^2^.
Produz
O apartamento possui 83m2.
Utilize barra invertida "\" antes de cada circunflexo quando desejar que percam seus poderes especiais.
Subscrito
O til "~" tem o poder de rebaixar o texto.
O exemplo
A molécula da água é expressa por H~2~O, onde H~2~ representa dois átomos de hidrogênio e O representa um átomo de oxigênio.
Produz
A molécula da água é expressa por H2O, onde H2 representa dois átomos de hidrogênio e O representa um átomo de oxigênio.
Utilize barra invertida "\" antes de cada til quando desejar que percam seus poderes especiais.
Links
Links automáticos
Quando desejar que um endereço (URL) seja convertido diretamente em um link, basta envolvê-lo com < e >.
Também funciona com endereços de e-mail.
O exemplo
Visite <https://ecolabore.net>
Não envie emails para <iamspam@ecolabore.net>
Produz
O Portal Ecolabore irá proteger os endereços de e-mail para que não sejam capturados por crawlers de SPAMS.
Links estilo markDown
Quando você deseja transformar um texto em um link, coloque o texto a ser acionado entre colchetes "[" e "]", e logo em seguida o endereço entre parênteses "(" e ")".
Atenção: Não utilize esta técnica para produzir links para endereços de e-mails. O Portal Ecolabore não é capaz de proteger links criados desta maneira, de tal forma que eles ficarão expostos aos crawlers de SPAM. Consulte neste manual outras formas seguras de criar links para e-mails.
O exemplo
Consulte mais informações na [Wikipédia](http://pt.wikipedia.org).
[Voltar ao topo](#top)
Produz
Notas de rodapé inline
Para criar uma nota de rodapé, coloque um circunflexo "^" seguido do trecho a ser transferido envolvido por colchetes "[" e "]".
O exemplo
O Portal Ecolabore possui técnicas para evitar que endereços de e-mails em suas páginas sejam capturados por crawlers de SPAMS^[Crawlers são programas que vasculham a Internet em busca de alguma informação. Neste caso, capturam endereços de e-mails para o envio de mensagens indesejadas.].
Produz
O Portal Ecolabore possui técnicas para evitar que endereços de e-mails em suas páginas sejam capturados por crawlers de SPAMS1.
1Crawlers são programas que vasculham a Internet em busca de alguma informação. Neste caso, capturam endereços de e-mails para o envio de mensagens indesejadas.
Links para verbetes do glossário
Ao bom estilo Wikipédia, quando você envolve um termo com colchetes duplos - [[DNS]] - ele se tornará um link para um verbete. Após salvar o documento, apenas acione o link para editar a página do verbete.
Se você deseja que os usuários tenham acesso a um glossário com todos os verbetes que você criou, crie uma nova seção do tipo "Glossário".
O exemplo
Para criar um site na Internet, você precisa registrar um [[domínio]] em um serviço de registro de nomes de domínio.
Utilizando o Portal Ecolabore, você pode compartilhar o domínio ecolabore.net gratuitamente.
Produz
Para criar um site na Internet, você precisa registrar um domínio em um serviço de registro de nomes de domínio.
Utilizando o Portal Ecolabore, você pode compartilhar o domínio ecolabore.net gratuitamente.
Links estilo Wikipédia
Você pode criar links para outras páginas, links para e-mails e links para números de telefone apenas envolvendo-os entre colchetes "[" e "]". Apenas tome cuidado de não esquecer o "protocolo" (http:, https: ou ftp:). No caso de links para e-mails e para telefones utilize como protocolo "mailto:" e "tel:".
O exemplo
* Site: [https://ecolabore.net]
* E-mail: [mailto:iamspam@ecolabore.net]
* Telefone: [tel:+55-61-981086070]
Produz
-
Site: ecolabore.net
-
E-mail:
-
Telefone: +55-61-981086070
Endereços de e-mail criados desta maneira serão protegidos pelo Portal Ecolabore para evitar que sejam capturados por crawlers de SPAM.
Se você deseja que os links tenham um texto diferente do seu endereço, apenas acrescente o texto após o endereço, deixando um espaço em branco entre eles.
O exemplo
* [https://ecolabore.net Visite nosso site]
* [mailto:iamspam@ecolabore.net Não envie um email para este endereço]
* [tel:+55-61-981086070 Me liga quando quiser]
Produz
Adicionar mídia
Adicionar mídia
Antes de começar, você deve ter em mmente que você vai lidar com duas coisas independentes: uma delas é o envio ou remoção dos arquivos de mídia, outra coisa é o ponto no documento onde estes arquivos devem ser inseridos.
Desta forma, uma mesma imagem pode ser inserida várias vezes em um documento, quem sabe em um documento traduzido para vários idiomas.
Se você escrever uma marca indicando a inserção de um arquivo que ainda não foi submetido, então ao salvar o documento você encontrará um link para enviá-lo.
Por outro lado, se você remover a marca onde um arquivo deva ser inserido, isso não irá remover o arquivo.
Quando você envia figuras, vídeos ou arquivos para download, eles ficarão listados em um menu chamado "objetos inseridos", no menu do sistema. Você pode acessar as janelas de configuração destes objetos para alterar a disposição, tamanho, aparência ou mesmo para removê-los.
Utilize as marcas [audio], [img] e [file] para submeter arquivos de áudio que poderão ser reproduzidos no documento, arquivos de imagem a serem encaixados no documento e arquivos de qualquer tipo para serem baixados no documento.
Para inserir mais de um arquivo de áudio, mais de uma figura ou mais de um arquivo para download, então basta inserir um número após dois pontos ":", como em [audio:1], [audio:2], [audio:3]... [img:1], [img:2], [img:3]... ou [file:1], [file:2], [file:3]...
Existe também uma galeria de mídia onde você pode submeter mídias que você pretende inserir em vários documentos. Neste caso, você deve apontar a mídia através de seu nome, como em [img:logo], [audio:tutorial] ou [file:contrato].
Enquanto você estiver conectado com direitos administrativos, serão apresentados pequenos botões no canto superior direito de cada objeto, que você poderá acionar para abrir suas configurações.
Lembre-se de que as configurações aplicam-se ao objeto, e serão utilizadas todas as vezes que o mesmo objeto for inserido, mesmo em outros documentos.
Dica: para ter um controle melhor sobre como cada mídia deve ser apresentada, insira a marcação solitária em uma linha.
Um parágrafo.
[img:1]
Outro parágrafo.
Se você deseja inserir uma figura dentro de uma linha de texto, como em:
Um parágrafo com [img:2] uma figura.
então você deve escolher, na caixa de configurações da figura, a disposição "Na linha do texto". Caso contrário, o parágrafo será truncado.
Diagramação do conteúdo
Conceitos básicos
Para delimitar uma seção do documento que deva ser apresentada em colunas, delimitar uma seção em que você deseja uma formatação diferente para fonte e parágrafos, ou para delimitar um trecho do documento que deva ser apresentado como uma caixa de destaque, então você deverá inserir duas marcas: uma indicando onde a seção inicia, outra para indicar onde a seção termina.
Estas marcas precisam estar sozinhas em uma linha:
[columns]
Aqui um texto que deverá ser apresentado em colunas.
[/columns]
[format]
Aqui um texto com fonte e parágrafo personalizado.
[/format]
[card]
Aqui um texto apresentado como cartão de destaque.
[/card]
Após salvar o documento, enquanto você estiver conectado com direitos administrativos, haverá, no canto superior direito de cada uma destas seções, um botão para abrir sua janela de configurações.
Estas configurações serão salvas junto com o modelo de aparência do seu site, e serão aplicadas em todas as páginas do seu site onde estas seções forem inseridas.
Para inserir diferentes configurações de colunas, diferentes formatos de textos e parágrafos, ou cartões de destaque com estilos diferentes, dê diferentes nomes a cada estilo:
[columns:jornal]
Aqui um texto que se pretende dividir em colunas pequenas ao estilo jornal.
[/columns]
[columns:split]
Aqui um texto que se pretende dividir em duas colunas.
[/columns]
[format:centralizado]
Aqui um texto que se pretende centralizar.
[/format]
[format:destaque]
Aqui um texto que se pretende destacar com cor diferente e letras grandes.
[/format]
[card:azul]
Aqui um cartão que se pretende colorir de azul.
[/card]
[card:amarelo]
Aqui um cartão que se pretende colorir de amarelo.
[/card]
Ao salvar as configurações para cada um destes estilos, elas permanecerão salvas em seu modelo de aparência, então você poderá reutilizá-las onde quiser em seu site.
[card:azul]
Aqui um cartão azul.
[/card]
[card:azul]
Aqui outro cartão azul.
[/card]
Você pode inserir qualquer tipo de conteúdo em uma seção, inclusive aninhar subseções, para refinar ainda mais a apresentação do seu documento.
[card:azul]
--------
[format:center]
**Atenção**
[/format]
--------
[format:texto_especial]
[columns:jornal]
Aqui um texto que se pretende apresentar em colunas, dentro de um cartão azul e com uma configuração especial de fonte e parágrafos.
[/columns]
[/format]
[img:3]
[/card]
Formatação de colunas
É possível configurar as colunas para que sejam responsivas, isto é: escolher uma configuração diferente para cada tamanho de tela.
Você pode desejar que, em um celular, o texto seja apresentado em apenas uma coluna; em um tablet em duas colunas; em um computador em 3 e em uma TV em 4... ou de qualquer outra forma que lhe pareça agradável.
Recomendamos que teste em diferentes dispositivos, se possível alternando a posição retrato e paisagem.
Delimitar cartão de destaque
Você pode configurar os cartões de destaque para que sejam responsivos, ou seja: para que assumam diferentes larguras para diferentes tamanhos de tela.
Recomendamos que teste em diferentes dispositivos, se possível alternando a posição retrato e paisagem.
Organizar cartões em uma grade
É possível configurar os cartões para que "flutuem" para a direita ou para a esquerda, de tal forma que você possa enfileirá-los em uma linha. O problema é que a altura de cada cartão depende do seu conteúdo, Portanto, dificilmente os cartões terão a mesma altura.
Se você deseja dispor os cartões em uma grade, coloque todos dentro das marcas [grid] e [/grid]
[grid:minha_grade_de_exemplo]
[card:azul]
As configurações de cartão continuam valendo aqui.
[/card]
[card:amarelo]
Apenas note que, dentro da grade, o tamanho e a disposição do cartão serão definidos pela grade.
[/card]
[card:azul]
Reaproveitar as configurações de pode ser uma estratégia bastante prática.
[/card]
[card:amarelo]
E as mesmas regras valem para as configurações da grade.
[/card]
[/grid]
Recolher blocos de conteúdo
Agora que você está familiarizado com a metodologia para delimitar seções, que tal criar uma seção onde o conteúdo permaneça recolhido e possa ser expandido pelo usuário como uma "sanfona"?
O exemplo
[collapse:Qual a primeira coisa que o Rei faz ao sair ao sol pela manhã?]
Sombra.
[/collapse]
Produz
Qual a primeira coisa que o Rei faz ao sair ao sol pela manhã?
Sombra.
Você pode aninhar seções recolhidas, apenas tome cuidado para que se torne prático para o usuário.
O exemplo
[collapse:Criação de sites]
No Portal Ecolabore você pode criar sites.
[collapse:Estrutura de seções]
O Portal Ecolabore possui uma porção de ferramentas, como blogs, formulários, gerenciamento de pedidos... e você pode inserir estas ferramentas em seu site da maneira que quiser.
[/collapse]
[collapse:Edição do conteúdo]
Utilize MarkDown para editar o conteúdo no Portal Ecolabore, além de extensões próprias que lhe permitirão definir textos em colunas, cartões de destaque e muito mais.
[/collapse]
[/collapse]
[collapse:Ferramentas do usuário]
Cada usuário cadastrado no Portal Ecolabore possui uma área própria.
[collapse:Perfil do usuário]
O usuário pode editar seus dados pessoais e alterar sua senha.
[/collapse]
[collapse:Correio eletrônico]
O usuário pode habilitar o correio eletrônico para receber e enviar correspondências a partir de um ambiente prático e acessível.
[/collapse]
[collapse:Arquivos em núvem]
O usuário pode habilitar um gerenciador de arquivos para organizar seus arquivos em núvem.
[/collapse]
[/collapse]
Produz
Criação de sites
No Portal Ecolabore você pode criar sites.
Estrutura de seções
O Portal Ecolabore possui uma porção de ferramentas, como blogs, formulários, gerenciamento de pedidos... e você pode inserir estas ferramentas em seu site da maneira que quiser.
Edição do conteúdo
Utilize MarkDown para editar o conteúdo no Portal Ecolabore, além de extensões próprias que lhe permitirão definir textos em colunas, cartões de destaque e muito mais.
Ferramentas do usuário
Cada usuário cadastrado no Portal Ecolabore possui uma área própria.
Perfil do usuário
O usuário pode editar seus dados pessoais e alterar sua senha.
Correio eletrônico
O usuário pode habilitar o correio eletrônico para receber e enviar correspondências a partir de um ambiente prático e acessível.
Arquivos em núvem
O usuário pode habilitar um gerenciador de arquivos para organizar seus arquivos em núvem.
Edição avançada
Painéis de conteúdo dinâmico
Para tornar seu site mais atraente, é possível inserir painéis com conteúdos que se atualizam dinamicamente.
O conteúdo destes painéis são retirados de blogs ou categorias, então é possível listar publicações recentes, próximos eventos, produtos em destaque, um post aleatório, figuras que serão trocadas a cada dia e várias outras possibilidades.