LiveCanvas Review: un creador de páginas de WordPress amigable para desarrolladores

Publicado: 2021-04-03

En esta revisión, analizamos un complemento de creación de páginas de WordPress con un editor de HTML y CSS incorporado: LiveCanvas.

Si bien hay muchos complementos de creación de páginas disponibles para WordPress, este tiene como objetivo diferenciarse de la competencia al ser lo más amigable posible para los desarrolladores.

No solo eso, sino que el resultado de este generador de páginas es HTML y CSS puro. Gracias a esto, sus páginas deberían cargarse más rápido y ser más amigables con el SEO, en comparación con otros complementos de creación de páginas.

En esta revisión de LiveCanvas, cubrimos todas las mejores características de esta herramienta para ayudarlo a decidir si este es el complemento de creación de páginas de WordPress adecuado para su sitio web.

Empecemos…

¿Para quién es el complemento LiveCanvas?

El editor de LiveCanvas

Cualquiera que quiera tomar el control total del diseño de su sitio web de WordPress debería encontrar LiveCanvas como un complemento interesante.

Sin embargo, LiveCanvas tiene muchas características que los desarrolladores y programadores deberían encontrar especialmente útiles. Estas características ayudan a separar LiveCanvas de la competencia. Gracias al editor de HTML y CSS que cubrimos con más detalle más adelante en esta revisión, usted obtiene mucho control sobre cómo se ve su sitio con este complemento de WordPress.

Entonces, si desea crear un sitio web personalizado de WordPress o agregar páginas con diseños personalizados a su sitio, LiveCanvas podría ser el complemento para usted.

LiveCanvas funciona con su propio tema, un tema secundario personalizado de UnderStrap. Esto significa dos cosas: buen rendimiento del sitio y tener Bootstrap 4 como marco CSS debajo.

Características del complemento de WordPress LiveCanvas

Como LiveCanvas es un poderoso complemento de creación de páginas de WordPress, tiene muchas características. Estos son algunos de los aspectos más destacados de esta herramienta para ayudarlo a decidir si es adecuado para usted.

Para obtener una descripción general rápida del complemento, este video le brinda una guía rápida de lo que puede hacer LiveCanvas.

Un complemento de creación de páginas amigable para desarrolladores

Editor de código LiveCanvas

Una de las características fáciles de desarrollar de este creador de páginas es el editor de código LiveCanvas. Al crear diseños de página con el complemento, puede ver rápidamente el HTML y CSS subyacentes. No solo puede ver este código, sino que también puede editarlo a través del editor fácil de usar.

Esto le brinda mucha más libertad de la que obtiene con muchos otros complementos de creación de páginas de WordPress. Gracias a esto, debería poder crear diseños verdaderamente personalizados y únicos para su sitio web de WordPress, todo mientras usa un complemento estándar.

Sin embargo, si no es un desarrollador y no tiene interés en editar el HTML y CSS subyacentes, puede usar la interfaz WYSIWYG de LiveCanvas para crear sus páginas.

Mucho contenido prefabricado

Contenido ReadyMade

Si bien LiveCanvas definitivamente atraerá a cualquiera que quiera crear un sitio web de WordPress totalmente personalizado, también viene con un contenido listo para usar de excelente apariencia.

Tiene una gran cantidad de secciones a su alcance, que puede combinar y mezclar para crear páginas web personalizadas fácilmente.

los mentos son.

Todas estas secciones prefabricadas son completamente editables, por lo que puede usarlas tal como vienen o personalizarlas para hacerlas suyas. Son solo fragmentos de código HTML5, utilizando Bootstrap 4.

Algunos ejemplos de los tipos de secciones que cubre este contenido incluyen secciones de héroe, paneles de características, cuadrículas de galería y paneles de llamado a la acción. También puede agregar paneles de perfil de miembros del equipo, secciones de la tabla de precios y pantallas de testimonios. Hay múltiples variaciones de cada tipo, por lo que debería poder encontrar algo que funcione para su sitio, sin importar cuáles sean sus preferencias y requisitos de diseño.

Gracias a las elegantes secciones de contenido prefabricadas, le resultará fácil crear rápidamente sus páginas con LiveCanvas.

Interfaz del constructor de páginas front-end

Interfaz del generador de páginas LiveCanvas

