Submitted by martin on Lun, 06/10/2019 - 21:37

WEB DO CRA SANTA COMBA

TITORIAIS DRUPAL

1. Presentación

2. Para que nos pode valer a web do centro?

IES Ramón Caamaño

CEIP Barrié de la Maza

CEIP Celso Emilio Ferreiro

4 Elements Galicia

https://www.youtube.com/watch?v=Co27sUOD0w0

1. Engadir unha URL

https://matematicinfantil.wordpress.com/

https://drive.google.com/drive/u/0/folders/0Bw8FsVGnN_X3YmlHVFY5bXk0Y1E

2. Procupar unha imaxe libre en Google e publicala en Drupal

 

- Buscamos "Regletas de Cuisenaire"

- Descargamos a imaxe e publicámola na web

   a. A través da URL

   b. Subindo a imaxe ao servidor

3. Youtube

Om Mani Padme Hum: https://youtu.be/R-ZO7bsA2pA

4. Pdf

   https://almumoyamartinez.files.wordpress.com/2016/12/material-regletas.pdf

a. Recorte de imaxe. Enlazar a imaxe ao documento

b. Pdf no Drupal e no móbil https://blog.atio.es/node/260

  <style>
        .folletomobil{
            position:relative;
            overflow:hidden;
            padding-bottom:70%;
        }
        .folletomobil iframe{
            width:100%;
            height:100%;
            position:absolute;
            top:0;
            left:0;
        }
    </style>
    <script src="https://cdn.jsdelivr.net/jquery/latest/jquery.min.js"></script>
   </head>
<body>
<div id="folleto" class="folletomobil"></div>
<script>
function detector(){
    if( navigator.userAgent.match(/Android/i)
 || navigator.userAgent.match(/webOS/i)
 || navigator.userAgent.match(/iPhone/i)
 || navigator.userAgent.match(/iPad/i)
 || navigator.userAgent.match(/iPod/i)
 || navigator.userAgent.match(/BlackBerry/i)
 ){
    document.getElementById('folleto').innerHTML += '<iframe src="https://docs.google.com/viewer?url=http://www.edu.xunta.gal/centros/zonaceed6/system/files/Asperger_final.pdf&embedded=true"  frameborder="0"></iframe>';
    }
else{
    document.getElementById('folleto').innerHTML += '<iframe src="http://www.edu.xunta.gal/centros/zonaceed6/system/files/Asperger_final.pdf" frameborder="0"></iframe>';
}
}
$(document).ready(function() {
    detector();
});
</script>
</body>

5. Vídeo

   a. Descargamos vídeo da web

   Montaxe dun Escornabot. CEIP DE BAIÑAS http://www.edu.xunta.gal/centros/ceipbainas/node/319

   http://www.edu.xunta.gal/centros/ceipbainas/system/files/escornabot.mp4

   Código:

   <div>
   <video width="512" height="240" controls="controls">
   <source src="http://www.edu.xunta.gal/centros/ceipbainas/system/files/escornabot.mp4" type="video/mp4" />
   O teu navegador non soporta este vídeo.
   </video>
   </div>

DIMINUIR O TAMAÑO DUN VÍDEO

6. Lightbox

   Titorial

   http://atio.es/acristina/data/_uploaded/image/abarca/abarca.jpg

https://blog.atio.es/sites/blog/files/inline-images/crastacomba/abarca2.jpg

  

SESIÓN 3

1. Crear unha nova cun texto, elixindo de forma axeitada a taxonomía e termo

https://www.lipsum.com/

a. Crear contido > páxina

b. Crear contido > Páxina portada

Volver a editala, cambiando o título. Borrala nova.

2. Descargar unha imaxe libre, cambiarlle o tamaño a un máximo de 500px de ancho co Gimp

https://unsplash.com/

3.Subir un pdf

a. Descargar este ficheiro pdf: https://oaoa.atio.es/sites/oaoa/files/inline-images/suma_arbol/suma_arbol_nivel_1.pdf

b. Sacar unha captura de imaxe de parte do pdf

c. Subir a imaxe resultado da captura

d. subir o pdf como ficheiro adxunto

e. Enlazar a imaxe co pdf

4. Inserir un vídeo de Youtube. Antonio Fraguas e os seus mestres. I.E.S de Cotobade

https://www.youtube.com/watch?v=HTYrYVjaeIA&feature=share

5. Inserir un vídeo con código html5

a. Descargar o vídeo: http://www.edu.xunta.gal/centros/ceipbainas/system/files/colega.mp4

b. Crear contido Páxina. Adxuntamos o ficheiro de vídeo. Copiamos a URL e adaptamos o seguinte código.

<div>
<video width="720" height="406" controls="controls">
<source src="http://atio.es/fi/video.mp4" type="video/mp4" />
O teu navegador non soporta este vídeo.
</video>
</div>

6. Redimensionar un conxunto de imaxes por lotes e crear un álbum

a. Descargar o xnconvert e instalalo e configurar o idioma: https://www.xnview.com/en/xnconvert/#downloads

b. Baixar a seguinte carpeta comprimida con imaxes. Descomprimila. Dentro da carpeta creamos unha subcarpeta chamada escaladas, na que introduciremos as fotos coas novas dimensións.

http://www.edu.xunta.gal/centros/zonaceed6/system/files/album_fotos_cra.zip

c. Co XnConvert, abrimos o cartafol no cal teñamos as fotos. En accións, escollemos a de Imaxe > Redimensionar, cun ancho de 300px

d. En saída, escollemos a subcarpeta escaladas e Nome de Ficheiro, deixamolo así {Filename}_r

e. Clic en convert

f. Editar o seguinte código html, modificando o src das imaxes

<!DOCTYPE html>
<html lang="es">
<head>
    <meta charset="UTF-8">
    <style>
        #galeria_cra{
            box-sizing: border-box;
            width:100%;
            padding: 10px;
            background:#343C44;
            border-radius: 7px;
            overflow:hidden;
        }
        #galeria_cra .filagaleria{
            display:flex;
            flex-wrap: wrap;
            justify-content: space-around;
        }
        #galeria_cra .caixa{
            display:flex;
            position: relative;
            width:300px;
            height: auto;
            margin-top:10px;
        }
    </style>
</head>
<body>
        <section id="galeria_cra">
                 
                    <div class="filagaleria">
                        <div class="caixa"> <img src="https://picsum.photos/300/200?random=1" alt=""></div>
                        <div class="caixa"> <img src="https://picsum.photos/300/200?random=2" alt=""></div>  
                        <div class="caixa"> <img src="https://picsum.photos/300/200?random=3" alt=""></div>  
                        <div class="caixa"> <img src="https://picsum.photos/300/200?random=4" alt=""></div>  
                        <div class="caixa"> <img src="https://picsum.photos/300/200?random=5" alt=""></div>  
                    </div>
        </section>  
</body>
</html>

f. Crear contido páxina. En formato de entrada escollemos PHP code e seguidamente clic en Desactivar texto enriquecido. Pegamos o código html modificado e gardar.

 

7. Cambiar a resolución de un vídeo con Handbrake

a. Descargar o handbrake: https://handbrake.fr/

b. Instalar ffmulticonverter


su root

apt update

apt install ffmulticonverter

b. Descargamos o ficheiro de alta resolución: https://drive.google.com/file/d/1uE4k7ZzwJ2whNgaWG9vRkNYEPekCXxBf/view

c. Cambiamos a resolución, seguindo este tutorial: https://blog.atio.es/node/125

     Dimensións finais: 512 x 288

     Bitrate: 600 kbps

     Audio bitrate:120

d. Publicámolo