Css moodle 2
Acceso rápido:
Moodle custom css
Mientras que en mi primera entrada en este blog defendía las virtudes de los mundos virtuales en la educación a distancia, un cambio radical en mi situación laboral en los últimos años me ha llevado de desarrollar, investigar y enseñar en mundos virtuales a otros puestos en el sector de la educación en línea. Mi contrato actual con Coastguard Boating Education, aunque se centra en el diseño de cursos y evaluaciones, también me permite administrar y volver a desarrollar su Moodle. Habiendo estado ausente del back-end de un LMS durante algún tiempo, esto definitivamente ha presentado sus desafíos.
Por descuido, como suele ser el caso en las instituciones pequeñas, la instalación de Moodle que heredé estaba en un estado lamentable, con cursos que se ejecutaban en una versión obsoleta sin soporte, desconectada de las posibilidades que ofrece este LMS. Aunque todavía nos queda camino por recorrer, al menos puedo decir que con algunas actualizaciones muy necesarias, junto con una buena dosis de investigación y reaprendizaje, hemos vuelto al buen camino. Y Moodle y yo estamos en el buen camino para reencontrarnos.
¿Se puede utilizar CSS en Moodle?
Sí. El CSS del módulo es sólo un valor por defecto, por lo que el módulo básicamente funciona cuando se instala en cualquier tema. Pero el tema es en última instancia responsable del diseño, y por lo tanto puede anular el CSS por defecto de cualquier módulo.
¿Cómo añado CSS personalizado a Moodle?
Si no usas SCSS, y prefieres usar CSS estándar por cualquier razón, puedes incluir lo siguiente en el archivo config. php de tu tema para cargar hojas de estilo dentro del directorio de estilos de tu tema: $THEME->sheets = array('stylesheetname');
¿Cómo personalizo mi tema Moodle?
Ahora puede utilizar su panel de administrador para cambiar su sitio al nuevo tema. Elija su nuevo tema desde Moodle a través de Administración > Apariencia > Temas > Selector de temas. ¡Su nuevo tema!
Pelusa css
Si quieres incluir enlaces de redes sociales en tu sitio Moodle o Totara Learn de una forma elegante y sin adaptar el tema, 'Font Awesome' es una solución fácil y sencilla. Este método también ofrece la posibilidad de personalizar el tamaño y el color de los iconos para adaptarlos a la marca del sitio.
Para empezar a utilizar 'Font Awesome' en tu sitio Moodle o Totara LMS, primero tendrás que añadir el CDN de Bootstrap a tu sitio. Para ello, ve a https://fortawesome.github.io/Font-Awesome/get-started/ y copia el siguiente código:
Este código puede ser pegado en la sección <head> del HTML de tu sitio. Para hacer esto en Moodle y Totara LMS necesitarás iniciar sesión en tu sitio como administrador, luego navega a Administración del sitio > Apariencia > HTML adicional y pega el código en la sección 'Dentro de HEAD' y luego haz clic en 'Guardar'.
Ahora tienes que encontrar los iconos que deseas utilizar. Vaya a https://fortawesome.github.io/Font-Awesome/icons/ y busque los iconos. Una vez que encuentres el icono puedes copiar la línea de código. El código será algo parecido a lo siguiente:
Moodle css
Para configurar su tema, necesitará saber qué colores quiere usar. Deberías tomar nota de qué colores quieres usar, una lista completa de colores universalmente soportados está disponible en [1]. Ten en cuenta que CSS es un lenguaje exacto - Gris Oscuro funcionará mientras que Gris Oscuro no.
Las mejores prácticas para elegir un esquema de color es hacer que tu fondo sea de un color claro, tu texto de un color oscuro, y los colores de tus enlaces algo intermedio entre los dos. Nunca debe haber dos colores iguales o casi iguales. También debe evitar los colores de alto contraste, como un fondo rojo con texto azul, que puede ser increíblemente difícil de leer.
Ahora que has copiado el tema por defecto, y elegido los colores para tu nuevo tema, es el momento de empezar a dar estilo a la nueva página. Abre el archivo 'styles_color.css' dentro de la carpeta que creaste en el primer paso dentro de tu editor de texto. Si desea utilizar el editor integrado en Windows, puede acceder a este programa visitando Inicio > Todos los programas > Accesorios > Bloc de notas.
Temas Moodle
Un estilo de codificación coherente es importante en cualquier proyecto de desarrollo, y especialmente cuando participan muchos desarrolladores. Un estilo estándar ayuda a que el código sea más fácil de leer y entender, lo que contribuye a la calidad general.
Con la herramienta RTLCSS-PHP, los estilos se invierten automáticamente cuando el lenguaje es de derecha a izquierda. Sin embargo, como siempre hay algunas excepciones, se pueden añadir comentarios especiales a los archivos CSS para evitar que se volteen las reglas, etc.
Ten en cuenta también que los comentarios en SCSS o LESS no suelen producir el efecto deseado. Cuando trabajes con SCSS y LESS, asegúrate de que tus comentarios RTL especiales se adjuntan a declaraciones CSS puras: nada de @extend
que permite a los desarrolladores forzar la dirección del texto de izquierda a derecha. Esto es especialmente necesario para los campos de formularios como: URLs, rutas de carpetas y aplicaciones a nivel de sistema operativo, colores hexadecimales del tema, nombres de campo de BD en inglés, correos electrónicos, texto en inglés, números, patrones de expresiones regulares, símbolos, fragmentos de código o muestras de configuración.
En la medida de lo posible, un tema limpio no debe contener ningún contenido CSS o LESS. El tema More, en comparación, hereda los estilos CSS para el logotipo del tema Clean, pero también contiene una pequeña cantidad de LESS como ejemplo para cuando se personaliza un tema. Tanto Clean como More heredan completamente todo el CSS de su tema padre 'Bootstrap Base'.
