# Sobre Bookstack

BookStack es una herramienta eficaz, intuitiva y práctica para la gestión del conocimiento

# Introducción a Bookstack

# ¿Qué es BookStack?

BookStack es una plataforma tipo wiki, basada en software libre, que permite una organización sencilla, práctica e intuitiva de toda la información relacionada con la realización de tareas: Protocolos, procedimientos y usos de otras páginas o aplicaciones.

Permite almacenar asimismo información sobre manuales de usuario de otras páginas o aplicativos, clasificando según distintos accesos toda la información relevante para tu equipo.

Se trata por tanto, de una opción muy apropiada para la gestión integral del conocimiento de tu compañía.

Funcionalidades principales:

- Organizar libros, secciones en los mismos y páginas.
- Compartir información y conocimiento procedimental.
- Acceso personalizado (diferentes usuarios y contraseñas web).
- Edición colaborativa de toda la información volcada en la herramienta.
- Separación entre diferentes roles de acceso.
- Recuperación de versiones previas de información y documentos.

##### **[https://www.bookstackapp.com/](https://www.bookstackapp.com/)**

<iframe allowfullscreen="allowfullscreen" height="459" src="https://www.youtube.com/embed/XBrqKRqt0lY" style="width: 821px; height: 459px;" width="821"></iframe>

# Ejemplos

### [Biblioteca Catedu](https://libros.catedu.es/) (Educación Aragón)

