Tutoriale Web Design, Wordpress si SEO

Tutoriale Web Design:CSS, Dreamweaver, Photoshop, Web 2.0 dar si Tutoriale Wordpress si SEO

Imagini RSS slideshow

Autor admin • Feb 14th, 2008 • Categorie: Noutati, Scripts, Tutoriale Wordpress • Comentarii « Nici un comentariu »

Azi m-am jucat un pic cu rss si javascript. Asa ca v-am inclus in blog colt dreapta un php ce contine codul javascript ptr imaginile slideshow (albastru, portocaliu, roz) cu link catre abonarea feed-urilor blogului prin feedburner.

Pentru cine doreste sa realizeze in fisierul unde doriti sa apara slideshow-ul introduceti codul:


<?php include (TEMPLATEPATH . '/rss.php'); ?>

Dupa care realizati un fisier rss.php in care introduceti urmatorul cod:


<script type="text/javascript">
theimage = new Array();
// Puneti imaginile voastre(veziimagineata1.png etc) si folderul in care sunt imaginile voastre(cazul meu images): theimage[...]=[image URL (unde incepe <a href cu pauze), link URL(exemplu http : //f eeds etc), name/description(textul Subscribe in a reader)] si atentie am pus pauze la link-uri pentru a putea vedea clar unde trebuie sa va puneti link-ul dorit
theimage[0]=[”<?php bloginfo(’template_url’); ?>/images/imagineata1.png”, “< a href = ” h t t p : // feeds . feedburner . com / feedname ” > h t t p : // feeds. feedburner. com/ feedname < / a> “, “Subscribe in a reader”];
theimage[1]=[”<?php bloginfo(’template_url’); ?>/images/imagineata2.jpg”, “< a href = ” h t t p : // feeds. feedburner. com / feedname ” > h t t p : // feeds . feedburner . com/ feedname “< / a >” , “Subscribe in a reader”];
theimage[2]=[”<?php bloginfo(’template_url’); ?>/images/imagineata3.jpg”, “< a href = ” h t t p : // feeds . feedburner. com/ feedname” > h t t p : // feeds. feedburner . com/feedname < / a >” , “Subscribe in a reader”];
///// Plugin variables playspeed=2000;// The playspeed determines the delay for the “Play” button in ms
//#####
//key that holds where in the array currently are
i=0;
//###########################################
//if random
function SetRandom() {
 tempimage = new Array();
 for(p=0; p<theimage.length; p++){
  for(p1=0; p1>-1; p1) {
  tempNum = Math.floor(Math.random()*theimage.length)
  if(!tempimage[tempNum]){
  tempimage[tempNum]=theimage[p];
  break;
  }
  }
 }
 for(p=0;p<theimage.length;p++)theimage[p]=tempimage[p];
}
//if random order
SetRandom()
//###########################################
window.onload=function(){
//set the first slide
 SetSlide(0);
//autoplay
 PlaySlide();
}

//###########################################
function SetSlide(num) {
 //too big
 i=num%theimage.length;
 //too small
 if(i<0)i=theimage.length-1;

//switch the image
 document.images.imgslide.src=theimage[i][0];

//if they want name of current slide
 document.getElementById('slidebox').innerHTML=theimage[i][2];

}
//###########################################
function PlaySlide() {
 if (!window.playing) {
  PlayingSlide(i+1);
  if(document.slideshow.play){
  document.slideshow.play.value=" Stop ";
  }
 }
 else {
  playing=clearTimeout(playing);
  if(document.slideshow.play){
  document.slideshow.play.value=" Play ";
  }
 }
 // if you have to change the image for the "playing" slide
 if(document.images.imgPlay){
  setTimeout('document.images.imgPlay.src="'+imgStop+'" mce_src="'+imgStop+'"',1);
  imgStop=document.images.imgPlay.src
 }
}
//###########################################
function PlayingSlide(num) {
 playing=setTimeout('PlayingSlide(i+1);SetSlide(i+1);', playspeed);
}
</script>
<!-- slide show HTML -->
<form name="slideshow">

<table border="0" cellpadding="3" cellspacing="0">
<tr>
 <td align="center">
 < a href =" # " onmouseover="this.href=theimage[i][1];return false">
 <script type="text/javascript">
  document.write('<img name="imgslide" id="imgslide" src="'+theimage[0][0]+'" border="0">')
 </script>
 </a>
 </td>
</tr>
<tr>
 <td align="center"><div id="slidebox"></div></td>
</tr>
</table>

</form>
<!-- end of slide show HTML -->

Tagged as:

Articole asemanatoare:

  • Relatia client - web designer
  • Random image/ Imagini luate la intamplare
  • Inserarea imaginilor in Dreamweaver
  • Footer in blog wordpress
  • Layout Photoshop - export CSS si HTML
  • admin is Ana Design. V-a placut tot ce v-am recomandat in tutorial? Atunci nu uitati sa faceti un link catre articol si bookmark it!
    Email this author | Toate articolele scrise de admin

    Lasa un comentariu sau Parerea ta despre acest subiect

    Trebuie sa te autentifici pentru a lasa un comentariu.