How to make Twitter cards without a website

If you’ve seen someone tweet an image that’s a link, you’ve seen a Twitter Card. They’re more eye-catching than just text, and more elegant than a separate link and image. You can use them to format your message nicely with active links to direct your viewer.

There are many guides to Twitter Cards. I especially like this one: https://buffer.com/library/twitter-cards-guide/.​ But they all assume that you need your own website or blog to create them, and that you need to know how to insert some HTML tags in those pages to display in them. (Or get a plugin that does it for you, in some cases.) But sometimes you don’t have a website, or that’s not where you want to drive the traffic. An example is a group promotion on StoryOrigin, where the image and target are supplied on the StoryOrigin site.

There’s a way to create Twitter Cards without any web site at all. I’ll show you how to make links with Google’s Firebase. Firebase is a service for building web and mobile applications, giving you storage and many building blocks for common web tasks, but we’re going to use just one simple part of that service for creating links. You can use that service to make your own short links, a la bit.ly or rebrandly.com. But you can also add the social media links and images to make a Twitter Card.  Here’s how to do it.

First you need a Firebase account and project. Sign up for Firebase at firebase.google.com with any Google account. If you sign up with a Google Domain account, you might need to also set up a Google Cloud project, but as long as you’re just using a free Google account, you won’t have this complication.

Create a project. Name it something like “linker” or “mycards”.  Anything will do. Don’t enable Analytics for the project. If you have an Analytics account and want to add Analytics tracking later, you can come back and do that. Let’s keep it simple for now.

To get Dynamic Links set up:

1. Click on Grow in left margin. There’s a lot of other stuff all over the page; ignore it.
2. Click on Dynamic Links under Grow
3. Click on Get Started
4. If you don’t have your own domain, Google will create a subdomain of page.link for you. e.g. lampworks.page.link. If you want it under your own domain, you’ll need to be able to create address records in DNS to point to firebase. If you know what that means, go for it.​​

Now, to create a dynamic link:

1. Click on New Dynamic Link. This will have several steps, numbered as follows
   1. Create your link. It will fill in the domain you chose, and you can add something meaningful, or just take the short, random suggestion.
   2. Enter the target URL and a description. This is where you want people to go when they click your link. It can be to your Amazon page, your own website, a StoryOrigin promotion. Anything you want.
   3. Behavior for iOS. Skip this. Just click Next.
   4. Behavior for Android. Also skip this.
   5. Campaign tracking, social tags and advanced options (optional). Expand the Social Tags section and fill in the preview image URL, the preview title, and  the preview description.
2. Click Create. You’re done!

Wait, where did we get the preview image URL in step 1.5?
​
There are several sources. If you are participating in a promotion on StoryOrigin, you’ll get a banner URL in your acceptance message. You should use the personal link that you get for the target URL in step 1.2 as well.  If you have an image, you can upload to a blog, or to a MailerLite campaign, or any other service that will serve the image to you. If you want to show the cover of your book, go to your book’s Amazon page, right-click on the cover, and select Open Image in New Tab. Once the new tab opens, grab the URL from the browser’s address bar. Other storage services are hit-and-miss. Box will give you a direct link to an image file, for instance, but Google Photos will not.
​
The other thing to be careful of is the image’s size ratio. The ideal Twitter image is twice as wide as it is tall (a ratio of 2:1). If it’s too wide or too tall, Twitter is likely to clip the image so people can’t see the entire thing without clicking on it (which will lose you half your audience right there). You can find services on the web that will pad an image to a specified ratio, or you can open it in Photoshop or other photo editor and resize the canvas.

I hope this has been a help to you.