使用无头Wordpress时,我可以在Twitter前端的帖子中嵌入推文吗?

问题描述 投票:0回答:1

我正在React中建立一个站点,并将Wordpress用作博客的无头CMS。我的某些帖子使用Wordpress的内置Twitter小部件嵌入了一个或多个推文。

[当我从Wordpress REST API调用帖子时,Wordpress Twitter小部件不会呈现。它只传递推文的基本内容以及通用的Twitter嵌入脚本:

<script async="" src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

您可以在此处看到当前如何渲染到网站(带有一些样式)的示例:https://master.d36liwrx5rvjnc.amplifyapp.com/blog/post/11234

((似乎没有对Twitter脚本执行任何操作。)

在我要从中提取内容的Wordpress实例上,它看起来像这样:https://oracleselixir.com/2020/02/analyst-challenge-lane-assignments-and-neutral-objectives-february-12/

有什么方法可以让我的React前端将Wordpress的内容识别为嵌入式Tweet,并通过Twitter的脚本进行呈现,使其看起来更好并且更具交互性?

reactjs wordpress twitter embed headless
1个回答
0
投票

经过更多搜索之后,我发现了它,部分原因是此问题:React: Embed tweet: Display text instead of tweet

我的解决方案是将Twitter嵌入脚本粘贴在index.html的主体标记上方,例如:

  <body>
    <noscript>You need to enable JavaScript to run this app.</noscript>
    <div id="root"></div>
    <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
  </body>

然后在useEffect(如果使用的是类组件,则调用componentDidMount / componentDidUpdate)中的Twitter小部件load():

  useEffect(() => {
    window.twttr.widgets.load()
  }, []);

与其他StackOverflow问题的主要区别在于需要指定window.

© www.soinside.com 2019 - 2024. All rights reserved.