Componentes para montaje de cursos en Moodle MatCon CMMEdu

Copia cada bloque y pégalo en tu curso. Debajo de cada componente tienes un botón Copiar.

Headers tipo: Unidad / Tema / Lección

Simple

 

UNIDAD 1: Título de la unidad

TEMA 1:
Título del tema

LECCIÓN 1: Título de la lección


Herramientas digitiales

Lección de herramientas digitales

 

UNIDAD 1 Título de la unidad

TEMA 1:
Título del tema

LECCIÓN 1: Título de la lección


Práctica o ejercitación

Lección de práctica
Lección de ejercitación

 

UNIDAD 1 Título de la unidad

TEMA 1:
Título del tema

LECCIÓN 1: Título de la lección


Header Evaluación

Evaluación Unidad X

Contenido de actividad

Contenido

Texto


con listas

Texto

  • lista 1
  • lista 2
  1. lista 1
  2. lista 2

Etiquetas de trabajo

Etiqueta de trabajo en grupo

 
Trabajo en grupo

Etiqueta de trabajo en pareja

 
Trabajo en pareja

Etiqueta de trabajo individual

 
Trabajo individual

Etiqueta de docente

 
Docente

Etiqueta de toma nota

 
Toma nota

Etiqueta de anota en tu cuaderno

 
Anota en el cuaderno

Etiqueta de pregunta PAES

 
Pregunta tipo PAES

Etiqueta de pregunta Desarrollo

 
Pregunta de desarrollo

Enunciados

Enunciado

#
Texto del enunciado

Práctica

#
Texto del enunciado

Evaluación

#
Texto del enunciado

Textos utilies en preguntas

Respuesta

Respuesta: 1, 2 ,3 y 4 respectivamente.

Intento adicional

Te queda otro intento.

Pregunta abierta

Su respuesta ha sido enviada.

Subir archivo

Su archivo ha sido enviado.

Subir imagen

Su imagen ha sido enviada.

Subir archivo

Su documento ha sido enviado.

Subir audio

Su audio ha sido enviado.

Cápsulas

Cápsula: Exploremos

Exploremos una posible respuesta

Contenido de la capsula


Cápsula: Objetivos de aprendizaje

Objetivos de aprendizaje

Contenido de la capsula


Cápsula: Recordemos

Recordemos

Contenido de la capsula


Cápsula: Contenido

Contenido

Contenido de la capsula


Cápsula: Observación

Observación

Contenido de la capsula


Cápsula: Instrucción

Instrucción

Contenido de la capsula


Recuadros

Recuadro rosado

Contenido del recuadro


Recuadro azul

Contenido del recuadro


Diálogos

Diálogos de personajes

Thiare
Contenido del dialogo
Laura
Contenido del dialogo

Botónes

Boton descargar

Descargar

Boton modal

Ver gráfico

Boton tabla

Mes Asistencia
Enero 120
Febrero 135
Ver tabla

Imágenes y videos

Imagen


Video típico


Fuente

Fuente: DEMRE (link)


Hasta 5 imágenes en fila (responsive)


Carousel


Carousel de carpetas


Dropdown

Dropdown


Scripts

Script para Carousel / Tabs (incluir una vez en la página)

<script>
$(document).ready(function () {
  $('.carouselSYS').each(function () {
    var $carousel = $(this);
    var slides = $carousel.find('.carouselSYS-slide');
    var slidesCount = slides.length;
    var currentIndex = 0;
    $(slides[currentIndex]).show();
    function updateIndicator() {
      $carousel.find('.current-slide').text(currentIndex + 1);
      $carousel.find('.total-slides').text(slidesCount);
    }
    function updateButtons() {
      $carousel.find('.carouselSYS-prev').toggleClass('disabled', currentIndex === 0);
      $carousel.find('.carouselSYS-next').toggleClass('disabled', currentIndex === slidesCount - 1);
    }
    function showSlide(index) {
      slides.hide();
      $(slides[index]).show();
      updateIndicator();
      updateButtons();
    }
    $carousel.find('.carouselSYS-next').click(function () {
      if (currentIndex < slidesCount - 1) { currentIndex++; showSlide(currentIndex); }
    });
    $carousel.find('.carouselSYS-prev').click(function () {
      if (currentIndex > 0) { currentIndex--; showSlide(currentIndex); }
    });
    updateIndicator();
    updateButtons();
  });
  $('.carouselSYStable').each(function () {
    var $carousel = $(this);
    var slides = $carousel.find('.carouselSYStable-slide');
    var slidesCount = slides.length;
    var currentIndex = 0;
    $(slides[currentIndex]).show();
    function updateIndicator() {
      $carousel.find('.current-slide').text(currentIndex + 1);
      $carousel.find('.total-slides').text(slidesCount);
    }
    function updateButtons() {
      $carousel.find('.carouselSYStable-prev').toggleClass('disabled', currentIndex === 0);
      $carousel.find('.carouselSYStable-next').toggleClass('disabled', currentIndex === slidesCount - 1);
    }
    function showSlide(index) {
      slides.hide();
      $(slides[index]).show();
      updateIndicator();
      updateButtons();
    }
    $carousel.find('.carouselSYStable-next').click(function () {
      if (currentIndex < slidesCount - 1) { currentIndex++; showSlide(currentIndex); }
    });
    $carousel.find('.carouselSYStable-prev').click(function () {
      if (currentIndex > 0) { currentIndex--; showSlide(currentIndex); }
    });
    updateIndicator();
    updateButtons();
  });
  $('.carousel-carpeta').each(function () {
    var $carousel = $(this);
    var slides = $carousel.find('.carousel-carpeta-slide');
    var tabs = $carousel.find('.carousel-carpeta-tab');
    $(slides[0]).show();
    $(tabs[0]).addClass('active');
    function showSlide(index) {
      slides.hide();
      $(slides[index]).show();
      tabs.removeClass('active');
      $(tabs[index]).addClass('active');
    }
    tabs.click(function () { showSlide(tabs.index(this)); });
  });
  $('.tablatabSYS').each(function () {
    var $tabsContainer = $(this);
    var tabs = $tabsContainer.find('.tabhead a');
    var contents = $tabsContainer.find('.tab-content');
    $(tabs[0]).addClass('active');
    $(contents[0]).addClass('active');
    function showContent(index) {
      tabs.removeClass('active');
      contents.removeClass('active');
      $(tabs[index]).addClass('active');
      $(contents[index]).addClass('active');
    }
    tabs.click(function (e) {
      e.preventDefault();
      showContent(tabs.index(this));
    });
  });
});
</script>

Script para Dropdown


          $(function() {

      $(".dropdownSYS-toggle").on("click", function() {

        const $toggle = $(this);
        const $content = $toggle.next();

        const expanded = $toggle.attr("aria-expanded") === "true";

        $toggle.attr("aria-expanded", !expanded);
        $content.prop("hidden", expanded);

        if (!expanded && window.MathJax) {
          MathJax.typesetPromise([$content[0]]);
        }
      });

      $(".dropdownSYS-toggle").on("keydown", function(e) {

        if (e.key === "Enter" || e.key === " ") {
          e.preventDefault();
          $(this).trigger("click");
        }

      });

    });