网站首页  汉语字词  英语词汇  考试资料  写作素材  旧版资料

请输入您要查询的考试资料:

 

标题 将Lightbox特效整合到WordPress主题中
内容
    实用又华丽的Lightbox特效其实可以轻松整合到WordPress主题中,本文将详细介绍这一方法。
    一、下载Lightbox2的相关文件,以下是为整合到WordPress而修改好的版本。
    下载链接:Lightbox2_for_wp (3)
    下载完成后将lightbox文件夹上传到当前主题目录下
    二、在header.php中加载相关文件
    <link rel="stylesheet" type="text/css" href="<?php bloginfo('template_url') ?>/lightbox/lightbox.css" />
    <script src="<?php bloginfo('template_url') ?>/lightbox/jquery-1.8.0.min.js"></script>
    <script src="<?php bloginfo('template_url') ?>/lightbox/lightbox.js"></script>
    <script type="text/javascript">Lightboxload("<?php bloginfo('template_url'); ?>/");</script>
    代码注释:
    1.第一行代码用于加载lightbox的CSS样式表,你可以将这些代码整合到主题的style.css文件中。
    2.第二行代码用于加载jquery,如果你的主题已经有加载,可以去掉这一行。
    3.第三行代码用于加载实现lightbox的js文件。
    4.第四行代码用于设定lightbox.js文件执行的路径,不可删除。
    三、在functions.php文件末尾加入以下代码
    //lightbox 自动对图片链接添加rel=lightbox属性
    //lightbox 自动对图片链接添加rel=lightbox属性
    add_filter('the_content', 'pirobox_gall_replace');
    function pirobox_gall_replace ($content)
    { global $post;
    $pattern = "/<a(.*?)href=('|")([^>]*).(bmp|gif|jpeg|jpg|png)('|")(.*?)>(.*?)</a>/i";
    $replacement = '<a$1href=$2$3.$4$5 rel="lightbox"$6>$7</a>';
    $content = preg_replace($pattern, $replacement, $content);
    return $content;
    }
    正如代码中的注释一样,这段代码用于对文章中的图片链接,自动添加“rel=lightbox”的属性,以触发Lightbox特效。
随便看

 

在线学习网考试资料包含高考、自考、专升本考试、人事考试、公务员考试、大学生村官考试、特岗教师招聘考试、事业单位招聘考试、企业人才招聘、银行招聘、教师招聘、农村信用社招聘、各类资格证书考试等各类考试资料。

 

Copyright © 2002-2024 cuapp.net All Rights Reserved
更新时间:2025/5/20 17:38:45