I keep getting an error message of "Invalid Card Type"


#1

I have the correct meta tags on my new page for a Summary Large Image card, however when i try to validate it to get it approved the Validation Tool shows an error message “Invalid Card Type.” Why is this happening and what can I do to correct it?

Here is my site page: http://esto.ustravel.org/roadtrip

Here is my Meta Tags:

Thanks!


#2

Your tags look good to me. Could you provide a URL on your site where the tags are being used so I can investigate further?


#3

Thank you for getting back so quickly! The page we have the twitter card assigned is here: http://esto.ustravel.org/roadtrip . Let me know if you need anything else!


#4

The tags you provided above do not seem to be in the HTML of http://esto.ustravel.org/roadtrip. If you add these to the head section of the page and “validate & apply” via the validator (URL below), your card should show up within a tweet containing that URL. If you have any questions about this process, please let me know.

https://dev.twitter.com/docs/cards/validation/validator


#5

I don’t know why my responses are not getting through. I have looked in the code for the page I gave you the URL to. The tags are present for the Twitter Card but they are about halfway down in the middle of other tags in the head section. Does the order the Twitter Tags are entered matter? Do they have to be first? Thank you!


#6

Interesting. Perhaps dynamic content is to blame. Do you have different head sections for different browsers? I do not see any tags in Chrome, Firefox, or Safari. Here’s what the head section looks like for me:

<meta charset="utf-8" />
<meta name="viewport" content="width=device-width" />
<meta content="ie=edge, chrome=1" http-equiv="x-ua-compatible" />
<meta http-equiv="ImageToolbar" content="false" />
<link href="/sites/default/humans.txt" rel="author" type="text/plain" />
<meta content="ESTO Roadtrip" about="/roadtrip" property="dc:title" />
<meta name="Generator" content="Drupal 7 (http://drupal.org)" />
<link rel="canonical" href="/roadtrip" />
<link rel="shortlink" href="/node/38921" />
<link rel="shortcut icon" href="http://esto.ustravel.org/sites/default/files/favicon.png" type="image/png" />
  <title>ESTO Roadtrip | U.S. Travel&#039;s ESTO</title>
    <link type="text/css" rel="stylesheet" href="http://esto.ustravel.org/sites/default/files/css/css_pbm0lsQQJ7A7WCCIMgxLho6mI_kBNgznNUWmTWcnfoE.css" media="all" />
<link type="text/css" rel="stylesheet" href="http://esto.ustravel.org/sites/default/files/css/css_5YnzYptfw6AyFJCfiMvXi3wsitX-d6Yj05eXXVGwQyM.css" media="all" />
<link type="text/css" rel="stylesheet" href="http://esto.ustravel.org/sites/default/files/css/css_XMFo2T_1rOf9OUq8F3QPAokXIb-2mdu7JREAft_WTI0.css" media="all" />
<link type="text/css" rel="stylesheet" href="http://esto.ustravel.org/sites/default/files/css/css_yn7VJt9DrrRBiBrPsHlxvb7jjHo_imd4NJ3AKt8s6DY.css" media="all" />

<!--[if lt IE 10]>
<link type="text/css" rel="stylesheet" href="http://esto.ustravel.org/sites/default/files/css/css_pxYvsFkRoJVgy0nKHMw8FKVSNwfo5bsvhRvAZlELU8g.css" media="all" />
<![endif]-->
<link type="text/css" rel="stylesheet" href="http://esto.ustravel.org/sites/default/files/css/css_T4WceabJybZDMANdlfnO3O7iJsSwbjodO4gtldONB0g.css" media="all" />
<link type="text/css" rel="stylesheet" href="http://esto.ustravel.org/sites/default/files/css/css_ODqKEzH826jdGEZV3HsTCm2mmEFBI_ycUiAEygaBQRc.css" media="all" />

    <!--[if lt IE 9]>
		<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
        <link href="/sites/default/themes/esto/stylesheets/ie.css" media="screen, projection" rel="stylesheet" type="text/css"/>
	<![endif]-->
<link type="text/css" rel="stylesheet" media="print" href="/sites/default/themes/esto/stylesheets/print.css" />

#7

When I view the page in Chome I am able to see the tags present. From your code above the Twitter Card tags are the next tag under the #27 link tag.

I am confused as to why you are not able to see these tags.


#8

Code didn’t show above so here is what I was trying to show you…


#9

It look like you’re using Drupal. Are the tags surrounded by any conditional logic in the template? And are you adding these manually or using a module of some kind to add them?


#10

So it looks like the tags are showing in the “inspect element” tool but not in the “view page source” tool. What is the difference in these and how can I assign the tags so that they are in the page source? Thanks!


#11

I’m seeing that as well. That fact that we’re seeing the tags in the inspector and not in the page source tells me that the tags are written to the page via JavaScript after loading. A crawler usually doesn’t run client side scripts and that’s why we cannot see the tags.

You’ll need to dynamically create these tags on the server side like the rest of the page’s content. Similar to how the title tag is being defined.


#12

@jbulava thank you so much for working with me on this. I was finally able to correct the coding of the page and the meta tags are now visible and the card is approved! thank you again!


#13

You’re welcome! Glad to hear you have cards up and running.


#14

Hi @jbulava, I am back again. I have a question about my twitter card. We have it assigned to the esto.ustravel.org/roadtrip page on our site, however any time we tweet out anything with the esto.ustravel.org domain the twitter card is displayed. Is there a way to correct this so that the only time the Card is displayed in a tweet is when it is related to the roadtrip page? Thank you.


#15

Hello @jbulava !
My site has tags but not approved. Any problem?
Thank you very much.

Site: http://www.sportivobarracas.com.ar/
Example: http://www.sportivobarracas.com.ar/article/finalizo-la-pretemporada-de-sportivo-barracas/97/


#16

Cards will be used for any page where you included meta tags. If you do not want a card to be used, simply do not include tags on that page. If you are using templates, you may have to create a template just for the roadtrip page that includes the tags and leave them out of the other(s) used elsewhere on the site.