Moodle开发笔记4-Theme开发

本文介绍如何通过修改Moodle的主题文件header.html和footer.html实现自定义导航路径和在页脚添加链接。

通过 Theme,你可以修改整个 moodle site的外观和风格。

 

一个 Theme最起码包含下列东东:

l       config.php 它设置了 theme要用到的 css file,以及其他 style option

l       styles.php 它是 standard的,不用动它。

l       header.html 它是所有 moodle page的开头部分。它实际是一个 php file

l       footer.html 它是所有 moodle page的结尾部分。它实际是一个 php file

l       theme用到的 css files。 你不需要完全重写所有的 theme css,你可以使用 standard theme css,然后在其基础上只重写你需要修改的部分。

 

Theme主要是通过 CSS file来影响外观,但这里并不讲解 css,而是 focus on programmer感兴趣、的 header.html and footer.html,这 2 file同样也是 theme重要部分。

 

下面的例子是

1.       通过对 header.html 的修改来改变导航 link path

2.       通过对 footer.html 的修改来添加 a link page footer

 

通过对 header.html 的修改来改变 navigation breadcrumbs (导航 link path .

具体要求是在 navigation breadcrumbs 中的 course link 之前添加该 course category link 。例如原来的 navigation link path ”Moodle Home > Course 01”, 那么修改之后要在 Course 01 之前添加 category link ,变成“ Moodle Home > Miscellaneous > Course 01 .

 

我们先来看看 moodle standard theme header.html

<html<?php echo $direction ?>>

<head>

<?php echo $meta ?>

<meta name="keywords" content="moodle, <?php echo $title ?> " />

<title><?php echo $title ?></title>

<link rel="shortcut icon"

href="<?php echo $CFG->themewww .'/'. current_theme() ?>/favicon.ico" />

<?php include("$CFG->javascript"); ?>

</head>

<body<?php

echo " $bodytags";

if ($focus) {

echo " onload=/"setfocus()/"";

}

?>>

<div id="page">

<?php

//Accessibility: 'headermain' is now H1, see theme/standard/styles_layout.css: .headermain

if ($home) { // This is what gets printed on the home page only,下列输入只 for home page

?>

<?php print_container_start(true, '', ' header-home '); ?>

<h1 class="headermain"><?php echo $heading ?></h1>

<div class="headermenu"><?php echo $menu ?></div>

<?php print_container_end(); ?>

<?php } else if ($heading) {

// This is what gets printed on any other page with a heading

?>

<?php print_container_start(true, '', 'header' ); ?>

<h1 class="headermain"><?php echo $heading ?></h1>

<div class="headermenu"><?php echo $menu ?></div>

<?php print_container_end(); ?>

<?php } ?>

 

<?php

//Accessibility: breadcrumb trail/navbar now a DIV, not a table.

if ( $navigation ) { // This is the navigation bar with breadcrumbs

?>

<div class="navbar clearfix">

<!-- standard breadcrumb navigation on a page -->

<div class="breadcrumb"> <?php print_navigation($navigation); ?> </div>

<div class="navbutton"><?php echo $button; ?></div>

</div>

<?php } else if ($heading) { // If no navigation, but a heading, then print a line

?>

<hr />

<?php } ?>

<!-- END OF HEADER -->

<?php print_container_start(false, '', 'content' ); ?>

 

其中:

l       变量 $direction, $home, $meta, $navigation 等已经在之前的某个地方被定义好了

l       print_container_start and print_container_en d函数。这 2个函数用于 structure a page in a known way so that it is easier to change the look of the page by using CSS 每一个 print_container_start会对应一个 print_container_end print_container_start的第三个参数是一个 id来判断当前的 container是用什么 css style structure 。例如上面的 header.html使用了 3 print_container_start id分别是 header_home, header, content。其中 最后一个 print_container_start并没有使用 print_container_end,因为 print_container_end写在 footer.html

l       print_navigation 函数是用来 create standard breadcrumb navigation on a page

 

1.       假设我们自定义的 theme name 为“ customnav”,首先把 moodle_home/theme目录下创建目录“ customnav”,然后把 moodle_home/theme/standardlogo 目录下的所有 files都赋值到“ customnav”下。这样实际上你已经创建了一个 theme,它和 standardlogo theme一摸一样,只不过 theme name不同。

 

2.       要改变 navigation breadcrumbs ,我们只需要修改 header.html。根据上面的 header.html代码,我们要在 call print_navigation 函数之前修改变量 $ navigation ,使其包含 category info 即可

 

$ navigation 变量是一个 key-value array,它有 2 key:

l       newnav 其值总是 1 ,表示 using the 'new' navigation API 。当前例子不需要理会它

l       navlinks 其值是一个 string,它才是真正包含要输出的 navigation info的东东 ,我们要改动的就是该变量的值。

 

先分析 $navigation['navlinks'] 的值的格式:

它的每一个 navigation node都会用 <li> </li>包住。如果 navigation node的数目小于 2个,那么表明并没有进入到 course node里,不需要添加 category node,这是因为 course node一定是放在 $navigation['navlinks'] 里的第二个元素。

 

下面代码的逻辑是:

1)  先把 $navigation['navlinks'] explode to an array

