Weibo meta tag

Weibo Meta Tags

Weibo Meta Tags, Weibo Meta Tags, support and support conventional meta tags under the Open graph protocol. Compatible, and based on national conditions, limited extension marking of object types or attributes that OpenGraph is not applicable to. Can be used with OpenGraph.

Why configure Weibo Meta Tags?

Traditional Internet information units are often indexed and circulated based on Web Pages and URLs as clues. By defining Weibo Meta Tags, you can penetrate Web Pages, accurately index Objects on the Internet, and format and manage content on the Internet. With formatted Object data, you can provide users with a flexible, scalable, and easy-to-read content display module.

How to define the object type? What object types does the like component support?

First of all, you need to define the object type of this web page based on the content expressed by the web page.

##1. Definition method:

In the <head> tag of your website page, add the <meta> tag

HTML

#<meta property="og:type" content="Object type" />
## or 

##<meta name="weibo:type" content="Object type" /> ;

#After defining the object type, define the detailed attribute information of the object by querying the object attribute table. 

2. The object types supported by the like component are as follows:

Webpage (webpage), article (article), audio (audio), picture (image), person (person), place (place), product (product), video (video), book (book), game (game), application (app)

How to define Weibo Meta Tags

Find the object type suitable for your web page, query and set the attribute value through the object attribute table, the detailed settings will To bring better results, just put the code into the head. Two deployment examples are listed below for explanation

1. Video object Meta code example:

Place the following <meta> tag in the <head> tag of the web page.

HTML

//Required
<meta property="og:type" content="video" />
<meta property="og:url" content="http://video.sina.com.cn/v/b/93544804-2282043583.html" />
<meta property="og:title" content="Weibo UDC Christmas and New Year video first released" />
<meta property="og:description" content="[Weibo UDC Christmas and New Year video first released! - Weibo belt You share the micro happiness!] There are only a few hours left, Christmas is coming! How are you going to spend the first Christmas after the apocalypse? I want new tricks in 2012!!!~Hurry up and make a Christmas pinhole camera !! Share the little happiness with the person closest to you!!!" />
//Optional
<meta property="og:image" content="http://ww2. sinaimg.cn/bmiddle/880538bfjw1e04w8ktfakj.jpg " />
<meta name="weibo:video:embed_code" content="http://you.video.sina.com.cn/api/sinawebApi/outplayrefer .php/vid=93544804_2282043583_OB21THcwCDTK l1lHz2stqkP7KQNt6nni2K2u1anIAZaQ0/XM5GQYdgD5CHWBNkEqDhATZs6cfou1xk/s.swf" />
<meta name="weibo:video:stream" content="" />
<meta name="weibo: video:duration" content="47" />
<meta name="weibo:video:create_at" content="2012-12-24 16:26:05" />
<meta name="weibo:video:update_at" content="2012-12-24 16:26:05" />

The above code uses OpenGraph and Weibo Meta Tags hybrid mode, Weibo Meta Tags currently supports five OpenGraph basic attributes, namely:

##HTML

<meta property="og:type" content="Type" /><meta property="og:url" content="URL address" />
<meta property= "og:title" content="Title" />
<meta property="og:image" content="Picture" />
<meta property="og:description" content=" Description" />

The above OG attributes can be directly interoperated with Weibo Meta Tags attributes. An example of completely using Weibo Meta Tag code format is as follows:

HTML

//Required 
<meta name ="weibo:type" content="video" />
<meta name ="weibo:video:url" content="URL address of the video" />
< meta name ="weibo:video:title" content="Display name of the video" />
<meta name ="weibo:video:description" content="Text description of the video" />
 //Optional
<meta name="weibo:video:image" content="Thumbnail display image of the video" />
<meta name="weibo:video:embed_code" content=" Embed code for video playback" />
<meta name="weibo:video:duration" content="Duration of video playback in seconds" />
<meta name="weibo:video :stream" content="Link source of video stream" />
<meta name="weibo:video:create_at" content="User's creation time" />
<meta name=" weibo:video:update_at" content="User's update time" />

##2. Web page object Meta code Example:

Place the following <meta> tag in the <head> tag of the web page.

HTML

