【问题标题】:How to create a simple Like Button?如何创建一个简单的赞按钮?
【发布时间】:2013-02-03 15:54:38
【问题描述】:

我需要一个简单的点赞按钮。它必须允许访问者在不登录其社交网络帐户的情况下投票。

有什么想法吗?

【问题讨论】:

  • 不确定我是否理解...您希望有人使用 facebook 喜欢您的页面,但没有登录 facebook?
  • 不,我希望访问者匿名喜欢我的页面或页面上的项目。
  • 这个likebtn.com/en 非常适合

标签: html web button widget


【解决方案1】:

我从svbtle 重新创建了 Kudos 按钮作为独立小部件。

kudosplease.com

什么是“荣誉”?

赢得荣誉就是赢得尊重和认可。一个没有依赖项的单元素荣誉小部件。

"kudos" on urbandictionary

如何使用

1。将 CSS/JS 添加到您的页面

2。添加小部件 HTML

<div class="kudos" 
     data-amount="0" 
     data-url="domain.tld/my-awesome-article"></div>

3。通过JS初始化小部件

new KudosPlease({ 
  el : '.kudos',
  duration : 1500,
  persistent : true,
  status : {
    alpha: 'fontelico-emo-shoot',
    beta: 'fontelico-emo-shoot',
    gamma: 'fontelico-emo-beer'
  }  
});

免费 API 或自己托管

特定网址的点赞量保存在我的后端,但你也可以在 GitHub 上下载:https://github.com/TimPietrusky/KudosPlease

示例

【讨论】:

    【解决方案2】:

    我重新创建了一个中等风格的掌声按钮:

    http://applause-button.com/

    该按钮将掌声持续到托管的后端服务,因此无需启动您自己的数据库。添加就这么简单:

    <head>
      <!-- add the button style & script -->
      <link rel="stylesheet" href="dist/applause-button.css" />
      <script src="dist/applause-button.js"></script>
    </head>
    <body>
      <!-- add the button! -->
      <applause-button style="width: 58px; height: 58px;"/>
    </body>
    

    【讨论】:

      【解决方案3】:

      您可以将“喜欢”存储在自己的数据库中。只需有一个点击服务器并更新数据库表中的计数的“喜欢”链接。当然,这需要数据库和服务器端语言(PHP、Ruby、Python 等)。

      https://svbtle.com/ 博客网络有一个很酷的小“Kudos”按钮,当您将鼠标悬停在 Kudos 按钮上时,它会匿名喜欢。 http://howtomakelightning.com/365/

      我不确定你会如何在静态网站上做到这一点。

      【讨论】:

      • 谢谢。我网站的大部分页面都被缓存了,所以网站是“静态的”。当然,我可以用 PHP 制作我自己的按钮小部件,但这需要时间......我试图谷歌搜索某种免费的类似按钮小部件,但没有成功。
      【解决方案4】:

      不能简单地创建一个赞按钮 :D 您的按钮将在某处(通常是数据库)存储“喜欢”,根据定义,这是一个动态过程,并找到一种方法来处理一些安全和用户体验问题。

      如果你使用 React,我创建了这个服务 https://lyket.dev/,它会处理一切。

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 2012-08-09
        • 2013-12-24
        • 1970-01-01
        • 1970-01-01
        相关资源
        最近更新 更多