2)  查看 array element count 是否大于等于 2

3)  如果是,则获取第 2 element,并从中提取 course short name(即去掉前后的 <li>/</li>/<a>/</a>

4)  然后根据提取的 course short name 来从数据库中获取该 course属于的 category

5)  然后重新把组装 $navigation['navlinks'] ,即把 category link和之前 explode出来的 array组装到该变量。

6)  最后就可以执行 print_navigation 函数了。

 

/// If there are navigation pieces, separate them out.

if (!empty($navigation['navlinks'])) {

    $pieces = explode ('<li>', $navigation['navlinks']);

} else {

    $pieces = array();

}

 

/// If its possible there is a course piece, find course short name.

$sname = '';

if (count($pieces) > 1) {

$sname = $pieces[1];

// 查看它是不是(通过查看是否包含字串 /course/view.php )有则表示有 <a>

    if (strpos($sname, '/course/view.php') !== false) {

        $sname = substr($sname, 0, strpos($sname, '</a></li>'));

    } else {

        $sname = substr($sname, 0, strpos($sname, '</li>'));

    }

    $sname = trim(substr($sname, strrpos ($sname, '>')+1));

}

 

///find the category by course short name

if ($sname != '') {

    $select = 'SELECT c.id, cc.id as catid, cc.name ';

    $from   = 'FROM '.$CFG->prefix.'course c ';

    $join  = 'INNER JOIN '.$CFG->prefix.'course_categories cc ON cc.id = c.category ';

    $where  = 'WHERE c.shortname = /''.$sname.'/'';

    $sql    = $select.$from.$join.$where;

    $catinfo = get_record_sql($sql);

}

 

/// If we have category information, place it in the nav.

if (!empty($catinfo)) {

    $catlink = $CFG->wwwroot.'/course/category.php?id='.$catinfo->catid;

$catpiece  = '<li>';

// get_separator function returns a character as separator of the breadcrumb pieces

$catpiece .= get_separator();

// $CFG->framename is a configuration item that contains the name of any defined

//HTML frame that the site may sit in (typically none).

$catpiece .= '<a onclick="this.target=/''.$CFG->framename.'/'"

href="'.$catlink.'">'.$catinfo->name.'</a>';

    $catpiece .= '</li>';

 

    $navigation['navlinks'] = $pieces[0];

    foreach ($pieces as $i => $piece) {

        if ($i == 0) {

            continue;

        } else if ($i == 1) { //插入到第一个 element之前

            $navigation['navlinks'] .= $catpiece;

        }

        $navigation['navlinks'] .= '<li>'.$piece;

    }

}

 

 

通过对 footer.html 的修改来在 page footer 添加 a link

footer.html

print_container_start(false, '', 'footer');

后面添加下列代码

 

$termsn = '/'. SITEID .'/termsofuse.html';

$footertext = '';

require_once($CFG->libdir.'/filelib.php');

 

/// Look for terms of use page

if (file_exists($CFG->dataroot.$termsn) ) {

    $link = get_file_url($termsn, null, 'httpscoursefile') ;

    /// To use with pop-up... Must be a relative URL.

    $plink = str_replace($CFG->wwwroot, '', $link);

} else {

    $link = false;

}

if ($link) {

    $footertext .= '<a href="'.$link .'" target="_blank">Terms of Use</a>';

} else {

     $footertext .= 'Terms of Use';

}

echo '<div class="footerlinks">'.$footertext.'</div><br />'; 

 

特别要注意的是:

1 $termsn = '/'. SITEID .'/termsofuse.html';

And file_exists($CFG->dataroot.$termsn)

 

SITEID 的值总是“ 1 (but it is safer to use the constant defined for this ),那么“ $CFG->dataroot /1/xxx ”则是指向 the site directory of the Moodle data area 下的东东。

 

2 get_file_url($termsn, null, 'httpscoursefile')

注意: get_file_url 函数的第一个参数不需要加 $CFG->dataroot,这和 file_exists不同

 

但这时上面的 link还不能用,因为

$CFG->dataroot .'/'. SITEID .'/termsofuse.html'

目前并不存在。你需要 upload a termsofuse.html moodle site

1.       login as admin role

2.       access “Site Administration > Front Page > Site Files”, click “upload a file”

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值