We are getting ready for launching 😄

DevelopersFlyyer.io API

Improve your links on social media

Flyyer is an Og:Image as a Service for managing and generating responsive link previews. Boost your organic marketing strategy today.

<meta
property="og:image"
// one-line integration 👇 just replace id and path
content="//cdn.flyyer.io/v2/:id/_/_/:path*"
/>
Houm.com logo
Global-crowd.com logo
Platanus Ventures logo
Spikeball.cl logo
QueAFP.cl logo

Have you ever built something amazing

Example of bad link previews on social media

...but it looks terrible on social media?

Not everyone uses a CMS to manage their meta-tags, but even the most popular platforms fails to deliver engaging links.

Flyyer to improve your links

That's why we created Flyyer so you can share with confidence

Manage and preview your whole website

With Flyyer you can import and synchronize your website in just a couple of minutes and keep your original URL.

1

Sync your website

Let our crawler scan your website to find your pages, style and assets.
2

Use Flyyer CDN for og:image

It takes a single line of code to integrate Flyyer CDN. We also have guides and plugins.
3

Setup rules and images

Handle single pages or by groups using Express.js syntax.
4

Done!

Manage your previews from our dashboard.
Showing how previously the link previews were bad on an cellphone and how much they improved with Flyyer
Dashboard of Flyyer to manage link previews

Build trust and engagement

The internet is a wild an enormous sea of information, you need to stand out from the rest.

CTR 57.6%

Increase your Click-Through Rate by improving your links.

Showing how previously the link previews were bad on an cellphone and how much they improved with Flyyer

Coming soon!

Flyy.ly branded short links

Next generation URL shortener that your audience can trust.

With Flyyer CDN for og:images you keep your original domain, but we are working a new service for those users who want to re-brand links outside their webpage.

Get better insights

Understand how people share your website

Which social network?

Most analytics services can only start tracking when the user visits your website. Flyyer is one step ahead.

Which pages are more popular?

Sales are different than traffic. Understand customer behavior around each product or post.

My post is going viral!

Get alerts when an item is being shared frequently. Act fast!

women studying their website share analytics

Try our free online tool to preview your website

Find out how your links look like before even posting them on social media.

Open LinkPreview.io

Flyyer Render

JavaScript-to-Image

Create templates with React.js and Vue.js. Upload your amazingly crafted flyyers to our cloud and use them to render thousand of images.

Get started
import { FlyyerRender } from "@flyyer/flyyer";
const flyyer = new FlyyerRender({
tenant: "flyyer",
deck: "charming-man",
template: "main",
variables: { title: "Create more engagement" },
});
<meta property="og:image" content={flyyer.href()} />
<meta name="twitter:image" content={flyyer.href()} />
import React from "react"
import { Variable as V, Static } from '@flyyer/variables';
import { TemplateProps } from "@flyyer/types";
import clsx from "clsx";
import "../styles/tailwind.css";
import logo from "../static/logo.svg";
// Export 'schema' to declare variables
export const schema = V.Object({
title: V.String({ default: "This is a variable" }),
img: V.Image({ default: "/background.jpeg" }),
});
type Variables = Static<typeof schema>;
// https://cdn.flyyer.io/r/v2/flyyer/charming-man/main.jpeg?title=Create+more+engagement
export default function MainTemplate({ variables, width, height, agent }: TemplateProps<Variables>) {
// Get parsed variables from querystring
const { title, img } = variables;
// Render component to image based on context
if (agent.name === FlyyerAgentName.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)} />;
}

Create public and private templates today.

Use your favorite web technologies such as React, Vue and Tailwind to create templates for your own projects or share them with the community.

$ npm init flyyer-app@latest hello
? Select template setup:
react
react-styled-components
react-typescript-styled-components
react-typescript-tailwind
vue
vue-typescript
$ NODE_ENV=production npm run-script build
🌠 flyyer project successfully built!
$ npm run-script deploy
🖼 Created template with URL:
- https://cdn.flyyer.io/render/v2/flyyer/hello/main.png?title=Hello+World

