Question to say "I can!"

福彩快3怎么玩:给wordpress增加一个随机文章按钮

2014-02-04

这个功能想了很久了,还是大发老师给力。

原文:给wordpress增加一个随机文章按钮

不少网站都有随机文章的功能,包括之前我的写过一个,但是那个实现方法比较蛋疼,这次的实现方式更先进一些,样式还可以。按钮你可以随便放在哪,只要注意给dom绑定事件就可以了。

把下面的代码放到functions.php

wp_enqueue_script( 'base', true);
wp_localize_script('base', 'Bigfa', array(
     "ajaxurl" => admin_url('admin-ajax.php')
));
add_action( 'wp_ajax_random_post', 'bigfa_random_post' );
add_action( 'wp_ajax_nopriv_random_post', 'bigfa_random_post' );
function bigfa_random_post() {
?? ?$posts = get_posts('post_type=post&orderby=rand&numberposts=1');
??? foreach($posts as $post) {
??????? $link = get_permalink($post);
??? }
??? echo $link;
??? exit;
}

JS代码,需要1.7以上版本的JQ库

jQuery('.random_post').on('click', function(e) {
??????????? e.preventDefault();
??????????? jQuery.post(Bigfa.ajaxurl, {
??????????????? action : 'random_post',
??????????????? }, function(data) {
??????????????????? window.location.href = data;
??????????? });
??????? });

在你想使用的地方放上按钮,我是直接仍在了footer.php中

<?php if(!wp_is_mobile()) echo '<a href="javascript:void(0)"> </a>';?>

css参考样式

.random_post {background-color: #E8E8E8;background-image: url("img/random_icon_normal.png");background-position: center center;background-repeat: no-repeat;height: 16px;margin-top: -60px;padding: 20px 10px;position: fixed;right: 0;top: 50%;width: 19px;}
.random_post:hover{background-color:#F36639;background-image: url("img/random_icon_hover.png");}
作者:admin | Categories:设计问题 | Tags: 、、

发表评论

电子邮件地址不会被公开。 必填项已用*标注

*

  • 方言报站也是一种有意义的尝试 2019-05-22
  • 财经随笔:年近半百,“金融科技”仍是少年 2019-05-20
  • 山西寿阳:竹马戏演员的台前幕后 2019-05-19
  • 主城赏荷地图出炉 快带上相机出发 2019-05-19
  • 男人不安全了?日本读心美女机器人,你咋想的它全知道! 2019-05-03
  • 重庆市永川区:“1+8+X”模式探索基层人民调解新路子 2019-05-03
  • 春节我在岗:爸妈,儿子在军营给您们拜年了 2019-04-22
  • 传统文化,在中国文化里,居住是衡量一个家庭生活的基本因素。 2019-04-15
  • 俄韩就铺设途经朝鲜的天然气管道恢复磋商 2019-04-15
  • 经营者要想“我心换你心”,就要未雨绸缪,让不诚信的诱惑少一点,如此才能在市场中生存下来。反过来说,承担不起亏损就关门歇业,是否也是一种不诚信呢? 2019-04-11
  • 江西省能源集团公司党委副书记胡运生等2人被调查 2019-04-11
  • 乌鲁木齐:这个端午,他们的假日叫“坚守” 2019-03-29
  • 中国电信安康分公司60家智慧家庭便民服务中心盛大开业中国电信安康-最新活动 2019-03-28
  • 中心城区核心片组完成签约清零任务 2019-03-28
  • (Dos sesiones) Legislativo nacional de China concluye sesión anual Spanish.xinhuanet.com 2019-03-28
  • 510| 989| 604| 49| 358| 694| 318| 210| 316| 628|