如何移除 Facebook 点赞按钮上的社交文本?

huangapple go评论74阅读模式
英文:

How to remove facebook like button social text?

问题

我想删除Facebook点赞按钮上的社交文本,以适应宽度,您可以看到图像1。

我已经阅读了文章

但当我访问https://developers.facebook.com/docs/reference/plugins/like/时,我可以更改“布局为button_count”,但我找不到“取消勾选发送按钮”。我该怎么做?

顺便说一下,在官方网站上,可以显示没有文本的点赞按钮,您可以看到图像2。

图像1

如何移除 Facebook 点赞按钮上的社交文本?

图像2

如何移除 Facebook 点赞按钮上的社交文本?

英文:

I would like to remove the social text from the facebook like button in order to fit into the width, you can see Image 1.

I have read the article.

But when I access https://developers.facebook.com/docs/reference/plugins/like/ , I can change the "layout to button_count", but I can't find "uncheck send button". How can I do?

BTW, In the official website, it can display a Like Button without text, you can see Image 2.

Image 1

如何移除 Facebook 点赞按钮上的社交文本?

Image 2

如何移除 Facebook 点赞按钮上的社交文本?

答案1

得分: 1

以下是您要的内容的中文翻译部分:

你是否尝试过使用建议的代码,而不是使用Facebook按钮生成器?以下是代码示例:

<!DOCTYPE html>
<html>
  <head>
    <title>您的网站标题</title>
    <!-- 您可以使用开放图形标签来自定义链接预览。
    了解更多:https://developers.facebook.com/docs/sharing/webmasters -->
    <meta property="og:url" content="https://www.your-domain.com/your-page.html" />
    <meta property="og:type" content="website" />
    <meta property="og:title" content="您的网站标题" />
    <meta property="og:description" content="您的描述" />
    <meta property="og:image" content="https://www.your-domain.com/path/image.jpg" />
  </head>
  <body>
  
    <!-- 加载 Facebook JavaScript SDK -->
    <div id="fb-root"></div>
    <script async defer crossorigin="anonymous" 
          src="https://connect.facebook.net/fr_FR/sdk.js#xfbml=1
               &version=v16.0
               &appId=YOURAPPID
               &autoLogAppEvents=1" 
          nonce="FOKrbAYI">
    </script>
  
    <!-- 您的点赞按钮代码 -->
    <div class="fb-like" 
         data-href="https://www.your-domain.com/your-page.html" 
         data-width=""
         data-layout="button_count" 
         data-action="like" 
         data-size="small"  
         data-share="false">
    </div>
  
  </body>
</html>

如何移除 Facebook 点赞按钮上的社交文本?

英文:

Have yo tried the suggested code instead of the FB button generator ?
Here you go :

&lt;html&gt;
&lt;head&gt;
  &lt;title&gt;Your Website Title&lt;/title&gt;
    &lt;!-- You can use open graph tags to customize link previews.
    Learn more: https://developers.facebook.com/docs/sharing/webmasters --&gt;
  &lt;meta property=&quot;og:url&quot;           content=&quot;https://www.your-domain.com/your-page.html&quot; /&gt;
  &lt;meta property=&quot;og:type&quot;          content=&quot;website&quot; /&gt;
  &lt;meta property=&quot;og:title&quot;         content=&quot;Your Website Title&quot; /&gt;
  &lt;meta property=&quot;og:description&quot;   content=&quot;Your description&quot; /&gt;
  &lt;meta property=&quot;og:image&quot;         content=&quot;https://www.your-domain.com/path/image.jpg&quot; /&gt;
