OneShark
Improve how your content looks like on the web
Improve how your brand image is perceived on Facebook, Twitter, LinkedIn or WhatsApp* with this simple OpenGraph Image Generator
* it works on any social media that uses Open Graph data
No code / server required.- HTML
- Wordpress
- Shopify
<!DOCTYPE html>
<html>
<head>
<link rel="icon" type="image/png" href="/favicon.png">
<title>How does OneShark work?</title>
<meta property="og:image" content="https://img.oneshark.co/aHR0cHM6Ly9vbmVzaGFyay5jby9ob3ctZG9lcy1vbmUtc2hhcmstd29ya3M=.png"/>
<meta name="oneshark:bg" content="https://yourwebsite.com/images/mountains.jpg" >
...
</head>
<body>
<h1>How does OneShark work?</h1>
<p>
You simply need to add this special "og:image" meta tag that will
request the image to OneShark.
The content of this meta tag must be
"https://img.oneshark.co/" + the current url in Base64 + ".png"
</p>
<p>
Now, you can sign in to https://app.oneshark.co and define a custom
logo, colors and the default background image. Anyway, you can set
a specific image as background using the "oneshark:bg" meta tag.
</p>
</body>
</html><!DOCTYPE html>
<html>
<head>
<!-- COPY THE LINE BELOW AND INSERT IT INSIDE THE <head> -->
<meta property="og:image" content="https://img.oneshark.co/<?php global $wp; echo base64_encode( home_url( $wp->request ) ) ?>.png"/>
</head>
<body>
...
</body>
</html><!DOCTYPE html>
<html>
<head>
<!-- COPY THE LINE BELOW AND INSERT IT INSIDE THE <head> -->
<meta property="og:image" content="https://img.oneshark.co/{{ request.path | base64_encode}}.png"/>
</head>
<body>
...
</body>
</html>
How does OneShark work?
You simply need to add this special "og:image" meta tag that will
request the image to OneShark...
oneshark.co
This is how your your page will look like when shared on Twitter