阿里百秀主题分类页面单独调用轮播图

今天利用中午时间解决一网友问题,使阿里百秀主题(秀主题/xiu主题)分类页也可调用与首页一样的轮播图,与首页的单独显示,不做多叙述,记录分享一下操作过程。

演示地址:http://www.ludaniu8.com/

改动的文件 xiu/options/options.php,xiu/category.php(4.1版本)

添加的文件 xiu/modules/hui_focusslide2.php(4.1版本)

在options.php内复制首页轮播图的相关代码,复制一份放在其下面,4.1版本应该是在510行左右,添加如下代码

/**
*分类显示轮播图
*/
$options[] = array(
'name' => __('分类轮换图', 'haoui'),
'type' => 'heading');

$options[] = array(
'id' => 'focusslide_s2',
'std' => false,
'desc' => __(' 开启 ', 'haoui'),
'type' => 'checkbox');

$options[] = array(
'id' => 'focusslide_s2_m',
'std' => false,
'desc' => __(' 显示在移动端', 'haoui'),
'type' => 'checkbox');

$options[] = array(
'name' => __('排序', 'haoui'),
'id' => 'focusslide_sort2',
'desc' => '默认:1 2 3 4 5',
'std' => '1 2 3 4 5',
'type' => 'text');

for ($i=1; $i <= 5; $i++) {

$options[] = array(
'name' => __('图', 'haoui').$i,
'id' => 'focusslide_title2_'.$i,
'desc' => '标题',
'std' => get_bloginfo('name'),
'type' => 'text');

$options[] = array(
// 'name' => __('链接到', 'haoui'),
'id' => 'focusslide_href2_'.$i,
'desc' => __('链接', 'haoui'),
'std' => site_url(),
'type' => 'text');

$options[] = array(
'id' => 'focusslide_blank2_'.$i,
'std' => true,
'desc' => __('新窗口打开', 'haoui'),
'type' => 'checkbox');

$options[] = array(
// 'name' => __('图片', 'haoui'),
'id' => 'focusslide_src2_'.$i,
'desc' => __('图片,尺寸:', 'haoui').'860*320',
'std' => $imagepath.'thumbnail.png',
'type' => 'upload');
}

然后category.php文件添加以下代码来调用此段函数内容,没有意外的话是在第四行<div class="content">后添加

<?php
if( !$paged && _hui('focusslide_s2') ) hui_moloader('hui_focusslide2');
?>

最后就是创建hui_focusslide2.php文件,可以直接复制其目录下的hui_focusslide.php,然后里面的调用函数修改值为上最上面一段显示的值,我在原有基础上的数值后面添加数字2,如下

<?php
/*
* post focus2
* ====================================================
*/
function hui_focusslide2(){
$indicators = '';
$inner = '';
$sort = _hui('focusslide_sort2') ? _hui('focusslide_sort2') : '1 2 3 4 5';
$sort = array_unique(explode(' ', trim($sort)));
$i = 0;
foreach ($sort as $key => $value) {
if( _hui('focusslide_src2_'.$value) && _hui('focusslide_href2_'.$value) && _hui('focusslide_title2_'.$value) ){
$indicators .= '<li data-target="#slider" data-slide-to="'.$i.'"'.(!$i?' class="active"':'').'></li>';
$inner .= '<div class="item'.(!$i?' active':'').'"><a'.( _hui('focusslide_blank2_'.$value) ? ' target="_blank"' : '' ).' href="'._hui('focusslide_href2_'.$value).'"><img src="'._hui('focusslide_src2_'.$value).'!wz" alt="阿里百秀主题分类页面单独调用轮播图"><span class="carousel-caption">'._hui('focusslide_title2_'.$value).'</span><span class="carousel-bg"></span></a></div>';
$i++;
}
}
echo '<div id="slider" class="carousel slide" data-ride="carousel"><ol class="carousel-indicators">'.$indicators.'</ol><div class="carousel-inner">'.$inner.'</div><a class="left carousel-control" href="#slider" role="button" data-slide="prev"><span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span></a><a class="right carousel-control" href="#slider" role="button" data-slide="next"><span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span></a></div>';
}

然后就能实现阿里百秀主题分类页面单独调用轮播图,过程就是这样的。

公益传播因为有你,爱不罕见。

转载请注明出处:大刘子 » 阿里百秀主题分类页面单独调用轮播图

支持博主随手一点

评论 1

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址
  1. 陌小雨博客自适应的主题换位置就是方便哈,我也要静静的在这里留下脚印^_^回复