个人工具
名字空间
变换
操作

Joomla/Joomla登录模块的DIY改造

来自站长百科
跳转到: 导航, 搜索

Joomla | Joomla使用手册

本条目主要介绍Joomla登录模块的一些个性化改造的简单方法,注意,本文所谈论的登录模块修改指 Joomla! 1.0.13 版本的登录模块。

Joomla login form.png

目录

具体步骤

实际上登录模块在前台显示只占很小一块地方。它的所有外观布局都包含在 /modules/mod_login.php 文件中。因此,我们调整登录模块的所有操作实际上是对此文件的修改。打开 /modules/mod_login.php ,可以看到,从第 80 行以 <table> 标记开始就是登录模块的前台布局了。

Joomla login form 1.png

我们看懂这些代码,就可以自己来动手修改(Hacking)了。

首先, 标记提示这是通过“表格”来控制的布局; 表示表格中换行; 标记内的)作以修改,就能实现“用户名输入框与用户名三个字在同一行”或者“所有项目都在同一行显示”的效果。 或许,有些用户提出更进一步的需求:能否将“注册”及“登录”按钮显示为图片?当然可以。 请制作好分别用于“注册”和“登录”的按钮图片,例如名称为 register.png 和 login.png,放置于网站当前模板的 images 目录下。

“注册”按钮的修改

将 <?php echo _CREATE_ACCOUNT; ?> 这段代码替换为:

<?php echo '<img src="'.$mosConfig_live_site. '/templates/' .$GLOBALS['cur_template']. '/images/register.png" alt="Join Us" />'; ?>

这段代码即可。 如果你的图片名称不是 register.png,位置也不是当前模板的 images 目录,那么请根据实际情况修改上述代码。

例如,你可能使用了名为 regnew.jpg 图片,并放置在网站的 /images/button/ 目录下,那么上述代码就必须变为:

<?php echo '<img src="'.$mosConfig_live_site. '/images/button/regnew.jpg" alt="Join Us" />'; ?>

修改“登录”按钮

原本的“登录”按钮就是一个 <input> 元素,因此我们必须从这里入手。首先将其 type 从 submit 修改为 image,然后插入图片链接即可。即:

将 <input type="submit" name="Submit" class="button" value="<?php echo _BUTTON_LOGIN; ?>" /> 这段代码修改为:

<?php echo '<input type="image" src="'.$mosConfig_live_site.'/templates/'.$GLOBALS['cur_template'].'/images/login.png" name="Submit" 
class="button" height="" width="" border="0" />'; ?>

如果图片名称和位置与本例不同,可根据前面的变通方法修改。

如果你还需要给登录模块增加特定的背景图片,如本文一开始展示的那种圆角图片,那么就需要修改 mod_login.php 文件中有关
表示单元格,包含在同一个
标记表示表格中在同一行显示的并列单元格;
标记表示换行;<label> 标记表示此处将显示文字,而这个文字的定义取自网站当前使用的语言文件;<?php echo_ 开头的代码表示这是提取语言文件中字串;<input> 标记提示这里是输入框或者按钮,其类型根据该元素的 type 属性来判断;<a> 标记代表一个超级链接。如果懂得 HTML 语言,那么这些一眼就能看懂。

例如,下面这段代码代表的就是登录模块上“用户名:”这个字串:

<label for="mod_login_username">
    <?php echo _USERNAME; ?>
   </label>

如果将这一段代码删除或者注释掉(comment out),则前台就不会显示“用户名:”这个字串。

同理,如果将这段代码后面的
标记删除或者屏蔽,那么前台的用户名输入框就会直接跟在“用户名:”后面而不是显示在下一行。

假如你对照前台猜测一下,很快就知道这些代码所表示的内容:

Joomla login form 2.jpg

就这么简单。如果你想改变布局,可以对表格中的换行标记(
或者
标记,给其增加背景图片属性。如果修改不够方便,可以将 用
重新编写,用不同 ID 来区分多个
,然后在模板文件的 css/template_css.css 文件中指定每一个

Joomla 1.0使用手册导航

Joomla安装

Joomla!的安装

Joomla 1.0教程

让网站自动适应掌上电脑阅读版面 | MosIf的使用 | Joomla登录模块的DIY改造| 用下拉式页面跳转替换Joomla跳转列表 | configuration.php文件操作 | 用blog形式做简单的产品展示 | 将DreamHost的mysql数据导入及导出的问题 | 给页面顶端添加ActiveX Infobar | 用JA Transmenu模块做多级弹出菜单 | 用桥接器整合开源Gallery2图库到Joomla | 用CB Profile Gallery搭建交友网站的会员相册 | 在网页中插入Google Map地图 | VM中产品详情只显示大图的实现 | Joomla!扩展(组件、模块、触发器)的汉化 | Joomla! Pack的使用 | 应用JSMF桥接器在Joomla!上安装SMF论坛 | Advanced Flash Mp3 Player播放器模块用法 | Joomla/Allvideos Plugin 引用视频、音频的方法|geshibot使用详解 | 表格式模板列宽度自动扩展的实现 | Joomla! Tkit使用详解 | Community Builder 1.0.2 的安装方法 | 利用CSS给文章标题添加图片 | 如何选择合适的下载组件 | 让Joomla支持flash格式的banner

其他Joomla教程

用XAMPP快速搭建Joomla本地测试服务器 | 用Gmail的SMTP发送Joomla激活及通知邮件 | 深入认识Joomla CMS:扩展、菜单及模板 | Joomla 1.5教程 | Joomla高级教程 | Joomla! SEO教程

留言