×

Observação

O fórum está em modo somente leitura.

×
Atualizado - Editor de textos (09 Jun 2021)

O editor de textos foi atualizado para um layout mais amigável. Confiram!

Idea Tabs e Sliders em artigos

Mais
4 anos 1 mês atrás - 4 anos 1 mês atrás #21 por regiane.higa
Sliders


Os sliders são controles deslizantes. É comum a sua utilização em páginas que necessitam organizar informações em tópicos, onde o visitante visualiza o conteúdo ao clicar em cima do título.



Para utilizar os sliders é necessário ter a extensão instalada em seu site. Caso não possua, envie uma solicitação para a WEB do seu Campus ou para WEB-Reitoria: Este endereço de email está sendo protegido de spambots. Você precisa do JavaScript ativado para vê-lo..


Criando a máscara dos sliders

Para começar a criar os sliders vá até um artigo do Joomla ou crie um novo artigo e role o cursor até a parte inferior do editor de textos. Clique no botão “Sliders”.


Entenda o que significa cada campo


A - Insira um título breve
B - Escolha “Não” para deixar o slider fechado quando o usuário carregar a página
C - Insira o nome de uma classe (exemplo: blue, orange, green, red, grey) para customizar seu slide com cores descritas na documentação da extensão:
www.regularlabs.com/extensions/sliders/examples#syntax-2
www.regularlabs.com/extensions/sliders/examples#syntax-4

D - Assinale “Sim” se deseja exibir o ícone de +/- no slider

Após preencher/configurar os campos de acordo com o desejado, será gerado uma “máscara”, conforme o exemplo abaixo:

Dentro do artigo Joomla:




Com a estrutura criada, onde aparece “Seu texto...” insira o texto que deseja.

A estrutura gerada é envolvida por chaves: { slider } { /sliders } não apague ou desformate a estrutura principal.

Salve o artigo e visualize no site como ficou:


Também poderá aproveitar a mesma estrutura para criar outros sliders e substituir os títulos e o texto interno. Veja o exemplo abaixo, copiei e colei a seguinte estrutura 2 vezes.

{ slider title="Slider 3" class="orange icon }
Seu texto...




Salve e visualize no site como ficou:





TABS
Assim como os Sliders os Tabs também são bem utilizados para organizar as informações em sua página. Os tabs podem ser utilizados dentro de sliders também.


Veja uma demonstração:


Criando a máscara dos TABS

Para começar a criar as ABAS vá até um artigo do Joomla ou crie um novo artigo e role o cursor até a parte inferior do editor de textos. Clique no botão “TABS”.






A - Insira um título breve para a TAB
B - Insira o nome de uma classe (exemplo: blue, orange, green, red, grey) para customizar seu slide com cores descritas na documentação da extensão:
www.regularlabs.com/extensions/tabs/examples#syntax-2
www.regularlabs.com/extensions/tabs/examples#syntax-4

Após preencher/configurar os campos de acordo com o desejado, será gerado uma “máscara”, conforme o exemplo abaixo:



A estrutura gerada é envolvida por chaves: { tab} { /tabs } não apague ou desformate a estrutura principal.


Salve o artigo e visualize no site como ficou:


Regiane Suemy Higa
Divisão de Portais WEB
Superintendência de Tecnologia da Informação
Universidade Federal de São Paulo
Ultima edição: 4 anos 1 mês atrás por regiane.higa.
Moderadores: sitesemerson.leite