Want to create interactive content? It’s easy in Genially!

Get started free

Generador de Memes - Trinket

Erica De Pacheco

Created on May 27, 2025

Start designing with a free template

Discover more than 1500 professional designs like these:

Practical Microsite

Essential Microsite

Akihabara Microsite

Essential CV

Akihabara Resume

Momentum: First Operational Steps

3D Corporate Reporting

Transcript

Puedes verlo funcionar si haces clic en la imagen de abajo

Generador de Memes

Empezar

En este recurso harás un generador de memes. Usando una imagen de tu elección, puedes crear tu propio meme para presumir ante tus amigos.

10

¿Listo para comenzar? ¡Haz clic en el enlace al editor y sorprendete!

Ir al Proyecto

Importante: Nunca olvides de guardar tu proyecto en la medida que vas avanzando.

10

El proyecto deberia parecerse a esto:

10

Obteniendo los archivos CSS y Javascript.Al comenzar nuestro proyecto vamos a la cabecera de la página y añadimos los archivos necesarios. Agrega dentro de la etiqueta <head> el código resaltado en azul:

10

Creando los archivos CSS y JS.
Vamos a crear los archivos y colocarles el nombre a cada uno.

10

Obteniendo la imagen y el texto Queremos que las personas puedan usar su propia imagen y texto para crear el meme, vamos a añadir dentro de <body> un formulario que nuestro usuario puede completar. Escribe el código resaltado.

10

Construye el meme Necesitamos crear un área donde se mostrará el meme. Debajo de la etiqueta de cierre </form>, añade el código resaltado:

10

Apariencia de nuestro meme: Agrega el código siguiente en la sección CSS y luego si lo deseas puedes modificar sus propiedades.

10

Muestra el texto Hasta ahora, todo el código que has escrito está en lenguaje HTML y CSS, que le dice a la página el aspecto que debería tener. Ahora vamos a añadir algo de código JavaScript para decirle a la página qué hacer. Copia y pega este código en meme.js:

10

¡Presume de tu meme ante tus amigos!

10