Árvore de páginas

Versões comparadas

Chave

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

...

As páginas criadas no TOTVS Pages são responsivas, ou seja, se adaptam para oferecer a melhor visualização de acordo com o dispositivo de acesso.

Painel
borderColor#ebf8ff
bgColor#ebf8ff
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/nota.png" width="24" height="24">
		</div>
		<div class="lms-callout-body">
			<p class="lms-callout-text"><b>NOTA:</b><br>Não esqueça de salvar as alterações efetuadas na página - para isso utilize o botão <b>Salvar</b>. A página fica em rascunho até que se acione a opção <b>Publicar</b>, no canto superior direito da tela, para torná-la acessível publicamente por meio da URL definida.</p>
		</div>
	</div>
</div>

Image RemovedImage Added


Criar página no portal

...

01. Depois de acessar o item Páginasdo portal, localize a página que deseja visualizar.

02. Clique em AçõesImage Modifiedlocalizado no canto inferior direito do quadro da página.

03. Clique em Visualizar.

04. Veja a página do portal na nova guia que foi aberta.

...

01. Depois de acessar o item Páginasdo portal, localize a página que deseja editar.

02. Clique em AçõesImage Modifiedlocalizado no canto inferior direito do quadro da página.

03. Clique em Editar.

Painel
borderColor#f2f2f2
bgColor#f2f2f2

Ao clicar nesta opção, a página é exibida em uma nova aba em modo de edição, onde é possível efetuar as alterações desejadas adicionando, configurando ou excluindo componentes.

Duplicar página do portal

Essa opção pode ser utilizada para criar uma cópia de uma página já existente, contendo os mesmos componentes e as mesmas configurações. É uma forma rápida de criar páginas muito semelhantes com poucas alterações entre si.

01. Depois de acessar o item PáginasImage Removeddo portal, localize a página da qual deseja fazer uma cópia.

02. Clique em AçõesImage Removedlocalizado no canto inferior direito do quadro da página.

03. Clique em Duplicar.

04. Insira as informações solicitadas para a página que será a cópia.

...

borderColor#f2f2f2
bgColor#f2f2f2

...

Estado
titleExemplo:

...

Endereço da página
URL da página, ou seja, é a URL que será utilizada para acessar essa página específica do portal. Ao preencher o nome da página, esse campo já é automaticamente preenchido, mas pode ser alterado se desejado. Depois de criar a página, mesmo que o nome dela seja alterado, a URL permanecerá a que foi definida no momento da sua criação.


05. Clique em Duplicar.

Painel
borderColor#f2f2f2
bgColor#f2f2f2

Ao clicar nesta opção, uma página é criada contendo todas as configurações da página original. Ela será listada logo abaixo da página inicial do portal. Para editá-la e configurar seus componentes, siga os passos descritos em Editar página do portal.

Configurar página do portal

01. Depois de acessar o item PáginasImage Removeddo portal, localize a página que deseja configurar.

02. Clique em AçõesImage Removedlocalizado no canto inferior direito do quadro da página.

03. Clique em Configurar.

04. Altere o nome da página.

Painel
borderColor#f2f2f2
bgColor#f2f2f2

As demais informações exibidas não podem ser alteradas.

05. Clique em Concluir.

Tornar página do portal como inicial

01. Depois de acessar o item PáginasImage Removeddo portal, localize a página que deseja tornar como a página inicial do portal.

02. Clique em AçõesImage Removedlocalizado no canto inferior direito do quadro da página.

03. Clique em Tornar página inicial.

04. Na mensagem exibida, clique em Confirmar para tornar a página como a inicial do portal.

Painel
borderColor#f2f2f2
bgColor#f2f2f2

Ao confirmar, a página se torna a página inicial do portal, substituindo a que era inicial anteriormente.

Excluir página do portal

01. Depois de acessar o item PáginasImage Removeddo portal, localize a página que deseja excluir.

02. Clique em AçõesImage Removedlocalizado no canto inferior direito do quadro da página.

03. Clique em Excluir.

04. Na mensagem exibida, clique em Confirmar para tornar a página como a inicial do portal.

Painel
borderColor#f2f2f2
bgColor#f2f2f2

Ao confirmar, a página se torna a página inicial do portal.

**Adicionar componente à página

...

 Assista ao vídeo

01. Para adicionar um componente, acione o botão Componentes web para expandir os componentes.

...

03. Clique no componente e arraste-o até o ponto da página em que ele deve ser apresentado.


**Ações sobre os componentes

...

Quando o componente está adicionado na página, ao passar o mouse sobre ele, são apresentadas as seguintes opções:

...

Painel
borderColor#e8f6f0
bgColor#e8f6f0
HTML
<style type="text/css">
    .lms * {
      -webkit-box-sizing: border-box;
      -moz-box-sizing: border-box;
      box-sizing: border-box;
    }

    .lms-text-center {
      text-align: center;
    }

    .lms-full-height {
      height: 100%;
    }

    /* Component LMS Callout */

    .lms-callout {
      border: none;
      padding: 0px;

      display: -moz-box;
      -moz-flex-flow: row wrap;
      -moz-justify-content: center;
      -moz-align-items: center;

      display: -ms-flexbox;
      -ms-flex-flow: row wrap;
      -ms-justify-content: center;
      -ms-align-items: center;
      
      display: -webkit-flex;
      display: -webkit-box;
      -webkit-flex-flow: row wrap;
      -webkit-justify-content: center;
      -webkit-align-items: center;

      display: flex;
      flex-flow: row wrap;      
      justify-content: center;
      align-items: center;
    }
  
    .lms-callout .lms-callout-image {
      width: 24px;
    }

    .lms-callout .lms-callout-body {
      width: calc(100% - 24px);
      padding-left: 20px;
    }

	.lms-callout .lms-callout-citacao {
      border: 0px solid;
      border-left-width: 3px;
      border-left-color: #f36f21;
	  margin: 4px;
	  margin-left: 25px;
	  padding-left: 8px;
      font-size: 13px;
	}

    .lms-callout .lms-callout-thumb {
      width: 24px;
      height: 24px;
    }

    .lms-callout .lms-callout-text {
      color: #58595b;
      line-height: 1.75;
      margin: 0;
    }