//Required
<meta property="og:type" content="webpage" />
<meta property="og:url" content="http:/ /sports.sina.com.cn/nba/2012-12-26/06576353009.shtml" />
<meta property="og:title" content="Christmas game total scoring champion! Kobe Bryant 34 5 writes Historical violent statistics No. 2 in 16 years" />
<meta property="og:description" content="Kobe Bryant unexpectedly scored 34 points and became the scoring leader in the history of the Christmas game. Not only that, the 34-year-old god has scored 30 points in 9 consecutive games, creating the second best score in his career and continuing to move towards the feat of 16 consecutive games in 2003!" />
//Optional
<meta property="og:image" content="http://i2.sinaimg.cn/ty/nba/2012-12-26/U4934P6T12D6353009F1286DT20121226070232.jpg" />
<meta name=" weibo:webpage:create_at" content="2012-12-26 06:57:00" />
<meta name="weibo:webpage:update_at" content="2012-12-26 06:57: 00" />

##Strict definition and non-strict definition

There are two formats A and B below, where A is a strict definition and B It is a non-strict definition, the difference is that the middle section can be omitted in the non-strict definition.

HTML

##weibo:video: embed_code

##B

HTML

##weibo:embed_code

#When the type object type is clearly defined, non-strict definition can be used, and all attributes will be recognized as the currently defined type; otherwise they will not be recognized. Strict definition is recommended. 

Multi-valued definition of a single attribute

The multi-valued definition of a single attribute is an object attribute (i.e. Mark) can be assigned multiple different values at the same time, and the attribute values are displayed in order according to the needs of the presentation layer product.

Method: Each line defines an attribute, which requires meta tags. The same attributes and different assignments are defined line by line in order.

Example:

HTML

The image attribute defines multiple values, that is, multiple pictures
<meta property="og:image" content="Example picture 1" />
<meta property="og:image" content="Example image 2 " />
<meta property="og:image" content="Example image 3" />
< meta name="weibo:webpage: image" content="Picture example 4" />
<meta name="weibo:webpage: image" content="Picture example 5" />

Note 1: Currently this method is only open to the image attribute of all object types, and other attributes are not supported yet.

Note 2: The image attribute multi-value definition can currently be used to share window preset images.

Object detailed attribute table

Comparison table of attributes contained under each type of object (object) ：

Webpage

image attribute defines multiple values , that is, multiple pictures
<meta property="og:image" content="Example picture 1" />
<meta property="og:image" content="Example picture 2" /> ;
<meta property="og:image" content="Example picture 3" />
<meta name="weibo:webpage: image" content="Picture example 4" />
<meta name="weibo:webpage: image" content="Picture example 5" />

# #Code example:

HTML

##//Required<meta property="og:type" content="webpage" />
<meta property="og :url" content="Web page unique URL address" />
<meta property="og:title" content="Web page title" />
<meta property="og:description" content ="Web page description" />
//Optional
<meta property="og:image" content="Web page display image" />
<meta name="weibo: webpage:create_at" content="Webpage creation time" />
<meta name="weibo:webpage:update_at" content="Webpage update time" />

Article

Code example:

QQ截图20170210150706.png

HTML

##//Required<meta property="og:type" content="article" />< ;meta property="og:url" content="URL address of the article" />
<meta property="og:title" content="Display name title of the article" />
< meta property="og:description" content="Text description of the article" />
//Optional
<meta property="og:image" content="Display image of the article" /> 
<meta name="weibo: article:create_at" content="Article creation time" />
<meta name="weibo: article:update_at" content="Article update time" / >

##Audio

QQ截图20170210151254.png ##Code example:

HTML

##//Required<meta property="og:type" content="audio" />
<meta property="og :url" content="Audio landing page URL address" />
<meta property="og:title" content="Audio display name" />
<meta property="og :description" content="Text description of the audio" />
//Optional
<meta property="og:image" content="Display image of the audio" />
< meta name="weibo:audio:embed_code" content="HTML embed code for audio playback" />
<meta name="weibo:audio:stream" content="Link source for audio stream" /> 
<meta name="weibo:audio:duration" content="Audio playback duration, seconds" />
<meta name="weibo:audio:create_at" content="Audio creation time " />
<meta name="weibo:audio:update_at" content="Audio update time" />

##Video (video)

QQ截图20170210151237.png ## Code example:

HTML

//Required
<meta property="og:type" content="video" />
<meta property="og:url" content="URL of the video Address" />
<meta property="og:title" content="Display name of the video" />
<meta property="og:description" content="Text description of the video" />
//Optional
<meta property="og:image" content="Display image of the video" />
<meta name="weibo:video:embed_code" content ="HTML embed code for video playback" />
<meta name="weibo:video:stream" content="Link source for video stream" />
<meta name="weibo: video:duration" content="The duration of the video playback, seconds" />
<meta name="weibo:video:create_at" content="The creation time of the video" />
<meta name ="weibo:video:update_at" content="Video update time" />

