Comparte Código Con El Plugin CodePen Embed

CodePen se está convirtiendo cada vez más en una red social para Desarrolladores Front-End. Proporciona a los usuarios una manera fácil para que puedan crear, almacenar y compartir código creado con HTML, CSS, Javascript y uso de librerias y frameworks externos.

En CodePen cada publicación se conoce como “pen” así como en wordpress una publicacion se le dice “post”, como sea, incluyen el código HTML, CSS, JS y debajo se muestra el resultado. Para un Desarrollador Front-End es esencial hacer demostraciones y casos de prueba con librerías externas para verificar las compatibilidades entre navegadores.

Ejemplo de un Embed de CodePen

Check out this Pen!

CodePen Embed es un plugin para WordPress que te permite incorporar fácilmente el resultado de un Pen de CodePen en un post. El plugin agrega un botón en el editor visual y un quicktag para el editor de HTML, que genera un código para hacer el embed del Pen en nuestro sitio o blog.

El plugin funciona correctamente. El resultado del pen se ajusta perfectamente en el área del contenido del post y la altura puede ser personalizada en el código. Puedes hacer un embed de cualquier pen que sea público. Para usar el plugin no se requiere una cuenta de CodePen, por lo que puedes compartir pens de otros usuarios.

Si eres un usuario activo en CodePen y quieres una manera mas cómoda para compartir tus códigos y mostrar el resultado en tus posts y/o tutoriales, instala el plugin CodePen Embed. Comparte algunos de tus fragmentos en tu blog de WordPress.

Recomendado