&lt;/head&gt;
&lt;body&gt;

  &lt;!-- Load Facebook SDK for JavaScript --&gt;
  &lt;div id=&quot;fb-root&quot;&gt;&lt;/div&gt;
  &lt;script async defer crossorigin=&quot;anonymous&quot; 
        src=&quot;https://connect.facebook.net/fr_FR/sdk.js#xfbml=1
			 &amp;version=v16.0
			 &amp;appId=YOURAPPID
			 &amp;autoLogAppEvents=1&quot; 
        nonce=&quot;FOKrbAYI&quot;&gt;
  &lt;/script&gt;

  &lt;!-- Your like button code --&gt;
  &lt;div class=&quot;fb-like&quot; 
       data-href=&quot;https://www.your-domain.com/your-page.html&quot; 
       data-width=&quot;&quot;
       data-layout=&quot;button_count&quot; 
       data-action=&quot;like&quot; 
       data-size=&quot;small&quot;  
       data-share=&quot;false&quot;&gt;
  &lt;/div&gt;

&lt;/body&gt;
&lt;/html&gt;

如何移除 Facebook 点赞按钮上的社交文本?

答案2

得分: 0

我测试过,这只显示了“喜欢”按钮:

&lt;div class=&quot;fb-like&quot;
  data-href=&quot;https://developers.facebook.com/docs/plugins/&quot;
  data-width=&quot;500&quot;
  data-layout=&quot;button&quot;
  data-action=&quot;like&quot;
  data-size=&quot;small&quot;
  data-share=&quot;false&quot;&gt;&lt;/div&gt;

正如你所知,你应该将以下内容放在你的标签中,并添加你的密钥:

&lt;script async defer crossorigin=&quot;anonymous&quot; src=&quot;https://connect.facebook.net/en_US/sdk.js#xfbml=1&amp;version=v16.0&quot; nonce=&quot;vnvxh4b9&quot;&gt;&lt;/script&gt;

你可以在version=v16.0后面添加应用程序 ID,就像这样。123456789是你的应用程序 ID:

&lt;script async defer crossorigin=&quot;anonymous&quot;
   src=&quot;https://connect.facebook.net/en_US/sdk.js#xfbml=1&amp;version=v16.0&amp;appId=123456789&quot;
   nonce=&quot;vnvxh4b9&quot;&gt;&lt;/script&gt;

此外,你可以使用CSS来隐藏其他内容:

.fb-like {
    width: 60px !important;
    overflow: hidden !important;
    height: 20px !important;
}

在JsFiddle中查看结果

**注意:如果你想在按钮上显示计数,只需将data-layout=&quot;button&quot;更改为以下内容:

data-layout=&quot;button_count&quot;

并相应地增加CSS中的宽度!

英文:

I tested and this only shows like button:

&lt;div class=&quot;fb-like&quot;
  data-href=&quot;https://developers.facebook.com/docs/plugins/&quot;
  data-width=&quot;500&quot;
  data-layout=&quot;button&quot;
  data-action=&quot;like&quot;
  data-size=&quot;small&quot;
  data-share=&quot;false&quot;&gt;&lt;/div&gt;

As you know you should have this in your head tag and also add your keys to it:

&lt;script async defer crossorigin=&quot;anonymous&quot; src=&quot;https://connect.facebook.net/en_US/sdk.js#xfbml=1&amp;version=v16.0&quot; nonce=&quot;vnvxh4b9&quot;&gt;&lt;/script&gt;

You can add app ID after version=v16.0 like this. 123456789 is your app ID:


```html
&lt;script async defer crossorigin=&quot;anonymous&quot;
   src=&quot;https://connect.facebook.net/en_US/sdk.js#xfbml=1&amp;version=v16.0&amp;appId=123456789&quot;
   nonce=&quot;vnvxh4b9&quot;&gt;&lt;/script&gt;

Also you can use CSS to hide everything else:

```css
.fb-like {
    width: 60px !important;
    overflow: hidden !important;
    height: 20px !important;
}

See the result in JsFiddle

**Note: If you want to show count on button just change data-layout=&quot;button&quot; in the div to

data-layout=&quot;button_count&quot;

And respectfully increase the width if you use CSS!

huangapple
  • 本文由 发表于 2023年2月27日 18:34:18
  • 转载请务必保留本文链接:https://go.coder-hub.com/75579342.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定