#Picture (image)

QQ截图20170210151222.png

Code example:

##HTML

Note: The og:image parameter corresponds to weibo:image:image (thumbnail) and weibo:image:full_image (original large image). If you need to distinguish between thumbnails and original large images, please set weibo:image:image respectively. and weibo:image:full_image, the weibo tag will overwrite the og tag.

person

QQ截图20170210151209.png

##Code example:

HTML

//Required<meta property="og:type" content="image" />
<meta property="og:url" content="URL address of the image" />
<meta property="og:title" content="Image Display title" />
<meta property="og:description" content="Text description of the image" />
//Optional
<meta property="og:image" content="Thumbnail display of the image" />
<meta property="weibo:image:full_image" content="Original large image of the image" />
<meta name="weibo :image:create_at" content="Image creation time" />
<meta name="weibo:image:update_at" content="Image update time" />

Place

QQ截图20170210151157.png

Code example:

HTML

##//Required<meta property="og:type" content="place" />
<meta property="og :url" content="URL address of the geographical location" />
<meta property="og:title" content="Display name of the geographical location" />
<meta property="weibo :place:position" content="Coordinates of geographical location, latitude, longitude and altitude, in compliance with ISO6709" />

## Product (product)

QQ截图20170210151144.png

Code example:

HTML

##//Required<meta property="og:type" content="product" /><meta property= "og:url" content="URL address of the product" /><meta property="og:title" content="Display name title of the product" />
<meta property=" og:description" content="Text description of the product" />
//Optional
<meta property="og:image" content="Thumbnail image of the product" />
<meta name="weibo:product:full_image" content="The original large image of the product" />
<meta name="weibo:product:create_at" content="The creation time of the product" /> ;
<meta name="weibo:product:update_at" content="Product update time" />


Description: og:image The parameters correspond to weibo:product:image (thumbnail) and weibo:product:full_image (original large image). If you need to distinguish the thumbnail and the original large image, please set weibo:product:image and weibo:product:full_image respectively, weibo The tag will overwrite the og tag. 

book

QQ截图20170210151132.png

Code example:

##HTML

//Required<meta property="og:type" content="book" />
<meta property="og:url" content ="URL address of the book" />
<meta property="og:title" content="Display name of the book" />
<meta property="og:description" content=" Text description of the book" />
//Optional
<meta property="og:image" content="Display image of the book" />
<meta name="weibo: book:isbn" content="The 10 or 13-digit ISBN number of the book" />
<meta name="weibo:video:create_at" content="The publication date of the book" />
 

##Game

QQ截图20170210151120.png ##Code example:

HTML

##//Required<meta property="og:type" content="game" />
<meta property="og :url" content="URL address of the game" />
<meta property="og:title" content="Display name title of the game" />
<meta property="og: description" content="Text description of the game" />
//Optional
<meta property="og:image" content="Thumbnail display of the game" />
< ;meta name="weibo:game:image" content="The original big picture of the game" />
<meta name="weibo:game:full_image" content="The original big picture of the game" /> 
<meta name="weibo:game:create_at" content="Game creation time" />

##Description: og:image parameter Corresponds to weibo:game:image (thumbnail) and weibo:game:full_image (original large image). If you need to distinguish the thumbnail and the original large image, please set weibo:game:image and weibo:game:full_image respectively, weibo tag Will overwrite the og tag.

Application (app)

QQ截图20170210151106.png ##Code example:

HTML

//Required

← Website access

common problem →

submit

Weibo meta tag

Weibo Meta Tags

How to define the object type? What object types does the like component support?

Find the object type suitable for your web page, query and set the attribute value through the object attribute table, the detailed settings will To bring better results, just put the code into the head. Two deployment examples are listed below for explanation

##Strict definition and non-strict definition

The multi-valued definition of a single attribute is an object attribute (i.e. Mark) can be assigned multiple different values ​​at the same time, and the attribute values ​​are displayed in order according to the needs of the presentation layer product.

Object detailed attribute table

php.cn

The multi-valued definition of a single attribute is an object attribute (i.e. Mark) can be assigned multiple different values at the same time, and the attribute values are displayed in order according to the needs of the presentation layer product.