jueves, 10 de enero de 2013

Modificar plantillas (css) de Chamilo LMS 1.9.x

Este blog ya no se encuentra activo. Por favor, visita nuestro nuevo blog para poder leer esta entrada: http://contidosdixitais.com/modificar-plantillas-css-de-chamilo-lms-1-9-x/

35 comentarios:

  1. Buen post! gracias por la información, pero tengo una duda, estoy tratando de modificar el estilo de mi chamilo 1.9, pero el problema es que no lo conozco bien y necesito colocar 2 imagenes en el footer y agregar un slider de imágenes, es para horas sociales y no me queda mucho tiempo :( , sabes o me podrías indicar como puedo hacer eso por favor?. De antemano gracias por la ayuda.

    ResponderEliminar
    Respuestas
    1. Hola Carlos, las imágenes en el footer se pueden poner como "background" en el CSS según dónde quieras, por ejemplo en la parte izquierda debes añadir en el documento "default.css" las siguientes líneas:

      div#footer_left {
      background: url("images/footer_logo.png") no-repeat scroll 0 0 transparent;
      height: 37px;
      width: 202px;
      }

      Si deseas que aparezca la imagen en la en la parte central o derecha del footer tendrás que sustituir la línea "div#footer_left" por:

      div#footer_center (para que aparezca en la parte central)
      div#footer_right (para que aparezca en la parte derecha)


      Para el caso del slider, entiendo que querrás ponerlo en la página principal (Administración/Configuración de la página principal/Editar la página principal). Si es así:

      1. Podrás añadir el siguiente código mostrado a continuación no sin antes tener activada la opción de "Fuente HTML" que se encuentra en lo botones de la parte superior (si le pasas el ratón por encima aparecerá el nombre)

      http://stackoverflow.com/questions/11318247/bxslider-style-configuration

      2. Del código anterior sustituye la palabra "Slide one content" por tu imagen o contenido en código HTML.


      Bueno espero que esta pequeña y rápida descripción te pueda ayudar.

      Saludos.

      Eliminar
  2. Hola amigo me podrías ayudar a como puedo eliminar y/o cambiar de nombre a algunos menus

    ResponderEliminar
    Respuestas
    1. Hola Luis lo que a continuación te explicaré será para modificar palabras o términos dentro de la plataforma, lo que te permitirá cambiar los enlaces del menú principal además de otras secciones. A modo de ejemplo vamos a cambiar la palabra "Mi agenda" por "Mis cosas" y tendrá que verse reflejado en el menú principal.


      1- En la opción en "Administración/Parámetros de configuración de Chamilo/Idioma(clic en el icono)" y donde dice: "Permite definir sub-idiomas" marcas "Sí". Permitiendo definir variaciones para cada término del lenguaje usado para la interfaz de la plataforma.

      2- Una vez activado esta opción estará en el menu de idiomas de su página de administración "Administración/Parámetros de configuración de Chamilo/Idioma" luego haces clic en la primera opción donde dice "Idioma de la plataforma Chamilo" y aparecerá la lista de todos los idiomas disponibles de la plataforma.

      3- Una vez en la lista, vas al idioma Español por ejemplo, y haces clic en el icono a la derecha en el icono "crear sub-idioma" y aparecerá el formulario para crearlo, le pones un nombre y activas la opción "Visibilidad".

      4- Luego en la lista de idiomas de la plataforma (Administración/Parámetros de configuración de Chamilo/Idioma, selecciona la primera opción) aparecerá en la lista tu idioma con el nombre que le hayas puesto y en los iconos de la derecha haces clic en el icono "Añadir palabras al sub-idioma".

      5- Una vez en la sección de "Añadir palabras al sub-idioma" debes buscar la palabra que deseas modificar, por ejemplo si deseo cambiar el nombre del enlace de "Mi agenda" por "Mis cosas" escribes en la búsqueda "Mi agenda" tal cual y aparecerá una lista detallada de todos los sitios dónde aparece esa palabra en cada sección de la plataforma y un espacio a la derecha para escribir la palabra por la que deseas sustituir "Mi agenda" que la cambiaremos por "Mis cosas". Recuerda hacer clic en "Guardar" cada vez que escribas la palabra "Mis cosas".

      6- Finalmente debes asignarle el idioma nuevo a uno de los cursos que tengas creado. Vas a tu lista de cursos y lo editas (icono del lápiz) y allí le cambias el idioma a tu idioma creado.

      Bueno Luis espero que te pueda ayudar esta explicación, cualquier detalle me comentas.

      Un saludo!!

      Eliminar
    2. muchas gracias amigo me resolviste este problema, te seguiré consultando más cosas para seguir aprendiendo gracias nuevamente

      Eliminar
    3. Hola Luis. De nada! ya sabes donde nos tienes. Un saludo!!

      Eliminar
  3. Hola

    Como puedo poner un texto a un lado del logo de Chamilo si el header-logo.png solo puede medir (250x70 pixeles).

    Cuando trato de incluir el texto en el header-logo.png mide 1000x70 y al desplegarlo este se reduce de tamaño.

    Ver por favor este link:
    http://www.chamilo.org/phpBB3/viewtopic.php?f=16&t=4204

    ResponderEliminar
    Respuestas
    1. Hola Francisco:

      Para hacer que la imagen que has insertado aparezca a una dimensión personalizada, en este caso un ancho de 1000px, debes añadir el siguiente código dentro del archivo "default.css"

      header #logo {
      width:1000px;
      }

      Definiendo así que tu logo mide 1000px ancho y de esta forma la imagen se verá correctamente.

      Espero que esto te pueda ayudar.

      Un saludo!

      Eliminar
    2. Hola que tal? yo también tengo este problema e introduje las lineas de código que sugieres pero no funciona, estoy trabajando en localhost, a que crees que se deba?

      Eliminar
    3. Hola con respecto a mi comentario anterior quisiera decir que reinicie la computadora y ahí ya agarro el código y el logo que coloque ya aparece más grande.. muchas gracias por el dato.

      Eliminar
  4. Hola qué tal! Soy nueva en esto y tengo un problema, lo que pasa es que quiero personalizar mi página principal y cargo mi imagen y todo, pero cuando se lo mando a otra persona para que lo vea sale una interfaz totalmente diferente y además muy fea. ¿Cómo le puedo hacer para que todos puedan ver mi página principal? Lo que me sale es esto http://localhost/CHAMILO/index.php

    ResponderEliminar
  5. Hola Silvia, la url que nos indicas para ver lo que te aparece (http://localhost/CHAMILO/index.php) hace referencia a un servidor local por lo que no podemos verlo.
    Podrías darnos más información, ya sea con una vista previa o una descripción más detallada de lo que sucede?
    Un saludo!

    ResponderEliminar
  6. Bueno, creo que ese es mi problema, tengo que cambiar mi URL, y no hay mucha información acerca de eso, podrías indicarme los pasos a seguir por favor? Tengo otra duda, puedo hacer que en vez que el fondo de las plantillas sea de otro color? Gracias!

    ResponderEliminar
  7. Hola
    Utilizo la ultima version estable de chamilo en la seccion mis cursos crear un bloque para que el alumno ingrese la id de un curso en particular y desde alli de pueda matricular, por el comienzo me conformo con que me orientes en la creacion del bloque en esta seccion especifica, de antemano muchas gracias.

    ResponderEliminar
  8. Hola Yamid, podrías darnos más información sobre lo que necesitas hacer?. Si puedes poner una enlace con una vista previa también nos sería de utilidad.

    Un saludo!

    ResponderEliminar
  9. Hola buena tarde, mi duda es si se podrá agregar un elemento externo a chamilo a la pagina principal, como un div personalizado extra, que muestre cierta información que no es de chamilo.

    Saludos.

    ResponderEliminar
    Respuestas
    1. Hola muy buenas. Si te refieres a un elemento externo como HTML CSS y Javascript, sí se pueden añadir.

      Debes editar la página principal en "Administración > Configuración de la página principal > Editar página principal".

      Luego aparecerá la sección para editar la página principal y debes buscar el botón que dice "Fuente HTML" cuando le pasas el ratón por encima.

      Esta opción te permitirá insertar código HTML, CSS y Javascript como si estuvieras en un editor de código.

      Bueno espero te resulte de ayuda, cualquier detalle me comentas.

      Saludos mil!!

      Eliminar
  10. Muy buen tutorial, hasta ahora no vi uno como este. Solamente tengo una duda. Cómo le defino a chamilo cual carpeta o archivo css va a leer. para que s pueda ver el cambio. Tiene académica, baby-orange, blue-lagoon, etc y cada uno de ellos tiene un archivo default.css

    ResponderEliminar
  11. Hola Juan:
    Sí, en cuanto a las modificaciones en el CSS la mejor opción sería hacerlas todas en el archivo "default.css" ya que de lo contrario podríamos generar conflictos si comenzamos a editar código en varios archivos css.
    Editando sólo el "default.css" evitamos repetir código y perder el control de los archivos css donde hemos editado.

    Un saludo, espero esto te resulte de ayuda!!

    ResponderEliminar
  12. Hola.excelente blog, tengo una duda, agrege una leccion importandola desde un SCORM pero al visualizarla no se ve completo, ya trate de modificar divs en defaults.css y scorm.css pero no he logrado ampliarlo, me prodrian ayudar.
    gracias de antemano

    ResponderEliminar
    Respuestas
    1. Hola Claudia, el módulo de scorm es un poquito más completo y puede que se necesiten modificar más cosas que el css. Te animo a que plantees esta misma duda en el foro de Chamilo: http://www.chamilo.org/phpBB3/viewforum.php?f=15 Ahí también estamos nosotros y creeo que entre todos te podremos ayudar mejor.

      Eliminar
  13. Hola, excelente blog, una duda, realize una leccion importando desde un scorm, pero al visualizarla no la veo completa, trate de modificar defaults.css y scorm.css pero sigo sin minimizar el margen o ampliar el div para que se vea mas grande. pueden ayudarme.
    gracias de antemano

    ResponderEliminar
  14. Hola Excelentes aportes,quisiera saber dos cosas una es de que forma puedo cambiar el nombre de chamilo que aparece en la parte inferior derecha. y dos si hay alguna forma de conectar mi login con mi página web directamente. Saludos

    ResponderEliminar
  15. hola quiero saber como programar un slider show de imagenes en mi web central para my campus saludos

    ResponderEliminar
  16. te recuerdo que son varias imagenes

    ResponderEliminar
  17. Hola Jose, muy buenas:

    Te envío un enlace para utilizar un Slide, no sólo en Chamilo sino en cualquier sitio web:
    http://bxslider.com/
    Ahí en "How to install" explica cómo instalarlo. Básicamente sería pegar el código que se muestra allí y enlazarlo con los archivos de css y javascript que podrás descargar también en esa página.

    Supongamos que vas a poner el Slide en la página principal pues debes ir a:
    Administración/Configuración de la página principal/Editar la página principal, luego activando el botón "Fuente HTML" ya podrás pegar el código descrito en la página.

    Un saludo! espero ayudarte.

    ResponderEliminar
  18. una pregunta no se como saque una pagina aparte o sea en blanco solo sale la parte de registro me sale que le ponga logo foto y queria saber como puedo volver a como estaba antes o mejor como puedo personalizarlo

    ResponderEliminar
  19. HOLA, yo quisiera cambiar el logo por una imagen mas grande, alguien puede colaborarme con esto

    ResponderEliminar
  20. Hola Camilo, eso lo puedes hacer sustituyendo la imagen como se muestra en el punto 4:

    4. Cambiar el logo
    Para cambiar el logo simplemente sustituiremos la imagen del logo llamada "header-logo.png" que se encuentra en:

    ../main/css/mi_campus/images/header-logo.png

    El logo que trae por defecto tiene una dimensión de 250px(ancho) y 70px(alto) por lo que la imagen a sustituir deberá tener aproximadamente esas dimensiones.

    Un saludo

    ResponderEliminar
  21. ¿hola una consulta, como cambio la orientacion del menu? pues veo que en tu SS sale a la derecha y en el mio hacia la izquierda

    ResponderEliminar
  22. Hola Javier:

    No hay posibilidad de cambiarlo desde la administración de la plataforma ya que en la versión que se hizo este tutorial era la 1.9.2 donde este menú aparecía a la derecha pero en la última versión de Chamilo la orientación del menú es a la izquierda.

    Un saludo.

    ResponderEliminar
  23. Como aumento los 100 megas que me da chamilo para mis curso, necesito mas espacio. Te lo agradezco.

    ResponderEliminar
    Respuestas
    1. Hola, ¿te refires a tu espacio en el campus libre campus.chamilo.org? Si te refieres a eso, no puedes aumentarlos tú mismo. El campus libre de Chamilo está pensado para ayudar a aquellos docentes sin recursos de todo el mundo que necesitan una pequeña aula vrtual. Por eso tiene unas limitaciones. Si necesitas un aula virtual con más espacio tendrás que hacer tu propia instalación o contratar la de un proveedor oficial.

      Eliminar
  24. hola quiero que sigas con el tutorial para cambiar mucho mas a fondo la plantilla, cambiar iconos, agregar imagenes en movimientos, agregar video, sonido es que me urge pues estoy desarrollando un proyecto para esta semana, mi nombre es fidel torres de Colombia este es mi correo fideltorresserpa@hotmail.com

    ResponderEliminar
    Respuestas
    1. Hola Fidel, esta entrada es una entrada antigua que hemos hecho hace tiempo y no tenemos previsto actualizarla en breve. Seguiremos con más trucos y más cosas sobre Chamilo el próximo mes. Permanece al tanto y gracias por seguirnos.

      Eliminar

Nota: solo los miembros de este blog pueden publicar comentarios.