</style>

<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>Se você criou a página a partir de um <a href = "http://tdn.totvs.com/x/_dGQHQ" style="color: #41d262">template</a>, você também consegue utilizar a opção <b>Configurar componente</b> <img src="http://tdn.totvs.com/download/attachments/476745461/flaticon-settings.png" width="20" height="20"> para acessar a configuração de cada um dos componentes, e com isso personalizar a página da forma que desejar.</p>
		</div>
	</div>
</div>

Configurações na edição da página


Duplicar página do portal

...

Essa opção pode ser utilizada para criar uma cópia Na edição de uma página , também é possível abrir suas configurações para definição de novas configuraçõesjá existente, contendo os mesmos componentes e as mesmas configurações. É uma forma rápida de criar páginas muito semelhantes com poucas alterações entre si.

01. Com a página aberta, acionar o ícone de engrenagem Image Removed localizado ao lado direito na tela do editor.

02. Será aberto um pop-up para as novas configurações. É possível alterar o nome da página e o mediador que foi definido para essa página, 

...

01. Na sessão Informações, inserir o novo nome da página no campo Nome da página.

02. Para salvar o novo nome para a página, clique no editor de páginas novamente. Logo após acionar Salvar, ao lado direito do editor. 

...

É possível remover, alterar ou adicionar novos mediadores para a página. Expandir a sessão Mediadores e acionar Editar.

01. A tela para edição de mediadores será aberta, basta inserir o nome do colaborador no campo de pesquisa Buscar mediador e clicar sobre o nome do colaborador desejado. 

02. Será necessário definir o tipo de permissão para o colaborador que será definido como mediador da página.

03. Para salvar as definições de mediador que foram editadas na página, clique no editor de páginas novamente. Logo após acionar Salvar, ao lado direito do editor.

Visualizar rascunho da página

Para visualizar a página em modo de rascunho, siga os passos abaixo:

01. Acionar o ícone de visualização Image Removed localizado no lado superior direito, ao lado do ícone de configuração.

02. A página será apresentada em uma nova guia em modo de rascunho. Para voltar à edição da página acionar Editar página.

...

 Depois de acessar o item PáginasImage Addeddo portal, localize a página da qual deseja fazer uma cópia.

02. Clique em AçõesImage Addedlocalizado no canto inferior direito do quadro da página.

03. Clique em Duplicar.

04. Insira as informações solicitadas para a página que será a cópia.

Painel
borderColor#f2f2f2
bgColor#f2f2f2

Nome da página
Nome que será atribuído à página que está sendo copiada de outra.

Estado
titleExemplo:

Sobre nós, Início, Fale conosco.

Endereço da página
URL da página, ou seja, é a URL que será utilizada para acessar essa página específica do portal. Ao preencher o nome da página, esse campo já é automaticamente preenchido, mas pode ser alterado se desejado. Depois de criar a página, mesmo que o nome dela seja alterado, a URL permanecerá a que foi definida no momento da sua criação.

05. Clique em Duplicar.

Painel
borderColor#f2f2f2
bgColor#f2f2f2

Ao clicar nesta opção, uma página é criada contendo todas as configurações da página original. Ela será listada logo abaixo da página inicial do portal. Para editá-la e configurar seus componentes, siga os passos descritos em Editar página do portal.


Configurar página do portal

...

01. Depois de acessar o item PáginasImage Addeddo portal, localize a página que deseja configurar.

02. Clique em AçõesImage Addedlocalizado no canto inferior direito do quadro da página.

03. Clique em Configurar.

04. Altere o nome da página.

Painel
borderColor#f2f2f2
bgColor#f2f2f2

As demais informações exibidas não podem ser alteradas.

05. Clique em Concluir.


Tornar página do portal como inicial

...

01. Depois de acessar o item PáginasImage Addeddo portal, localize a página que deseja tornar como a página inicial do portal.

02. Clique em AçõesImage Addedlocalizado no canto inferior direito do quadro da página.

03. Clique em Tornar página inicial.

04. Na mensagem exibida, clique em Confirmar para tornar a página como a inicial do portal.

Painel
borderColor#f2f2f2
bgColor#f2f2f2

Ao confirmar, a página se torna a página inicial do portal, substituindo a que era inicial anteriormente.


Excluir página do portal

...

01. Depois de acessar o item PáginasImage Addeddo portal, localize a página que deseja excluir.

02. Clique em AçõesImage Addedlocalizado no canto inferior direito do quadro da página.

03. Clique em Excluir.

04. Na mensagem exibida, clique em Confirmar para tornar a página como a inicial do portal.

Painel
borderColor#f2f2f2
bgColor#f2f2f2

Ao confirmar, a página se torna a página inicial do portal.