Moodle开发笔记4-Theme开发

2024-04-19 22:48
文章标签 开发 笔记 theme moodle

本文主要是介绍Moodle开发笔记4-Theme开发,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

通过 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 " οnlοad=/"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 οnclick="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”

 

这篇关于Moodle开发笔记4-Theme开发的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/918653

相关文章

Android 悬浮窗开发示例((动态权限请求 | 前台服务和通知 | 悬浮窗创建 )

《Android悬浮窗开发示例((动态权限请求|前台服务和通知|悬浮窗创建)》本文介绍了Android悬浮窗的实现效果,包括动态权限请求、前台服务和通知的使用,悬浮窗权限需要动态申请并引导... 目录一、悬浮窗 动态权限请求1、动态请求权限2、悬浮窗权限说明3、检查动态权限4、申请动态权限5、权限设置完毕后

基于Python开发PPTX压缩工具

《基于Python开发PPTX压缩工具》在日常办公中,PPT文件往往因为图片过大而导致文件体积过大,不便于传输和存储,所以本文将使用Python开发一个PPTX压缩工具,需要的可以了解下... 目录引言全部代码环境准备代码结构代码实现运行结果引言在日常办公中,PPT文件往往因为图片过大而导致文件体积过大,

使用DeepSeek API 结合VSCode提升开发效率

《使用DeepSeekAPI结合VSCode提升开发效率》:本文主要介绍DeepSeekAPI与VisualStudioCode(VSCode)结合使用,以提升软件开发效率,具有一定的参考价值... 目录引言准备工作安装必要的 VSCode 扩展配置 DeepSeek API1. 创建 API 请求文件2.

基于Python开发电脑定时关机工具

《基于Python开发电脑定时关机工具》这篇文章主要为大家详细介绍了如何基于Python开发一个电脑定时关机工具,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起学习一下... 目录1. 简介2. 运行效果3. 相关源码1. 简介这个程序就像一个“忠实的管家”,帮你按时关掉电脑,而且全程不需要你多做

Java中的Opencv简介与开发环境部署方法

《Java中的Opencv简介与开发环境部署方法》OpenCV是一个开源的计算机视觉和图像处理库,提供了丰富的图像处理算法和工具,它支持多种图像处理和计算机视觉算法,可以用于物体识别与跟踪、图像分割与... 目录1.Opencv简介Opencv的应用2.Java使用OpenCV进行图像操作opencv安装j

基于Qt开发一个简单的OFD阅读器

《基于Qt开发一个简单的OFD阅读器》这篇文章主要为大家详细介绍了如何使用Qt框架开发一个功能强大且性能优异的OFD阅读器,文中的示例代码讲解详细,有需要的小伙伴可以参考一下... 目录摘要引言一、OFD文件格式解析二、文档结构解析三、页面渲染四、用户交互五、性能优化六、示例代码七、未来发展方向八、结论摘要

在 VSCode 中配置 C++ 开发环境的详细教程

《在VSCode中配置C++开发环境的详细教程》本文详细介绍了如何在VisualStudioCode(VSCode)中配置C++开发环境,包括安装必要的工具、配置编译器、设置调试环境等步骤,通... 目录如何在 VSCode 中配置 C++ 开发环境:详细教程1. 什么是 VSCode?2. 安装 VSCo

C#图表开发之Chart详解

《C#图表开发之Chart详解》C#中的Chart控件用于开发图表功能,具有Series和ChartArea两个重要属性,Series属性是SeriesCollection类型,包含多个Series对... 目录OverviChina编程ewSeries类总结OverviewC#中,开发图表功能的控件是Char

鸿蒙开发搭建flutter适配的开发环境

《鸿蒙开发搭建flutter适配的开发环境》文章详细介绍了在Windows系统上如何创建和运行鸿蒙Flutter项目,包括使用flutterdoctor检测环境、创建项目、编译HAP包以及在真机上运... 目录环境搭建创建运行项目打包项目总结环境搭建1.安装 DevEco Studio NEXT IDE

Python开发围棋游戏的实例代码(实现全部功能)

《Python开发围棋游戏的实例代码(实现全部功能)》围棋是一种古老而复杂的策略棋类游戏,起源于中国,已有超过2500年的历史,本文介绍了如何用Python开发一个简单的围棋游戏,实例代码涵盖了游戏的... 目录1. 围棋游戏概述1.1 游戏规则1.2 游戏设计思路2. 环境准备3. 创建棋盘3.1 棋盘类