JavaScript

Use our universal URL formatter @flyyer/flyyer-js to integrate with any framework.

Express.js

Any Connect.js or Fastify framework can be integrated. Every view engine is supported too.

Gatsby

Gatsby.js

We love JAMStack and of course Gatsby is supported. Checkout our guide.

next-black

Next.js

Flyyer was heavily inspired by this framework, even this site is built with Next.js

Python

We created a pip package flyyer so you don't have to deal with URL encoding. Framework agnostic.

Django

I have been using this framework for many years. I personally crafted a guide and example for Django lovers.

Ruby

Our official gem flyyer is available and ready to be installed. Framework agnostic.

Ruby on Rails

Superpower your Rails app with Flyyer. We are building a gem to make this more automatic.

Official PHP Logo

PHP

Many people asked for a Wordpress plugin so we created this agnostic PHP library with Composer: flyyer/flyyer

Wordpress

For your blog, e-commerce, portafolio, or any type of website you have! Checkout flyyer/flyyer-wp

Globally distributed service with edge technology

Ensures the best experience for users by delivering fast responses when a link is shared thanks to our global caching system.

PlanetPlanet avatar 01Planet avatar 02

Templates created

847+

Images delivered

630,976+

Data served

50.5GB+

Availability

99.95%

Pricing and plans

Get started for free. Every plan comes with renewable credits, access to our dashboard and free templates.

Free Tier

For small websites. No strings attached, try Flyyer for free.

Free

No credit card required

Create account
  • 20 website pages

  • 300 credits/mo

  • 3 website(s)

  • 1 user(s)

  • Signed URLs

Hobby

For small project with few amount of pages to share.

$12/mo

Get 2 months for free with anual billing

Select plan
  • 200 website pages

  • 3,000 credits/mo

  • 3 website(s)

  • 3 user(s)

  • Signed URLs

  • Analytics

Pro

High volume for companies with many projects and websites to share.

$36/mo

Get 2 months for free with anual billing

Select plan
  • 1,000 website pages

  • 10,000 credits/mo

  • 3 website(s)

  • 5 user(s)

  • Everything in Hobby

  • Full HD images

Scale

Massive amount of images for popular and viral websites.

$72/mo

Get 2 months for free with anual billing

Select plan
  • 3,000 website pages

  • 30,000 credits/mo

  • 3 website(s)

  • Unlimited user(s)

  • Everything in Pro

  • Priority support

A credit is a metric used to quantify the number of generated images and website crawls we use to gather information. On normal conditions 8 credits are consume by 1 page each month.

Subsequent requests for the same image or resource within the same month won't affect your plan's quota.

Enterprise plans with premium support

Custom solutions, dedicated servers, on-premise installation, and design/development services.

Priority service

If you are dealing with high traffic or you just don't want to worry about quotas, this plan might be for you. We also include dedicated service for additional security and faster delivery times.

What can be included

  • Unlimited images

  • Dedicated servers

  • Design and engineering consulting

  • Improved speed, security and privacy

  • On-premise setup

  • Shared Slack channel with the founding team

Superpower your marketing

Contact us

90% of companies neglect their previews

Businesses spend thousands of dollars on advertisements but people keep ignoring them.
When users share your links, there is a higher chance of getting clicks. Don't miss that opportunity.

gallery item showing an example of Flyyer
gallery item showing an example of Flyyer
gallery item showing an example of Flyyer
gallery item showing an example of Flyyer
gallery item showing an example of Flyyer
gallery item showing an example of Flyyer

The people behind Flyyer.io

This project is brought to you by only two engineers from Santiago, Chile 🇨🇱

  • Profile picture

    Patricio López J.

    Co-Founder / Tech and everything

  • Profile picture

    Franco Mendez Z.

    Co-Founder / Tech and everything

  • Official Discord logo

    Official Discord

    Join our channel

  • Official Telegram logo

    Official Telegram

    Join our group