---json
{
    "description": "Sharing a link from a ComboStrap page will show on every twitter a card thanks to the social metadata",
    "page_id": "oew9mriffn0e3i9fjczms",
    "title": "Twitter card enabled"
}
---
====== ComboStrap Page Metadata - Twitter Card ======


===== About =====
''ComboStrap'' page will render automatically as a [[https://developer.twitter.com/en/docs/twitter-for-websites/cards/overview/summary-card-with-large-image|summary card in a tweet]].


You can optionally add your twitter handle in the cards if [[#configuration|configured]].



<note>
This is page is about the integration of your page as card in twitter. If you want the inverse and embed a tweet in your page, see the [[docs:social:tweet|tweet page]]
</note>

===== Preview =====

You can preview a card page before tweeting it at: https://cards-dev.twitter.com/validator

<box elevation="high" align="center" width="fit-content">
{{docs:semantic:twitter_card_preview.png|}}
</box>

\\

===== List of metadata =====

The list of metadata that are used in the card are:
  * for the heading: [[..:page:title|title]] if present otherwise [[..:page:h1|h1]], otherwise the page id.
  * for the description: [[..:page:description|description]]
  * for the ''twitter image'' sets in the [[:docs:metadata:manager|metadata manager]]
      
===== Image =====

You can see the Twitter image used via the [[:docs:metadata:manager|metadata manager]].

{{:docs:social:twitter_image_metadata_manager.png|}}

If the value is gray, this is the [[#default image|default image value]].

Twitter supports raster images with a size of less than 5MB and SVG are not supported (([[https://developer.twitter.com/en/docs/twitter-for-websites/cards/overview/markup|Card Twitter Reference Documentation]]

===== Default Image =====

The default image is chosen via this algorithm:
  * The Twitter image of the page if set
  * The [[:docs:page:featured-image|featured raster image]] if found
  * The [[:docs:page:first-image|first image]] of the page if set
  * The Twitter image of the [[:docs:page:system:system|parent page]] if found
  * The [[:docs:page:featured-image|featured raster image]] of the [[:docs:page:system:system|parent page]] if found
  * The [[:docs:page:first-image|first image]] of the [[:docs:page:system:system|parent page]] if found
  * until the [[:docs:page:system:home|website home page]]



===== Configuration =====

You can set the following [[docs:app:configuration|configuration]]:

^ Name ^ Description ^ Default value ^
| ''twitterSiteHandle'' | the handle name of your twitter account (Example: @combostraweb) | None |
| ''twitterSiteId'' | the twitter id of your twitter account ([[google>twitter id|Search on Google]]) | None |