下面附有我自己的php脚本，由于某些原因我无法使Lightbox - Lokesh Dhakar工作。我已经尝试了无数不同的语法安排，无法弄清楚我做错了什么。我甚至试图在身体的末尾添加灯箱javascript，以防万一，但没有运气。你们对我有任何建议。
<!DOCTYPE html>
<html>
<head>
<title>CCTV</title>
<link rel="shortcut icon" href="<?php echo THEMEPATH; ?>/img/favicon-32x32.png">
<!-- STYLES -->
<link rel="stylesheet" type="text/css" href="<?php echo THEMEPATH; ?>/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="<?php echo THEMEPATH; ?>/css/bootstrap-theme.min.css">
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
<link rel="stylesheet" type="text/css" href="<?php echo THEMEPATH; ?>/css/style.css">
<!-- SCRIPTS -->
<script type="text/javascript" src="<?php echo THEMEPATH; ?>/js/jquery-2.1.4.js"></script>
<script type="text/javascript" src="<?php echo THEMEPATH; ?>/js/bootstrap.min.js"></script>
<script type="text/javascript" src="<?php echo THEMEPATH; ?>/js/directorylister.js"></script>
<script type="text/javascript" src="<?php echo THEMEPATH; ?>/js/iscroll.js"></script>
<script type="text/javascript" src="<?php echo THEMEPATH; ?>/js/lightbox-plus-jquery.min.js"></script>
<!-- FONTS -->
<link rel="stylesheet" type="text/css" href="//fonts.googleapis.com/css?family=Cutive+Mono">
<!-- META -->
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta charset="utf-8">
<script type="text/javascript">
</script>
</head>
<body>
<!-- <body onload="loaded()"> -->
<div id="page-navbar" class="navbar navbar-default navbar-fixed-top">
<div class="container">
<?php $breadcrumbs = $lister->listBreadcrumbs(); ?>
<p class="navbar-text">
<?php foreach($breadcrumbs as $breadcrumb): ?>
<?php if ($breadcrumb != end($breadcrumbs)): ?>
<a href="<?php echo $breadcrumb['link']; ?>"><?php echo $breadcrumb['text']; ?></a>
<span class="divider">/</span>
<?php else: ?>
<?php echo $breadcrumb['text']; ?>
<?php endif; ?>
<?php endforeach; ?>
</p>
</div>
</div>
<div id="page-content" class="container">
<?php file_exists('header.php') ? include('header.php') : include($lister->getThemePath(true) . "/default_header.php"); ?>
<?php if($lister->getSystemMessages()): ?>
<?php foreach ($lister->getSystemMessages() as $message): ?>
<div class="alert alert-<?php echo $message['type']; ?>">
<?php echo $message['text']; ?>
<a class="close" data-dismiss="alert" href="#">×</a>
</div>
<?php endforeach; ?>
<?php endif; ?>
<h3 style="text-align: center; margin: 1em;" > Ardor | home ~ CCTV </h3>
<div id="wrapper">
<ul id="directory-listing" class="row nav nav-pills nav-stacked">
<?php $counter = 0;?>
<?php foreach( array_slice( $dirArray, 1 ) as $name => $fileInfo): ?>
<li>
<div class="col-md-4 thumbs">
<a href="<?php echo $fileInfo['url_path']; ?>" data-lightbox="gallery" >
<img class="img-responsive" src="<?php echo $fileInfo['url_path']; ?>" alt="<?php echo $fileInfo['url_path']; ?>" > </a>
<p> <?php echo $name; ?> </p>
</div>
</li>
<?php endforeach; ?>
</ul>
</div>
</div>
<?php file_exists('footer.php') ? include('footer.php') : include($lister->getThemePath(true) . "/default_footer.php"); ?>
<link rel="stylesheet" type="text/css" href="<?php echo THEMEPATH; ?>/css/lightbox.min.css">
</body>
</html>
下面的输出：
<!DOCTYPE html>
<html>
<head>
<title>CCTV</title>
<link rel="shortcut icon" href="resources/themes/bootstrap/img/favicon-32x32.png">
<!-- STYLES -->
<link rel="stylesheet" type="text/css" href="resources/themes/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="resources/themes/bootstrap/css/bootstrap-theme.min.css">
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
<link rel="stylesheet" type="text/css" href="resources/themes/bootstrap/css/style.css">
<!-- SCRIPTS -->
<script type="text/javascript" src="resources/themes/bootstrap/js/jquery-2.1.4.js"></script>
<script type="text/javascript" src="resources/themes/bootstrap/js/bootstrap.min.js"></script>
<script type="text/javascript" src="resources/themes/bootstrap/js/directorylister.js"></script>
<script type="text/javascript" src="resources/themes/bootstrap/js/iscroll.js"></script>
<script type="text/javascript" src="resources/themes/bootstrap/js/lightbox-plus-jquery.min.js"></script>
<!-- FONTS -->
<link rel="stylesheet" type="text/css" href="//fonts.googleapis.com/css?family=Cutive+Mono">
<!-- META -->
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta charset="utf-8">
<script type="text/javascript">
</script>
</head>
<body>
<!-- <body onload="loaded()"> -->
<div id="page-navbar" class="navbar navbar-default navbar-fixed-top">
<div class="container">
<p class="navbar-text">
<a href="http://monitor.capa.furniture/">Home</a>
<span class="divider">/</span>
<a href="http://monitor.capa.furniture/?dir=dynasty_loop">dynasty_loop</a>
<span class="divider">/</span>
snap </p>
</div>
</div>
<div id="page-content" class="container">
<h3 style="text-align: center; margin: 1em;" > Ardor | home ~ CCTV </h3>
<div id="wrapper">
<ul id="directory-listing" class="row nav nav-pills nav-stacked">
<li>
<div class="col-md-4 thumbs">
<a href="dynasty_loop/snap/SNAP_CH03_2016_01_06_19_11_53_59550.jpg" data-lightbox="gallery" >
<img class="img-responsive" src="dynasty_loop/snap/SNAP_CH03_2016_01_06_19_11_53_59550.jpg" alt="dynasty_loop/snap/SNAP_CH03_2016_01_06_19_11_53_59550.jpg" > </a>
<p> SNAP_CH03_2016_01_06_19_11_53_59550.jpg </p>
</div>
</li>
<li>
<div class="col-md-4 thumbs">
<a href="dynasty_loop/snap/SNAP_CH03_2016_01_06_18_41_16_57085.jpg" data-lightbox="gallery" >
<img class="img-responsive" src="dynasty_loop/snap/SNAP_CH03_2016_01_06_18_41_16_57085.jpg" alt="dynasty_loop/snap/SNAP_CH03_2016_01_06_18_41_16_57085.jpg" > </a>
<p> SNAP_CH03_2016_01_06_18_41_16_57085.jpg </p>
</div>
</li>
<li>
<div class="col-md-4 thumbs">
<a href="dynasty_loop/snap/SNAP_CH03_2016_01_06_17_58_53_4731.jpg" data-lightbox="gallery" >
<img class="img-responsive" src="dynasty_loop/snap/SNAP_CH03_2016_01_06_17_58_53_4731.jpg" alt="dynasty_loop/snap/SNAP_CH03_2016_01_06_17_58_53_4731.jpg" > </a>
<p> SNAP_CH03_2016_01_06_17_58_53_4731.jpg </p>
</div>
</li>
</ul>
</div>
</div>
<hr>
<div class="footer">
Powered by, <a href="http://www.directorylister.com">Directory Lister</a>
</div>
<link rel="stylesheet" type="text/css" href="resources/themes/bootstrap/css/lightbox.min.css">
</body>
</html>