l-1

WordPress笔记

主页/WordPress笔记/博客文章/综合文章/如何在WordPress中添加官方LinkedIn分享按钮

如何在WordPress中添加官方LinkedIn分享按钮

Bug编译狮

Bug编译狮

要在WordPress中添加官方LinkedIn分享按钮，你需要遵循以下步骤：

  1. 登录到您的WordPress后台。
  2. 导航到“设置” -> “插件” -> 点击“安装新插件”。
  3. 在搜索框中输入“LinkedIn Share Button”，然后点击搜索结果中的“LinkedIn Share Button for WordPress”。
  4. 下载并激活插件。

接下来，我们来配置这个插件以显示LinkedIn分享按钮。

配置LinkedIn Share Button

  1. 登录到您的WordPress后台。
  2. 找到“插件管理器”并选择已安装的“LinkedIn Share Button for WordPress”。点击“配置”。
  3. 这里你会看到一些预设的链接选项，例如Facebook、Twitter等。如果你想要添加LinkedIn分享按钮，你需要选择“Custom URL”。
  4. 输入您想要分享的链接地址，例如https://example.com/post/123（请替换为实际链接）。
  5. 设置LinkedIn的URL字段，通常会自动填充为https://www.linkedin.com/sharing/share-offsite/?url=。
  6. 保存配置后，你应该会在页面或帖子上看到LinkedIn分享按钮。

示例代码

假设你想在首页添加一个LinkedIn分享按钮，你可以这样编写HTML和JavaScript：

<!-- HTML部分 -->
<a href="#" class="linkedin-share-button" data-url="<?php echo esc_url(get_permalink()); ?>" data-title="<?php the_title(); ?>">
    <i class="fa fa-linkedin"></i>
</a>

<script src="https://platform.linkedin.com/badges/js/profile.js" type="text/javascript"> </script>
<script type="text/javascript">
    //<![CDATA[
        if (typeof linkedInProfileShare !== 'undefined') {
            var options = {
                url: "<?php echo esc_url(get_permalink()); ?>",
                title: "<?php the_title(); ?>"
            };
            linkedInProfileShare.init(options);
        }
    //]]>
</script>

请注意，上述代码需要确保你的网站已经启用了插件并正确配置了LinkedIn Share Button。此外，为了防止潜在的安全风险，建议从官方网站下载插件文件，并在安全环境下测试其功能。

通过以上步骤，你就可以成功地在WordPress站点上添加一个LinkedIn分享按钮了。

黑板前的Bug语法讲师

黑板前的Bug语法讲师

在WordPress中添加官方LinkedIn分享按钮是一项简单但重要的工作，它可以帮助提升网站流量和社交媒体影响力。以下是如何使用WordPress插件“Social Share Buttons”来实现这一目标：

第一步：安装并启用插件

首先，你需要在WordPress插件目录（通常位于wp-content/plugins/）下找到名为“Social Share Buttons”的插件文件夹。接下来，点击“激活插件”。

第二步：设置主题样式

打开“Social Share Buttons”插件界面后，你会看到一个包含多种选项的地方。这里你可以自定义按钮的外观、颜色、字体等。选择一个合适的布局或样式，然后点击“保存更改”。

第三步：配置链接

  1. 访问URL： 在左侧菜单栏中，找到并点击“Link URLs”。在这里，你可以输入LinkedIn的具体分享链接。

  2. 显示方式： 选择“嵌入式”或“独立”，以决定是否将LinkedIn分享按钮作为单独的元素展示，还是将其与文章正文一起呈现。

  3. 按钮位置： 通过拖动滑块调整按钮的位置，确保它们看起来自然地融入到文章内容中。

  4. 链接标题： 如果需要，可以为LinkedIn分享按钮添加一个标题文字，例如“立即分享至LinkedIn”。

  5. 链接描述： 插入一段简短的文字，用于描述LinkedIn分享的内容，这有助于增加分享的可能性。

第四步：测试功能

在编辑文章时，尝试点击LinkedIn分享按钮，看看是否有任何问题出现。如果一切正常，请返回WordPress后台查看效果。

示例代码：

假设我们想要创建一个嵌入式的LinkedIn分享按钮，以下是相应的HTML和CSS代码片段：

HTML:

<!-- 单独的LinkedIn分享按钮 -->
<div class="social-share-buttons">
    <a href="#" class="linkedin-button" data-url="https://www.linkedin.com/shareArticle?mini=true&url=https%3A%2F%2Fexample.com%2Fpost%2Ftitle" title="Share on LinkedIn">Share on LinkedIn</a>
</div>

<!-- 独立的LinkedIn分享按钮 -->
<a href="#" class="linkedin-button" data-url="https://www.linkedin.com/shareArticle?mini=true&url=https%3A%2F%2Fexample.com%2Fpost%2Ftitle" title="Share on LinkedIn">Share on LinkedIn</a>

CSS:

.social-share-buttons {
    position: relative;
    margin-bottom: 10px;
}

.linkedin-button {
    display: inline-block;
    padding: 10px 20px;
    background-color: #4667b9;
    color: white;
    border-radius: 5px;
    text-decoration: none;
    font-size: 16px;
    transition: background-color 0.3s ease-in-out;
}

.linkedin-button:hover {
    background-color: #2c478e;
}

总结

以上步骤展示了如何在WordPress中添加官方LinkedIn分享按钮的基本流程。记住，在实际操作中可能还需要根据具体情况进行一些微调，以适应不同的设计需求。同时，确保遵守LinkedIn的使用条款，避免违反其社区准则。

最新更新