Árvore de páginas

Versões comparadas

Chave

  • Esta linha foi adicionada.
  • Esta linha foi removida.
  • A formatação mudou.

...

Painel
borderColor#f2f2f2
bgColor#f2f2f2

Para gerenciar os slides do banner, são apresentadas as seguintes opções:

 Incluir slide

 Remover slide
Essa opção é apresentada ao passar o mouse sobre o quadro do slide.

 ou 
O ícone  no quadro referente ao slide indica que há uma imagem associada, e o ícone indica que o slide tem um vídeo associado. Para facilitar a identificação de cada quadro, é apresentada ainda uma miniatura da imagem. Para alterar o conteúdo, basta clicar na área desse quadro, e com isso será aberto o menu para configuração do slide.


Configuração do slide


Para cada slide é necessário configurar:

Imagem / Vídeo
Indica se o conteúdo do slide será de imagem ou vídeo. Tanto a imagem quanto o vídeo devem ser arquivos da galeria ou do próprio dispositivo. Os formatos aceitos de para imagem são: JPG, JPEG, GIF ou PNG. Os formatos aceitos para vídeo são MP4 ou OGG, e com o limite de 15MB de tamanho. Caso o vídeo tenha duração maior que o intervalo de transição e tenham sido incluídos mais slides a apresentar, a visualização do vídeo será interrompida, para dar lugar ao próximo slide.

Painel
borderColor#e8f6f0
bgColor#e8f6f0
HTML
<div class="lms">
	<div class="lms-callout">
		<div class="lms-callout-image">
			<img class="lms-callout-thumb" src="http://tdn.totvs.com/download/thumbnails/286221066/dica.png" width="24" height="24">
		</div>
		<div class="lms-callout-body">
			<p class="lms-callout-text"><b>DICA!</b><br>Procure imagens que representem bem o que você quer dizer. Você pode optar por inserir um vídeo também. Mas lembre-se: tanto em imagens quanto vídeos, procure utilizar resolução superior à 720p e inferior a 1080p, com boa qualidade e proporções <i>widescreen</i> (16:9). Procure ferramentas de otimização de imagem para evitar que fique pesado carregá-las dentro do slide.</p>
		</div>
	</div>
</div>

Título
Título do slide.

Subtítulo
Descrição que deve ser apresentada abaixo do título.

Painel
borderColor#e8f6f0
bgColor#e8f6f0
HTML
<div class="lms">
	<div class="lms-callout">
		<div class="lms-callout-image">
			<img class="lms-callout-thumb" src="http://tdn.totvs.com/download/thumbnails/286221066/dica.png" width="24" height="24">
		</div>
		<div class="lms-callout-body">
			<p class="lms-callout-text"><b>DICA!</b><br>Deixe uma mensagem objetiva para o visitante, desse modo a leitura fica mais agradável atraindo a atenção para clicar.</p>
		</div>
	</div>
</div>

Cor do texto
Configura a cor do texto do slide.

Alinhamento horizontal
Indica o alinhamento horizontal do título e do subtítulo. Pode ser alinhado à esquerda, centralizado ou à direita.

Alinhamento vertical
Indica o alinhamento vertical do título e do subtítulo. Pode ser alinhado acima, centralizado ou abaixo.

Espaçamento interno
Configura o espaçamento que deve ser apresentado no interior de cada slide, alterando a posição que o texto irá obedecer. O ícone  indica que pode ser definida uma medida específica para cada lado e o ícone  indica que será definida uma medida igual para todos os lados. 

 Adicionar item
Essa opção permite adicionar botões ao slide, e esses botões direcionam para outros endereços web.

 Remover
Essa opção permite remover o botão em questão.


Configuração do botão


Cada botão do slide tem a seguinte configuração:

URL
Endereço web que será aberto ao acionar o botão.

Abrir em uma nova aba?
Indica se o endereço deve ser aberto em uma nova aba ou na atual.

Texto
Configura o texto do botão.

Cor do texto
Configura a cor do texto do botão.

Cor do botão
Configura a cor do botão.

Cor da borda
Configura a cor da borda do botão.

Largura da borda
Configura a largura da borda do botão. Caso seja informado 0, o botão fica sem borda.

Cantos arredondados
Configura o quanto os cantos do botão serão arredondados. Caso 0, os cantos permanecem quadrados.

...