How can I implement Twitter Cards code on my landing page?

Twitter Cards are tweets to which you can attach rich photos, videos, and media experiences to drive traffic to your landing page.

In order to do this, before you share your landing page on Twitter, you will need to add a code generated by Twitter for the type of card you want.

So, to start, you will first need to visit the Twitter Cards Overview page here: At the bottom of the page, you will find the "Get Started in 4 simple steps" section.

Start with step 1 and choose the type of card you will need. You will see that you have 4 types of cards from which to choose as seen here:

For this tutorial, we will go with the first option - Summary Card as shown here:

On the summary card page you will have to scroll down the page a bit and copy the code from the section "Sample Code":

This code you will need to add to your Instapage landing page under HTML/CSS > Head.


Now you will need to change the content from the code with your own content.Screenshot_on_2023-04-20_at_16-35-09.png

You can find more about the type of content you need to add under the subtitle "Reference".

To add the image URL you can also use a Dropbox share link but make sure you replace the "www." in the link with "dl.".

Run the URL through the validator tool to test. The validator can be accessed here: If you are working with a Player Card, request approval for whitelisting. All other Cards do not need whitelisting.Screen_Shot_2023-03-08_at_20.56.05.png

After testing in the validator or approval of your Player Card, Tweet the URL and see the Card appear below your Tweet in the details view.