How to call BiliBili video on web page?The external station calls the video player code of station B

if we useWordPress pluginThe provided shortcode (for example: Smartideo plugin) calls the Bilibili video player,There may be a situation where the BiliBili video cannot be played on the PC side▼

• temporarily unavailable, but playable on source site
• Although it can be played as usual on the mobile terminal, it needs to jump on the PC side.
• If it's not too much trouble, you can check the following.

The external station calls the video player code of station B

I'm sharing a piece of code here so that everyone can display Bilibili's video directly on the PC side of their WordPress blog site.

Take a look at the effect first ▼

<iframe src="//player.bilibili.com/player.html?aid=838720351&bvid=BV1eg4y1v7bZ&cid=206788163&page=1" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true"> </iframe>

How to get the code of the web page to call the Bilibili video player?

1. First, enter the video you want to call on station B;
   
2. Click "Share" below → "Copy" next to "Embed Code" ▼

After clicking Copy, we can get the Bilibili video player code.

<iframe src="//player.bilibili.com/player.html?aid=328895392&bvid=BV1MA411v7Hx&cid=213200245&page=1" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true"> </iframe>

Construct and optimize code

The video calling code of station B obtained above cannot be used directly, and the video calling code of station B needs to be constructed and optimized.

The following are the parameters of the video call of station B (these parameters need to be placed in </iframe>before) ▼

• width="100%"(Video width, 100% recommended)
• height="600"(Video height, 100% recommended)
• high_quality="1" (1=highest quality 0=lowest quality)
• danmaku="0" (1=Open Bullet Chat 0=Close Bullet Chat)

After constructing optimized code▼

<iframe src="//player.bilibili.com/player.html?aid=46366415&bvid=BV1Xb411H7v1&cid=81238398&page=1" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true" width="100%" height="100%" high_quality="1" danmaku="1"> </iframe>

How to add BiliBili video code to WordPress site editor?

If you use the classic editor, please select "Text Mode", and then add the constructed code in the appropriate position in the edit box.

For Gutenberg Editor, select the "Custom HTML" block and add the constructed code ▼

The Bilibili video below is the calling effect of the optimized code▼

• At this time, the video of station B called by our website can be played in high-definition and is adaptive.
• No need to worry about viewing videos on your phone not showing as usual due to the fixed height setting.