Como muchos de los mejores complementos modernos de creación de páginas para WordPress, LiveCanvas tiene una interfaz de usuario. Esto significa que todo su trabajo de personalización se realiza a través de un editor WYSIWYG. En el pasado, con la mayoría de complementos de este tipo, este trabajo se habría realizado en el back-end de su sitio web de WordPress. Esto fue un inconveniente ya que la vista de la página en la que estaba trabajando no se parecería en nada a la versión que verían sus visitantes cuando se publicara el contenido.

Como LiveCanvas tiene una interfaz de usuario, tienes una muy buena idea de cómo se verá tu página cuando se active mientras estás trabajando en ella. Esto elimina la necesidad de guardar su trabajo, obtener una vista previa de su página en una nueva pestaña del navegador y cambiar de pestaña para ver cómo se verá cuando se publique. Gracias a esto, puede crear diseños de página personalizados con LiveCanvas mucho más rápido de lo que lo haría cuando usa un creador de páginas con un editor de back-end.

Estas son algunas de las mejores características de la interfaz del generador de páginas LiveCanvas:

Editar historial

Para darle más libertad creativa y la capacidad de trabajar sin preocuparse por cometer errores, LiveCanvas tiene una función para deshacer. Esto le permite volver a la versión anterior de su diseño de página personalizado en caso de que algo no se vea como pensaba. Ahora puede experimentar con confianza, sabiendo que cualquier error que cometa puede deshacerse rápidamente.

Fácil edición de HTML y CSS

Como se mencionó anteriormente en esta revisión de LiveCanvas, este complemento de creación de páginas tiene un editor de código.

A diferencia de otros complementos populares de creación de páginas de WordPress, LiveCanvas facilita la edición del HTML y CSS subyacentes de sus páginas. Gracias a esto, obtienes mucho más control sobre cómo se verá tu contenido. En cualquier momento, puede ver el HTML y luego realizar cambios en él. Estos cambios se aplicarán instantáneamente a su página, lo que le permitirá tener más control sobre el diseño de su contenido.

Con LiveCanvas, la interfaz del editor de código facilita la edición de HTML y CSS. Cuando abre el Editor HTML, todo el código está claramente formateado y alineado. Los colores se utilizan para facilitar la lectura del código. También puede contraer y doblar fácilmente el código para obtener una vista más clara de la sección que está editando.

Si necesita cambiar el tamaño de la ventana del editor de código, también es fácil. Simplemente arrastre el borde de la ventana para hacerla más pequeña o más grande según sea necesario. Otra característica realmente impresionante del editor de código LiveCanvas es la función de autocompletar. Esto le ayudará a escribir su código más rápido y reducirá los errores al hacer sugerencias a través de la función de autocompletar. Otro aspecto útil del editor de código es su capacidad para corregir su código agregando cualquier etiqueta de cierre que haya olvidado incluir.

El editor LiveCanvas también puede ayudarlo a evitar que se sienta abrumado al editar el HTML y CSS de su página. Para hacer esto, el editor de código oculta todo el HTML y CSS de la vista, además del elemento específico que está editando. Esto le permite concentrarse en la parte de la página en la que está trabajando, sin distraerse ni perderse en el resto del código de la página.

Incluso si no sabe mucho o nada de HTML, esta función seguirá siendo útil. Como hay tantos fragmentos de HTML disponibles en línea, puede copiar y pegar esos ejemplos en el diseño de su página LiveCanvas. Debido a esto, puede agregar más elementos a sus páginas, como botones de llamada a la acción, que haya encontrado en línea. Alternativamente, si conoce algo de HTML, seguramente apreciará la facilidad con la que puede agregar su propio HTML a sus páginas.

Haga sus propios ladrillos: la biblioteca de bloques y secciones

En LiveCanvas tiene la opción de guardar sus propios fragmentos HTML en una biblioteca local para reutilizarlos fácilmente en sus páginas. Esta es una excelente función para ahorrar tiempo: definitivamente es algo que agradecerán aquellos que están creando múltiples páginas o sitios web personalizados.

En realidad, hay dos bibliotecas separadas, Secciones y Bloques: Las secciones son para esos elementos grandes, de ancho completo y grandes confeccionados. Los bloques son para elementos que van dentro de una cuadrícula, por lo que no suelen ser de ancho completo.

