Seção de curso online
Neste artigo, vamos explicar como adicionar um bloco com informações sobre cursos ao seu site.
No mundo do aprendizado online, a facilidade de navegação desempenha um papel fundamental para atrair e reter usuários. Os cards de curso personalizáveis são uma ótima maneira de tornar seu site mais interativo e informativo.
Esses cards permitem que os visitantes encontrem rapidamente os programas de seu interesse e naveguem facilmente para as páginas dos cursos com apenas um botão. Neste artigo, veremos como configurar uma seção de cards de curso personalizáveis para melhorar a usabilidade do seu site e ajudar os usuários a alcançar seus objetivos educacionais mais rapidamente.
Em vez de usar flashcards online, você pode adicionar listas de aulas à página do site: basta selecionar o curso necessário na seção e todas as aulas serão exibidas.
Como adicionar a seção "Cards de curso"
Para adicionar a seção "Cards de curso", clique no "+" no modo de edição do seu site.
Em seguida, encontre a seção "Cards de curso" no menu que se abre e clique nela para adicionar a seção ao seu site:
A seção será adicionada ao seu site, e o menu de configurações de conteúdo será aberto para você:
Seção de conteúdo
A configuração do conteúdo da seção de Cards de curso consiste em selecionar um(s) curso(s) que já foi criado no projeto para exibir no site e personalizar os elementos do card.
Como criar cursos na plataforma Salebot é descrito na seção “Cursos online”.
Escolhendo um curso
Escolha os cursos que você gostaria de destacar em seu site:
Para isso, marque a caixa com o nome do curso desejado.
Em seguida, os cursos selecionados serão exibidos imediatamente na página do seu site com a capa que você definiu nas configurações do curso.
Personalização
Depois de selecionar os cursos necessários, prossiga para personalizar os elementos do card:
Sombra
Para os cards de curso na seção, você pode ajustar a intensidade da sombra:
a) sem sombra:
b) sombra leve:
c) sombra forte:
Configurações de cor dos elementos do card
Personalize a aparência do card ajustando as cores de vários elementos. Você também pode adicionar efeitos interativos ao passar o mouse.
Cor do texto: Altera a cor principal do texto no card (exceto botões).
Fundo do card: Define a cor de fundo do card.
Cor da borda: Define a cor do contorno ou da moldura do card.
Texto do botão: Define a cor do texto dentro do botão (estado estático).
Fundo do botão: Define a cor de fundo do botão.
Efeitos interativos ao passar o mouse (seção opcional):
Ative os efeitos de hover para alterar dinamicamente a cor desses elementos quando o usuário mover o cursor sobre o card.
Agora você sabe como exibir os cursos disponíveis no seu site MaviBot usando a seção "Cards de curso".
Para configurações de fundo e exibição, veja o artigo "Configurações globais da seção".
Como adicionar o bloco "Aulas"
Para adicionar um bloco para exibir a lista de aulas do curso, mude para o modo de edição do site, passe o mouse sobre a área de trabalho e, em seguida, clique em "+":
Um menu se abre à direita com as seções disponíveis do site, onde você precisa encontrar o bloco "Aulas":
Clique em "Cards de curso" e, em seguida, um menu será aberto para configurar o conteúdo do bloco:
Você só precisa selecionar o curso necessário, que já foi criado no Salebot, no menu suspenso e clicar em "Salvar".
Em seguida, vá para as configurações para personalizar o conteúdo do bloco:
Personalização
Ao clicar no botão "Configurações" e passar o mouse sobre a seção, as configurações para personalizar o conteúdo e o próprio bloco se abrem:
Quais configurações estão disponíveis?
Estilo da lista de aulas
Por padrão, o estilo da lista de aulas é exibido em um novo formato. Se necessário, você pode definir uma versão mais concisa do formato clássico:
Estilo de numeração
O estilo de numeração está disponível para um novo estilo de exibição das aulas do curso. A numeração muda no próprio card da aula:
Ícones das aulas
Eles são exibidos se você adicionou uma prévia dentro da própria aula nas configurações do curso.
Como adicionar ícones
Etapa 1. Vá para as configurações da aula:
Para fazer isso, acesse o modo de configurações do curso e encontre a aba Aulas:
Em seguida, clique em "Editar", após o qual a página da aula será aberta para edição.
Etapa 2. Abra as configurações da página da aula.
Vá para a seção "Geral" nas configurações da página da aula:
Etapa 3. Envie a prévia da aula
Expanda a lista de configurações de imagem nas configurações de informações básicas:
Envie uma imagem para a prévia da aula:
Salve as configurações.
Pronto! Agora as prévias das aulas serão exibidas como ícones na seção Aulas do site.
Padrão de fundo
Isso adiciona volume e exclusividade aos seus cards de aula:
Arredondamento dos elementos
O valor é definido em pixels e arredonda os cantos dos cards de aula.
Estilo do cartão da aula
Isso ajuda a organizar os cards de aula em uma única linha ou em uma linha com ou sem hifenização.
Cor de fundo e do texto
Há uma ampla paleta de cores disponível para definir a cor de fundo do card e a cor da fonte no card da aula:
Agora você sabe como adicionar listas de aulas ao seu site e personalizar o conteúdo da seção.
Para configurações de fundo e exibição, veja o artigo "Configurações globais da seção".
Atualizado