[![Captura de pantalla 2025-01-23 a las 21.55.56.jpg](https://simondecolonia.alwaysdata.net/uploads/images/gallery/2025-01/captura-de-pantalla-2025-01-23-a-las-21-55-56.jpg)](https://libros.catedu.es/)

### [Biblioteca EducaMadrid ](https://ayuda.educa.madrid.org/)

[![Captura de pantalla 2025-01-23 a las 21.56.30.jpg](https://simondecolonia.alwaysdata.net/uploads/images/gallery/2025-01/captura-de-pantalla-2025-01-23-a-las-21-56-30.jpg)](https://simondecolonia.alwaysdata.net/uploads/images/gallery/2025-01/IYXKhJCYTO7LEI7i-captura-de-pantalla-2025-01-23-a-las-21-56-30.jpg)

# Pruebas

Aquí va el contenido del capítulo 1

# Contenido Incrustado

Aquí va el texto

https://app.lumi.education/run/TczK19

<iframe allowfullscreen="allowfullscreen" height="468" src="https://www.youtube.com/embed/HAS004qEXRo" style="width: 835px; height: 468px;" width="835"></iframe>

<iframe allowfullscreen="allowfullscreen" frameborder="0" height="333" src="https://orientaeduc.com/wp-admin/admin-ajax.php?action=h5p_embed&id=60" style="width: 820px; height: 333px;" title="¿Cuánto sabes sobre la antigua Roma?" width="820"></iframe>

<iframe allowfullscreen="allowfullscreen" frameborder="0" height="360" src="https://cadenaser.com/embed/audio/460/1690176653006/" width="100%"></iframe>




<iframe src="https://www.slideshare.net/slideshow/embed_code/key/BIW7aJT0ZH2bOu?startSlide=1" width="597" height="486" frameborder="0" marginwidth="0" marginheight="0" scrolling="no" style="border: var(--border-1) solid #CCC; border-width:1px; margin-bottom:5px;max-width: 100%;" allowfullscreen></iframe>
<div style="margin-bottom:5px"><strong>
<a href="https://es.slideshare.net/lbarriocanal/joomla-15-para-principiantes" title="Joomla! 1.5 Para Principiantes" target="_blank">Joomla! 1.5 Para Principiantes</a>
</strong> from <strong>
<a href="https://es.slideshare.net/lbarriocanal" target="_blank">Luis Barriocanal</a>
</strong></div>

# Google Slides

# Google Slides

Texto de la página 2

<iframe allowfullscreen="allowfullscreen" frameborder="0" height="520" src="https://docs.google.com/presentation/d/e/2PACX-1vSRgnHKN_r3sTGmCv-g1z9pk3W_d14s6jmU9p-FZv4p40ENeoFkjEn0LgvE4m2ZYEXfK0Wg2oJVRMM0/embed?start=false&loop=false&delayms=3000" width="800"></iframe>

# tag

<p class="callout info">[fdocuments.net\_brief-solution-focused-counseling-solution-solution-focused-brief-counseling.pdf](https://simondecolonia.alwaysdata.net/attachments/1)</p>

[Link](https://simondecolonia.alwaysdata.net/attachments/2)

> ```php-template
> <div class="embed-container"
>  style="position: relative; padding-bottom: 59.27%; height: 0; overflow: hidden; max-width: 100%;">
>  <iframe style="position: absolute; top: 0; left: 0; width: 100%; height: 100%;"
>   src="[Enter src from Google Slides Embed iFrame Code]" frameborder="0" width="960" height="569" allowfullscreen="true" webkitallowfullscreen="true" mozallowfullscreen="true"></iframe>
> </div>
> 
> ```
> 
> https://docs.google.com/presentation/d/e/2PACX-1vSRgnHKN\_r3sTGmCv-g1z9pk3W\_d14s6jmU9p-FZv4p40ENeoFkjEn0LgvE4m2ZYEXfK0Wg2oJVRMM0/embed?start=false&amp;loop=false&amp;delayms=3000

<div class="embed-container" id="bkmrk--3" style="position: relative; padding-bottom: 59.27%; height: 0; overflow: hidden; max-width: 100%;"><iframe allowfullscreen="allowfullscreen" frameborder="0" height="569" src="https://docs.google.com/presentation/d/e/2PACX-1vSRgnHKN_r3sTGmCv-g1z9pk3W_d14s6jmU9p-FZv4p40ENeoFkjEn0LgvE4m2ZYEXfK0Wg2oJVRMM0/embed?start=false&loop=false&delayms=3000" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%;" width="960"></iframe>

</div>

# Contenido H5P incrustado

# Contenido H5P incrustado

<iframe allowfullscreen="allowfullscreen" frameborder="0" height="767" src="https://orientaeduc.com/wp-admin/admin-ajax.php?action=h5p_embed&id=74" title="Arquitectura y Arte en Roma" width="746"></iframe>

[La dinámica de la máscara sobre sentimientos guardados.pdf](https://simondecolonia.alwaysdata.net/attachments/3)

[Enlace](https://simondecolonia.alwaysdata.net/attachments/4)

# Google docs

<iframe height="483" src="https://docs.google.com/document/d/e/2PACX-1vRpocGoRspgydBXJGdduLykb7WgwcSqX5TULyOGVyrNZjalY9Gyr1HKY62ACEnB87yY2rkt22NOyARR/pub?embedded=true" style="width: 966px; height: 483px;" width="966"></iframe>

# Imágenes

[![Captura de pantalla 2025-07-14 a las 23.40.24.jpg](https://libros.orientaeduc.com/uploads/images/gallery/2025-07/scaled-1680-/captura-de-pantalla-2025-07-14-a-las-23-40-24.jpg)](https://libros.orientaeduc.com/uploads/images/gallery/2025-07/captura-de-pantalla-2025-07-14-a-las-23-40-24.jpg)

[3m-faq-installation-3m-wrap-film-2080-es.pdf](https://books.orientaeduc.com/attachments/1)

[Joomla!](http://www.joomla.org/) es un potente gestor de contenidos web (CMS o Content Management System) que permite crear sitios web elegantes, dinámicos e interactivos. Por su diseño, potencia, flexibilidad y por sus enormes posibilidades de ampliación se está convirtiendo en el sistema de publicación preferido por muchos [centros educativos](http://edublog.es) y por millones de webmasters en todo el mundo para desarrollar su portal web.

Con Joomla! podemos crear en poco tiempo un completo portal para un **centro escolar** o una **web docente** en la que publicar [noticias](https://edujoomla.es/articulos/noticias), blogs, directorios de [enlaces](https://edujoomla.es/enlaces) o documentos para descargar sin necesidad de conocimientos técnicos especiales o de complejos lenguajes de programación.

A partir de una [plantilla](https://edujoomla.es/manuales-joomla-15/plantillas) y de unos contenidos de ejemplo iniciales podemos desarrollar un vistoso y completo portal añadiendo los [contenidos](https://edujoomla.es/manuales-joomla-15/gestion-contenido), [menús](https://edujoomla.es/manuales-joomla-15/menus) y elementos visuales deseados a través de un entorno web y sin necesidad de programas auxiliares ni de conocimientos especiales de diseño o de programación ya que todas estas operaciones de edición y administración se realizan a través de cualquier navegador.

La introducción y edición de contenidos resultan así una tarea cómoda y sencilla y ello nos permite mantener nuestro sitio permanentemente actualizado.

#### Joomla! es Open Source

Joomla! es una aplicación [Open Source](http://www.opensourcematters.org/) o de [código abierto](http://es.wikipedia.org/wiki/C%C3%B3digo_abierto "Código abierto") programada en lenguaje [PHP](http://es.wikipedia.org/wiki/PHP "PHP") bajo una licencia [GPL](http://es.wikipedia.org/wiki/GPL "GPL") y que utiliza una [base de datos ](http://es.wikipedia.org/wiki/Base_de_datos "Base de datos")[MySQL](http://es.wikipedia.org/wiki/MySQL "MySQL") para almacenar el contenido y los parámentros de configuración del sitio. Además de libre, Joomla! es gratuito y no tendrás que pagar nada por usar este CMS para construir tu web.

Joomla! se basa en [Mambo](http://es.wikipedia.org/wiki/Mambo_Open_Source "Mambo Open Source"), otro CMS iniciado por la empresa australiana Miro, que tenía además la propiedad de la marca. El proyecto Joomla surge en 2005 cuando Miro decidió crear una Fundación que, a jucio de una buena parte de los desarrolladores de Mambo, se apartaba bastante de la filosofía del software libre. Estos desarroladores se agruparon en torno al movimiento [Open Source Matters](http://www.opensourcematters.org/) que poco después daría lugar a Joomla!, una denominación que procede de una palabra de la lengua swahili que significa "todos juntos".

La nueva versión de Joomla -la 1.5- fue liberada en enero de 2008 incorporando interesantes novedades y está escrita en un código completamente nuevo con el que se ha independizado ya completamente de su predecesor. No obstante, el equipo de desarrollo de Joomla sigue manteniendo actualizada la serie anterior, la 1.0.x, ya que muchos sitios web funcionan aún con esa versión inicial.

[![image.png](https://books.orientaeduc.com/uploads/images/gallery/2025-07/scaled-1680-/image.png)](https://books.orientaeduc.com/uploads/images/gallery/2025-07/scaled-1680-/image.png)

# Hacks y arreglos

# Personalizar tamaño texto en títulos y encabezados

You can customize the default header sizes by adding something like the below to the "Custom HTML Head Content" setting:

```
<style>
.page-content h1 { font-size: 2rem; }
.page-content h2 { font-size: 1.8rem; }
.page-content h3 { font-size: 1.6rem; }
.page-content h4 { font-size: 1.4rem; }
.page-content h5 { font-size: 1.3rem; }
.page-content h6 { font-size: 1.15rem; }
</style>
```

[https://github.com/BookStackApp/BookStack/issues/462#issuecomment-786803638](https://github.com/BookStackApp/BookStack/issues/462#issuecomment-786803638)

# Iframes

### Host Iframe Control

By default BookStack will only allow itself to be embedded within iframes on the same domain as you’re hosting on. This is done through a [CSP: frame-ancestors](https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/frame-ancestors) header. You can add additional trusted hosts by setting a `ALLOWED_IFRAME_HOSTS` option in your `.env` file like the example below:

<div class="highlight" id="bkmrk-%23-adding-a-single-ho"><div class="chroma"><table class="lntable"><tbody><tr><td class="lntd">```
```

</td><td class="lntd">```bash
# Adding a single host
ALLOWED_IFRAME_HOSTS="https://example.com"

# Multiple hosts can be separated with a space
ALLOWED_IFRAME_HOSTS="https://a.example.com https://b.example.com"

```

</td></tr></tbody></table>

</div></div>Note: when this option is used, all cookies will served with `SameSite=None` [(info)](https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Set-Cookie/SameSite#None) set so that a user session can persist within the iframe.

---

<a name="iframe-src-control"></a>

### Iframe Source Control

By default BookStack will only allow certain other hosts to be used as `src` values for embedded iframe/frame content within the application. This is done through a [CSP: frame-src](https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/frame-src) header. You can configure the list of trusted sources by setting a `ALLOWED_IFRAME_SOURCES` option in your `.env` file like the examples below:

<div class="highlight" id="bkmrk-%23-adding-a-single-ho-1"><div class="chroma"><table class="lntable"><tbody><tr><td class="lntd">```
```

</td><td class="lntd">```bash
# Adding a single host
ALLOWED_IFRAME_SOURCES="https://example.com"

# Multiple hosts can be separated with a space
ALLOWED_IFRAME_SOURCES="https://a.example.com https://b.example.com"

# Allow all sources
# This opens vulnerability risk and should only be done in secure & trusted environments.
ALLOWED_IFRAME_SOURCES="*"

```

</td></tr></tbody></table>

</div></div>By default this option is configured as follows:

<div class="highlight" id="bkmrk-allowed_iframe_sourc"><div class="chroma"><table class="lntable"><tbody><tr><td class="lntd">```
```

</td><td class="lntd">```bash
ALLOWED_IFRAME_SOURCES="https://*.draw.io https://*.youtube.com https://*.youtube-nocookie.com https://*.vimeo.com"

```

</td></tr></tbody></table>

</div></div>Note: The source of ‘self’ will always be automatically added to this CSP rule. In addition, the host used for the diagrams.net integration (If enabled) will be automatically appended to the lists of hosts.