Si ha utilizado otros creadores de páginas de WordPress en el pasado y descubrió que todo su contenido se ve bastante similar, esta función puede ayudarlo a construir su propia biblioteca personalizada de módulos para darle a sus diseños un aspecto totalmente original y cubrir sus necesidades altamente específicas. .

Crear pies de página personalizados

Algunos creadores de páginas de WordPress solo le permiten editar las áreas de publicación y página. Sin embargo, ese no es el caso con LiveCanvas. Si desea crear un pie de página personalizado para su sitio web de WordPress, puede hacerlo con LiveCanvas. No está limitado a agregar widgets a su pie de página. En su lugar, puede agregarle cualquier contenido a través del editor de contenido LiveCanvas y su soporte para manejar HTML personalizado.

Acceso rápido a imágenes de archivo

Mientras crea su sitio web o páginas personalizados, puede insertar rápidamente imágenes de archivo en sus diseños con LiveCanvas. Gracias a la integración con Unsplash, puede navegar por su gran biblioteca de imágenes de uso gratuito. Una vez que haya encontrado uno que le guste, puede insertarlo rápidamente en su página. Todo esto tiene lugar desde dentro de la interfaz de edición de LiveCanvas.

Efectos de animación de página *********

Para ayudar a que su contenido capte la atención de sus visitantes, LiveCanvas facilita la adición de animaciones a sus páginas. Al marcar una opción en la página de configuración de backend de LiveCanvas, la biblioteca Animate On Scroll se agrega al sitio. En el editor LiveCanvas puede asignar varias animaciones a cada elemento, como desvanecimiento, volteo, deslizamiento y zoom, mientras mantiene el control de la duración y el retraso de la animación.

Soporte de código corto universal

LiveCanvas le brinda la posibilidad de insertar cualquier código corto en sus diseños de página personalizados. Esto permite integrar cualquier tipo de complemento y funcionalidad de terceros en sus páginas con tecnología LiveCanvas, con una conveniente vista previa ajax en tiempo real, para que pueda ver inmediatamente cómo se vería la salida del código corto.

Como hay tantos complementos de código abreviado disponibles para WordPress, puede aumentar rápidamente la cantidad de elementos que puede insertar en las páginas personalizadas que crea con LiveCanvas, expandiendo exponencialmente sus opciones creativas.

Un tema complementario fantástico

LiveCanvas viene con un tema de inicio de WordPress complementario recomendado: CustomStrap.

Como garantía de velocidad y confiabilidad, es bueno saber que CustomStrap es un tema hijo de UnderStrap, el tema de inicio más puro y calificado de Bootstrap 4.

CustomStrap tiene un compilador SCSS incorporado para que pueda reconstruir sobre la marcha y personalizar el CSS de Bootstrap para tener su paleta de colores específica y darle un toque de estilo único, todo desde la interfaz del Personalizador de WordPress, sin necesidad de instalar paquetes geek npm en su máquina a través de la línea de comando.

Algunos diseñadores argumentan que los sitios Bootstrap tienen el mismo aspecto. Esto no sucederá con CustomStrap: tiene miles de combinaciones de fuentes, colores y estilos.

CustomIt también permite habilitar la función de tipografía receptiva, algo que es muy útil en el primer mundo móvil de hoy.

Sin embargo, no está atascado con una sola opción. LiveCanvas funcionará con cualquier tema de WordPress basado en Bootstrap 4. Si tiene su propio tema personalizado basado en Bootstrap 4, podrá ejecutar sin problemas el complemento LiveCanvas para crear sus páginas personalizadas.

Sin bloqueo de proveedor

Como se cubrió anteriormente en esta revisión de LiveCanvas, puede acceder y editar fácilmente el HTML y CSS generado por la interfaz visual del editor. Si bien esto le brinda una mayor libertad creativa sobre su página, también tiene otro beneficio.

Como LiveCanvas genera HTML y CSS limpios para el diseño de su página, si deshabilita el complemento, los diseños de su página seguirán funcionando normalmente. Esto significa que no está atrapado en el uso de LiveCanvas de por vida, como es el caso de algunos otros complementos de creación de páginas.

Incluso una vez que el complemento está deshabilitado, aún puede acceder y editar el HTML y CSS de la página para realizar cambios en ellos. Simplemente no podrá realizar los cambios a través de la interfaz de usuario de LiveCanvas o el editor de código, a menos que reactive ese complemento.

