Descarc fisierele plugin-ului. Dezarhivez .zip-ul. Bag folderul yoxview in folderul js din root-ul site-ului. In folderul js se afla, de asemenea, si jquery1.4.2.js, fisierul cu libraria jQuery. Sterg yoxview-nojquery.js, jquery-1.4.2.min.js, jquery.jsonp-1.0.4.min.js, jquery.yoxview-1.1.min.js.
Modific yoxview-init.js in:
var _yoxviewPath = getYoxviewPath();
document.write('<link rel="Stylesheet" type="text/css" href="' + _yoxviewPath + 'yoxview.css" />');
function LoadScript( url )
{
document.write( '<scr' + 'ipt type="text/javascript" src="' + url + '"><\/scr' + 'ipt>' ) ;
}
LoadScript(_yoxviewPath + "jquery.timers-1.2.min.js");
LoadScript(_yoxviewPath + "jquery.yoxview-1.1.js");
function getYoxviewPath()
{
var scripts = document.getElementsByTagName("script");
var regex = /(.*\/)yoxview.*/i;
for(var i=0; i<scripts.length; i++)
{
var currentScriptSrc = scripts[i].src;
if (currentScriptSrc.match(regex))
return currentScriptSrc.match(regex)[1];
}
return null;
}
Din folderul lang pot sterge toate fisierele in afara de en.js.
Dupa toate astea, folderul yoxview (care asa cum am zis se afla in folderul js din root-ul site-ului) va arata asa:

In acest fel ma scap de fisiere inutile. Nu are sens sa ocup spatiu pe server aiurea.
Acum nu imi mai ramane decat sa implementez plugin-ul in pagina mea web.
index.php
<?php include('includes/functions.inc.php'); ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Cum implementez YoxView intr-o pagina web?</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="description" content="Cum implementez YoxView intr-o pagina web?" />
<meta name="keywords" content="Cum implementez YoxView intr-o pagina web?" />
<meta name="abstract" content="Cum implementez YoxView intr-o pagina web?" />
<meta name="author" content="AccesInterzis" />
<meta name="copyright" content="AccesInterzis" />
<meta name="robots" content="noindex,nofollow" />
<meta name="revisit-after" content="7 days" />
<meta http-equiv="cache-control" content="no-cache">
<script type="text/javascript" src="js/jquery1.4.2.js"></script>
<!--**********Begin - jQuery YoxView**********-->
<script type="text/javascript" src="js/yoxview/yoxview-init.js"></script>
<script language="javascript" type="text/javascript">
$(document).ready(function(){
$("#gallery").yoxview();
});
</script>
<!--**********End - jQuery YoxView**********-->
<style type="text/css">
* {
margin:0;
padding:0;
outline:none;
}
html {
color:black;
background-color:white;
font: normal normal normal 12px Verdana;
/*font-style font-variant font-weight font-size font-family*/
}
img {
border:none;
}
ul#gallery {
overflow:hidden;
list-style-type:none;
width:1000px;
margin:10px auto;
}
ul#gallery li {
float:left;
margin-right:5px;
}
</style>
</head>
<body>
<ul id="gallery">
<?php
$pictures = read_images('images/thumbs', array('.jpg', '.jpeg'), 120, 120, 120, 120, 0, 10000);
for ($i = 0; $i < 8; $i++) {
echo '<li>';
echo '<a href="images/big-ones/'.$pictures[$i].'">';
echo '<img src="images/thumbs/'.$pictures[$i].'" alt="" title="'.$pictures[$i].'" />';
echo '</a>';
echo '</li>'."\r\n";
}
?>
</ul>
</body>
</html>
Cu ajutorul functiei PHP read_images() citesc dinamic thumbnail-urile de pe server.
Publica acest articol pe Twitter
Articole asemanatoare: