flayyer.io

Og:Image as a Service

Crea plantillas con React.js y Vue.js. Sube tus increíbles diseños a nuestra nube y úsalas para renderizar miles de imágenes.

Comienza
import { FlayyerIO } from "@flayyer/flayyer";
const flayyer = new FlayyerIO({
tenant: "flayyer",
deck: "demo",
template: "main",
variables: { title: "Atrae más personas a tu sitio" }
});
<meta property="og:image" content="{flayyer.href()}" />
<meta name="twitter:image" content="{flayyer.href()}" />
Esta imagen fue creada usando Flayyer.ioCambia la <meta property="og:image" /> de tu sitio por un link de Flayyer. Revisa nuestras guías de integración.flayyer.com
https://flayyer.com/es/io/demo
import React from "react"
import { TemplateProps } from "@flayyer/flayyer-types";
import clsx from "clsx";
import "../styles/tailwind.css";
import logo from "../static/logo.svg";
// https://flayyer.io/v2/flayyer/demo/main.jpeg?title=Create+more+engagement
type Variables = { title: string, img?: string };
export default function MainTemplate({ agent, variables }: TemplateProps<Variables>) {
const { title, img = "https://images.unsplash.com/photo-1601933552240-d6b9e8e01cdc?w=1200" } = variables;
if (agent.name === FlayyerAgentName.WHATSAPP) {
return (
<Layer className="bg-gray-800 p-20">
<img src={logo} className="w-full h-full" />
</Layer>
);
}
return (
<div>
<Layer>
<img className="w-full h-full object-cover object-bottom" src={img} />
</Layer>
<Layer className="bg-gradient-to-r from-gray-900 opacity-70 mr-96" />
<Layer className="flex flex-col justify-center items-start px-12 py-12 w-1/2">
<img src={logo} className="w-24 h-24" />
<h1 className="text-8xl text-white tracking-tight font-semibold">
{title}
</h1>
</Layer>
</div>
);
}
function Layer({ className, ...props }: React.ComponentProps<"div">) {
return <div {...props} className={clsx("absolute inset-0", className)} />;
}

JavaScript

Usa nuestro formateador universal de URL @flayyer/flayyer-js para integrarnos a cualquier framework.

Express.js

Podemos ser integrados a cualquier framework Connect.js o Fastify. Cada view engine es compatible.

Gatsby

Gatsby.js

Amamos JAMStack, y por supuesto soportamos Gatsby. Echa un vistazo a nuestra guía.

next-black

Next.js

Flayyer fue tremendamente inspirado por este framework, nuestro sitio está desarrollado con Next.js

Python

Creamos un paquete pip flayyer para que no tengas que lidiar con la codificación URL. Independiente del framework.

Django

Hemos utilizado este framework por muchos años. Armamos especialmente una guía y un ejemplo para amantes de Django.

Ruby

Nuestra gema oficial flayyer ya está disponible y lista para ser instalada. Independiente del framework.

Ruby on Rails

Potencia tu app de Rails con Flayyer. Estamos desarrollando una gema para hacer esto más automático.

Official PHP Logo

PHP

Muchos nos pidieron un plugin para Wordpress, por eso creamos esta librería independiente de PHP con Composer: flayyer/flayyer

Wordpress

Para tu blog, e-commerce, portafolio, o cualquier tipo de sitio web que desees. Revisa flayyer/flayyer-wp

Developer Experience y sin configuraciones

We strongly believe in providing the best developer tools to help you maximize productivity.

Deploy automático con GitHub Actions

Automatiza tu flujo de trabajo con GitHub Actions en menos de 5 minutos

Configura ahora

Un servicio distribuido globalmente mediante edge technology

Te garantizamos la mejor experiencia de usuario ofreciendo respuestas rápidas gracias a nuestro sistema global de caché.

PlanetPlanet avatar 01Planet avatar 02

Plantillas creadas

499+

Imágenes generadas

262,824+

Datos descargados

19.8GB+

Disponibilidad

99.95%

Precios y planes

Todos los planes cuentan con créditos renovables, acceso a nuestro dashboard y la posibilidad de crear ilimitados proyectos.

Gratuito

Sin compromiso prueba Flayyer, gratis y sin tarjeta de crédito.

Gratis

Crear cuenta
  • 300 imágenes/mes

  • Proyectos ilimitados

  • 1 usuario

  • URLs con firma digital

Hobby

Para pequeños proyectos con pocas páginas

$8/mes

Obtenlo por $6.58 usando pago anual

Seleccionar plan
  • 5.000 imágenes/mes

  • Proyectos ilimitados

  • 1 usuario

  • URLs con firma digital

  • Analytics

Pro

Gran volumen para compañías con mucho contenido para compartir.

$55/mes

Obtenlo por $41.58 usando pago anual

Seleccionar plan
  • 60.000 imágenes/mes

  • Proyectos ilimitados

  • 5 usuarios

  • Todo del plan Hobby

  • Imágenes Full HD

Escala

Masiva cantidad de imágenes para sitios web populares y virales.

$233/mes

Obtenlo por $166.58 usando pago anual

Seleccionar plan
  • 320.000 imágenes/mes

  • Proyectos ilimitados

  • Usuarios ilimitados

  • Todo del plan Hobby

  • Imágenes Full HD

  • Soporte prioritario

Precios en dólares estadounidenses. Podrían ser convertidos automáticamente a tu moneda local al pagar

Planes empresariales con soporte premium

Soluciones personalizadas, servers dedicados, instalación local, servicios de diseño y desarrollo.

Servicio prioritario

Si estás lidiando con alto tráfico o simplemente no quieres preocuparte de cuotas, este plan puede ser para ti. También incluímos servidores dedicados para mayor seguridad y menores tiempos de entrega.

Se puede incluir

  • Imágenes ilimitadas

  • Servers dedicados

  • Consultoría de diseño e ingeniería

  • Mayor velocidad, seguridad y privacidad

  • Configuración local

  • Canal de Slack compartido con los fundadores del proyecto.

Potencia tu marketing

Hablemos

El 90% de las compañías descuidan sus vistas previas

Empresas invierten miles de dólares en campañas publicitarias pero muchas personas las ignoran.
Cuando los usuarios comparten tus links hay una mayor probabilidad de que obtengas visitas. ¡No pierdas esa oportunidad!

gallery
gallery
gallery
gallery
gallery
gallery