Aqui você vê as diferenças entre duas revisões dessa página.
Próxima revisão | Revisão anterior | ||
guia_de_cursos:guia_de_cursos [05/05/2023 10:35] Marcos Martins criada |
guia_de_cursos:guia_de_cursos [10/10/2023 15:19] Jucimara Silva |
||
---|---|---|---|
Linha 1: | Linha 1: | ||
====== Guia de Cursos ====== | ====== Guia de Cursos ====== | ||
- | O guia de cursos presente em https://www.ifms.edu.br/cursos utiliza o plugin JavaScript https://isotope.metafizzy.co/ para criar os filtros referentes aos campi que os cursos estão relacionados | + | O guia de cursos presente em https://www.ifms.edu.br/cursos utiliza o plugin JavaScript https://isotope.metafizzy.co/ para criar os filtros referentes aos campi que os cursos estão relacionados. |
+ | Na aba "Compor" da capa referente ao link citado acima https://www.ifms.edu.br/cursos/guia-de-cursos/compose é incluso o HTML referentes aos cursos, como as imagens e os links para acessar as páginas específicas de cada curso em cada campus. | ||
+ | {{:guia_de_cursos:guia-de-cursos-html.png|}} | ||
+ | |||
+ | O atributo **data-filter=".campo-grande"** filtra os elementos que possui a classe **.campo-grande** referente ao Campus Campo Grande, por exemplo. | ||
+ | |||
+ | O trecho do código HTML abaixo foi usado para incluir o curso Técnico Integrado em Eletrotécnica no Guia de Cursos. Ele seria filtrado quando selecionado o Campus Campo Grande ou o Campus Três Lagoas no filtro. | ||
+ | |||
+ | <div class="campo-grande tres-lagoas"><img alt="Técnico Integrado em Eletrotécnica" src="../imagens/cursos/links-medio/eletrotecnica-menor" /> | ||
+ | <ul class="local-oferta"> | ||
+ | <li class="campus"><a href="../campi/campus-campo-grande/cursos/integrados/eletrotecnica">Campo Grande</a></li> | ||
+ | <li class="campus"><a href="../campi/campus-tres-lagoas/cursos/integrado/eletrotecnica">Três Lagoas</a></li> | ||
+ | </ul> | ||
+ | </div> | ||
+ | |||
+ | Para incluir uma nova modalidade no filtro: | ||
+ | |||
+ | **Antes** | ||
+ | |||
+ | <div class="label-proeja isModalidade"> | ||
+ | <h3 class="label-modalidade aquidauana campo-grande corumba coxim dourados jardim tres-lagoas">Educação de Jovens e Adultos (Proeja)</h3> | ||
+ | </div> | ||
+ | |||
+ | **Depois** | ||
+ | |||
+ | <div class="label-proeja isModalidade"> | ||
+ | <h3 class="label-modalidade aquidauana campo-grande corumba coxim dourados jardim navirai tres-lagoas">Educação de Jovens e Adultos (Proeja)</h3> | ||
+ | </div> | ||
+ | |||
+ | |||
+ | |||
+ | Se um curso já está incluso no Guia de Cursos e apenas um novo campus passou a ofertá-lo é necessário apenas incluir a classe referente ao campus nas tags DIVs e LIs referentes ao curso. | ||
+ | |||
+ | No arquivo https://www.ifms.edu.br/portal_skins/custom/guia-de-cursos.js/manage_main é feito a configuração do plugin Isotope, e só necessitaria ser modificado caso precise seja necesário adicionar uma nova DIV referente aos modalidades de cursos, fora as que já tem lá, como Graduação, Mestrado, Especialização, etc. | ||
+ | |||
+ | {{:guia_de_cursos:guia-de-cursos-js.png|}} | ||
+ | |||
+ | O arquivo https://www.ifms.edu.br/portal_skins/custom/guia-de-cursos.css/manage_main é responsável pelo layout e estilo aplicado ao Guia de Cursos. |