Insertar un nuevo estilo de textos y botones usando el editor HTML

Aquí te compartimos unos códigos que puede usar para añadir un nuevo estilo usando el editor HTML de la Plataforma E-learning Chamilo LMS.

Por ejemplo, puedes personalizar la página de inicio de un curso en la Plataforma E-learning Chamilo LMS que está destinado exclusivamente como entorno de Evaluación en Línea. En este caso, se oculta todas las herramienta del curso (íconos color gris) . El alumno cuando se conecte al curso solo verá lo que añadiste en la página de inicio, de esa manera puedes diseñar tu propio estilo de navegación y/u presentación en tu curso virtual.

 

Cabecera de página

<div class=”page-header”>
<h2 style=”text-align: center;”>Título de página</h2>
</div>

Panel por defecto

<div class=”panel panel-default”>
<div class=”panel-heading”>Cabecera de la encuesta</div>


<div class=”panel-body”>
<ul>
<li>Indicaci&oacute;n inicial</li>
</ul>
</div>
</div>

Panel con pie

<div class=”panel panel-default”>
  <div class=”panel-body”> 
    <ul>
      <li>Indicaci&oacute;n inicial</li>
    </ul>
  </div>
  <div class=”panel-footer”>Panel footer</div>
</div>

Diferentes colores del panel

<div class=”panel panel-primary”>…</div>
<div class=”panel panel-success”>…</div>
<div class=”panel panel-info”>…</div>
<div class=”panel panel-warning”>…</div>
<div class=”panel panel-danger”>…</div>

Etiquetas

<span class=”label label-default”>Texto etiqueta</span>
<span class=”label label-primary”>Texto etiqueta</span>
<span class=”label label-success”>Texto etiqueta</span>
<span class=”label label-info”>Texto etiqueta</span>
<span class=”label label-warning”>Texto etiqueta</span>
<span class=”label label-danger”>Texto etiqueta</span>

Mensajes alerta

<div class=”alert alert-success” role=”alert”>Texto de la alerta</div>
<div class=”alert alert-info” role=”alert”>Texto de la alerta</div>
<div class=”alert alert-warning” role=”alert”>Texto de la alerta</div>
<div class=”alert alert-danger” role=”alert”>Texto de la alerta</div>

Botones – enlaces

<a class=”btn btn-default” href=”#” role=”button”>Texto enlace</a>
<a class=”btn btn-primary” href=”#” role=”button”>Texto enlace</a>
<a class=”btn btn-success” href=”#” role=”button”>Texto enlace</a>
<a class=”btn btn-info” href=”#” role=”button”>Texto enlace</a>
<a class=”btn btn-warning” href=”#” role=”button”>Texto enlace</a>
<a class=”btn btn-danger” href=”#” role=”button”>Texto enlace</a>

Revisar más posibilidades de personalización

https://getbootstrap.com/docs/3.3/components/
https://getbootstrap.com/docs/3.3/css/