共享到Facebook-从动态生成的页面

时间:2019-06-08 作者:Debbie Kurth

我在WordPress环境中有一个动态生成的页面。此页面使用简单的短代码,没有参数,但该页面通过另一个页面启动并传递URL参数。此参数指示要在页面上显示的数据集。很好用,但。。。。。

页面上的共享工作正常。该链接正确共享位置,并与URL参数共享,打开时会显示正确的信息。但我希望图像、描述和名称与默认页面不同。

经过一些工作和StackExchange上其他人的帮助,我成功地用facebook必需的元字段更改了标题,并确认了它们的存在。

首先是页面标题:

 add_filter(\'document_title_parts\',\'ChangeTitleParts\', 10, 1);  
 function ChangeTitleParts($TitleParts)
 {
  if ( isset( $TitleParts[ \'title\' ] ) && $TitleParts[ \'title\' ] == \'Details\' ) 
     $TitleParts[ \'title\' ] = $_GET[ \'Name\' ];  

 return $TitleParts;    
 }
然后更改标头中的元值:

 add_action( \'wp_head\', \'add_custom_meta\', 10 );    
 function add_custom_meta()
 {
 $slug = basename(get_permalink());
 if(    $slug == \'details\')
   {
   $Name = $_GET[ \'Name\' ];
   $Desc = $_GET[ \'Desc\' ];
   $Logo = $_GET[ \'Logo\' ]; 
   ?>    
    <meta property="og:title" content="<?php echo $Name; ?>>"/>
    <meta property="og:description" content="<?php echo $Desc; ?>">
    <meta property="og:image" content="<?php echo $Logo; ?>">
     <?PHP
   }
 }
facebook元属性如下:

 <meta property="og:title" content="Facebook Open Graph Demo">
 <meta property="og:image" content="http://example.com/main-image.png">
 <meta property="og:site_name" content="Example Website"> 
 <meta property="og:description" content="Here is a nice description">
问题是,facebook拒绝显示标题、描述或相关的iamge,即使标题中包含必需的元数据。我做错了什么?

1 个回复
SO网友:Rick Hellewell

我使用了这个代码;根据需要更改值,获取FB应用程序ID。

而且这不是立即发生的;有一个过程可以清除页面的FB缓存,以获取当前信息。(现在找不到……但我想它在FB应用程序页面上。)

(我添加了视口元值;始终有用。)

<meta property= "og:url" content="https://www.example.com/" />
<meta property= "og:type" content="website" />
<meta property= "og:title" content="The page title" />
<meta property= "og:image" content="https://www.example.com/full/path/to/the/thumbnail.jpg" />
<meta property="og:description" content="A longer description, maybe the excerpt" />
<meta property="og:site_name" content="the site name">
<meta property="fb:app_id" content="your-fb-app-id-number" />

<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="the page title" />
<meta name="twitter:description" content="A longer string like the excerpt" />
<meta name="twitter:url" content="https://www.example.com/" />
<meta name="twitter:image" content="https://www.example.com/cover-final/Cover-Book-One-Final.jpg">
<meta name="viewport" content="width=device-width, initial-scale=1.0">

Added

找到有关如何清除开发人员FB缓存的以下信息:https://leadseven.zendesk.com/hc/en-us/articles/203358641-How-To-Clear-Facebook-Share-Cache . 与我所做的相似。在调试时或对“og”内容进行重大更改时使用效果很好。