用代码添加QQ邮件列表输入框

话说现在QQ邮件列表很火,许多站长都在自己的网站上添加了这么一个直接输入邮箱即可快速订阅的输入框。我们一般是将腾讯提供的代码直接添加到后台侧栏小工具中,即可在前台显示输入框,但是腾讯提供的只有两种形态,一种链接方式,一种算是直接价格输入框的插件方式。相比之下,我觉得后者的体验更好一些,但比较单一。其实这只是一个输入框而已,如果我们自己写一个输入框,然后将所需数据添加到这个输入框代码中,其功能与腾讯官方提供QQ邮件列表代码是一样的。而且这样我们可以更为个性化的定制自己所喜欢的输入框外观,不必千篇一律。

QQ邮件列表官方入口

首先,添加一个表单:

注意action的值是向何处发送表单数据

<form action="http://list.qq.com/cgi-bin/qf_compose_send" target="_blank" method="post"></form>

然后在表单(<form>标签)内添加文本输入框,代码如下:

<input type="hidden" name="id" value="e22d4b6cded9301330602d35eac0d9e2947f4c3a3289de9b"><input id="to" value="输入邮箱 订阅本站" onfocus="if (this.value == '输入邮箱 订阅本站'){this.value = '';}" onblur="if (this.value == ''){this.value = '输入邮箱 订阅本站';}" name="to" type="text">

 

第一个<input>标签内value的值是你的QQ邮件列表ID,获取方法可以去登录你的QQ邮件列表,点击“收集订户”按钮,在这里你可以找到一组由数字和字母组合的48位ID。如果你以前一直把QQ邮件列表插件代码放在侧栏小工具内就更方便了,直接去那里找吧。

第二个<input>标签内value的值是你想在前台输入框内显示的默认文字,为了保证鼠标点击输入框隐藏默认文字的效果,要与后边大括号内的value值保持一致。

至于控制其在前台的表现效果,可以为它添一个Div,然后在style文件里面进行控制。

发表评论

10 条回应

  1. 欧文说道:

    主个模板的订阅框都没有订阅按键,很多人会误认为是点击上面的订阅本站那个按键

    1. 小雨说道:

      不会吧,不知道敲回车还有可能,认为按钮在上边那就太夸张了。要是怕误会,你可以把框里的文字改成:输入邮箱 回车订阅本站 [抽烟]

  2. 那不是我说道:

    这个好,我的还没加

    1. 小雨说道:

      去官网copy代码或者自制一个都可以~

  3. 篮球比分说道:

    没用过这种的

    1. 小雨说道:

      见本站侧栏看效果吧······

      1. 篮球比分说道:

        没发现,难道我比菜鸟还菜鸟

        1. 小雨说道:

          [晕] 看来我应该贴个图的···

          1. 篮球比分说道:

            这个好啊

  4. 夹克衫说道:

    抢到沙发啦·~