Experiencia de usuario del complemento LiveCanvas

Para darle una idea de cómo es el uso de este creador de páginas, esta parte de nuestra revisión de LiveCanvas explorará la experiencia del usuario del complemento.

Como se mencionó, LiveCanvas debería funcionar con cualquier tema de WordPress basado en Bootstrap 4. Sin embargo, el complemento también viene con su propio tema de inicio que puede usar en lugar de un tema de otra fuente.

Independientemente del tema que elija, una vez que el complemento se haya instalado en su sitio, puede ingresar su clave de licencia de LiveCanvas para habilitar las actualizaciones automáticas.

Para comenzar a crear un diseño de página personalizado para su sitio web de WordPress, es simplemente un caso de crear una nueva página desde su panel de WordPress.

El complemento agrega un panel al editor de páginas que le permite activar el editor LiveCanvas para ese contenido.

Habilite el editor LiveCanvas

Habilitar LiveCanvas

Una vez que haya habilitado LiveCanvas para una página en particular, puede comenzar a usar el editor de contenido para crear su diseño personalizado.

Creador de páginas LiveCanvas

Una vez que haya agregado una sección a su página, puede insertar contenido en esa sección. Como LiveCanvas viene con muchas secciones prediseñadas, puede comenzar a construir su página rápidamente.

Secciones de página confeccionadas

LiveCanvas Nueva Sección

Los diferentes elementos que puede agregar a sus páginas están bien organizados, lo que facilita encontrar lo que está buscando. Una vez que haya agregado uno a su página, puede comenzar a personalizarlo a través del editor en vivo.

Edición de texto en línea

Como LiveCanvas tiene edición de texto en línea, puede simplemente hacer clic en un área de texto y comenzar a escribir para agregar su propio contenido.

Edición de texto LiveCanvas

Si desea editar otro tipo de elemento en su página, como una imagen, es igual de fácil. Para hacerlo, haga clic en el elemento y luego los controles para ese elemento se mostrarán en la barra lateral. Luego, puede personalizar ese elemento a través de los controles del panel de la barra lateral.

Editar propiedades de imagen

Vistas de teléfonos inteligentes y tabletas

Mientras trabaja en su página, puede cambiar el tamaño de la ventana gráfica en cualquier momento. Hacerlo le dará una buena idea de cómo se verá su contenido en una variedad de dispositivos. Esto incluye teléfonos inteligentes de pantalla pequeña, tabletas y otras ventanas gráficas preestablecidas.

Viewport móvil

Edición de HTML y CSS

Como se mencionó, una de las características clave de LiveCanvas es el editor de HTML y CSS. Puede cambiar al editor HTML en cualquier momento, simplemente haciendo clic en un elemento de la página, como una fila, y luego haciendo clic en el elemento de menú correspondiente.

Editor HTML

Para evitar confusiones, el editor de HTML solo muestra el HTML del elemento que está editando. Además, tan pronto como realice cambios en el HTML, se aplicará a su página para que pueda ver los resultados de su edición.

Con suerte, eso le dará una idea de cómo funciona este complemento de creación de páginas. Ahora echemos un vistazo a la información de precios.

Información de precios del complemento de WordPress LiveCanvas

LiveCanvas es un complemento premium que está disponible en dos planes de precios:

  • Pro: $ 79 por año para acceder a actualizaciones y soporte durante 1 año.
  • De por vida: $ 199 por acceso de por vida a actualizaciones y soporte.

Independientemente de la opción que elija, puede usar LiveCanvas en tantos sitios web como necesite. Esto incluye cualquier sitio que cree para sus clientes.

LiveCanvas Review Reflexiones finales

LiveCanvas tiene muchas de las mejores características que se encuentran en los complementos de creación de páginas de WordPress más populares. Esto incluye una interfaz moderna de arrastrar y soltar, una buena selección de contenido listo para usar y muchos controles de personalización.

Sin embargo, también tiene un editor de HTML y CSS fácil de usar que le brinda aún más control sobre los diseños de su página.

Por lo tanto, si está buscando un complemento de creación de páginas de WordPress flexible y fácil de desarrollar, LiveCanvas es una excelente opción.

Visite el sitio web de LiveCanvas para obtener más información sobre este complemento de creación de páginas.