Back to top

Autore Topic: Modifica slideshow template  (Letto 3735 volte)

Offline Blodoks

  • Nuovo arrivato
  • *
  • Post: 49
    • Mostra profilo
Modifica slideshow template
« il: 23 Gen 2013, 11:09:40 »
Salve genti!
Sto usando il template


http://www.joomla.it/anteprima-template-16/5526-md-urban.html


ma il mio problema è il fatto che la slide del template (NON è un modulo) appare su tutte le pagine. Vorrei farla apparire solo in home o in alternativa, eliminarla del tutto e sostituirla con un modulo, forse più gestibile.
Immagino io debba agire sul template.css ma anche dopo aver fatto qualche prova non ho ottenuto risultati.


Qualche aiutino??
Vi riporto la parte del css inerente la slideshow...


Codice: [Seleziona]




/** Slideshow **/
#wrapper-slide{
float:left;
width:670px;
height:345px;
background:transparent;


}


#slide-bg{
float:left;
width:670px;
height:345px;
background: #969696;


}


#slide {
float:left;
width:670px;
height:453px !important;
background: url(../images/slide.jpg) no-repeat 0 0 ;
margin-top:10px;
margin-left:10px;
position:relative;
padding:0;


}


#slideshow-w {
float:left;
width:670px;
height:453px !important;
margin:5px 0 0 5px;


}


#slideshow {
float:left;
width:670px;
height:453px;
background:transparent;
position:relative;


}


.slideshowlite {
float:left !important;
width: 9px;
height: 280px;
padding:0;
margin:0;


}


.slideshowlite a {
position:absolute;
left:0;
z-index: 5;
text-align:left;


}


.slideshowlite img {
border: none;
z-index:5;
margin:0;
padding:0;


}


.slideshowlite ul {
position: absolute;
margin-top: 335px;
left:560px !important;
 z-index: 9;
list-style-type:none;
background:transparent;
width:75px;
height:25px;




}


.slideshowlite ul li,
.slideshowlite ol li {
float: left;
width: 14px;
padding: 0 2px 0 2px;
margin:0;
list-style-type:none;
border:none !important;


}


 .slideshowlite ul li a {
background: url(../images/radio.png) 0 0 no-repeat;
 position: relative;
display: block;
width: 14px !important;
height: 14px !important;
float: left;
line-height: 23px;
text-decoration: none;
text-align: center !important;
font-size: 12px;
 font-weight: bold;
color: #fff !important;
border:none !important;
text-indent:-5000px;
margin-top:5px;
margin-left:0;


}


.slideshowlite ul li a.current {
background: url(../images/current.jpg) 0 0 no-repeat;


}


.slideshowlite ul li a:hover {
background: url(../images/current.jpg) 0 0 no-repeat;


}
 
.slideshowlite ol {
display: none;


}




AIUTO!! :(
« Ultima modifica: 23 Gen 2013, 14:53:27 da Blodoks »

adottauncane

  • Visitatore
Re:Modifica slideshow template
« Risposta #1 il: 23 Gen 2013, 12:08:35 »
Ciao Blodoks,
è sul file index.php del template che puoi creare una nuova posizione o mettere la slide solo in prima pagina.

Per il secondo caso comprendi il codice dell'index dentro queste due righe:

Codice: [Seleziona]
<?php if (JRequest::getVar('view') == 'featured')  {?>

codice slide

<?php ?>

Per il prino segui questo wiki:
http://wiki.joomla.it/index.php?title=Come_aggiungo_nuove_posizioni_modulo%3F

Non inserire codice se non richiesto e se devi usa il tastino #
Grazie mille.



Offline Blodoks

  • Nuovo arrivato
  • *
  • Post: 49
    • Mostra profilo
Re:Modifica slideshow template
« Risposta #2 il: 23 Gen 2013, 14:50:23 »
Ho fatto come hai detto tu ma mi resta il riquadro con le foto, è sparita solamente la cornice che conteneva la slideshow...


Dannazione, inizio ad odiarla! :/


C'è un altro file in    "templates/md-urban/js/"  denominato Slideshow.js

Ecco il contenuto...

Codice: [Seleziona]
/**
 * Slideshow Lite plugin for jQuery
 *
 * v0.5.3
 *
 * Copyright (c) 2009 Fred Wu
 *
 * Dual licensed under the MIT and GPL licenses:
 *   http://www.opensource.org/licenses/mit-license.php
 *   http://www.gnu.org/licenses/gpl.html
 */
/**
 * Configuration options:
 *
 * pauseSeconds  float    number of seconds between each photo to be displayed
 * fadeSpeed     float    number of seconds for the fading transition, the value should not exceed 'pauseSeconds'
 * width         integer  width of the slideshow, in pixels
 * height        integer  height of the slideshow, in pixels
 * caption       boolean  display photo caption?
 * cssClass      string   name of the CSS class, defaults to 'slideshowlite'
 */
(function($){
   $.fn.slideshow = function(options){
      var defaults = {
         pauseSeconds: 8,
         fadeSpeed: 0.5,
         width: 495,
         height: 230,
         caption: true,
         cssClass: 'slideshowlite'
      };
      var options = $.extend(defaults, options);
      // ----------------------------------------
      // slideshow objects and variables
      // ----------------------------------------
      var target = this;
      var items  = $(target).children("a");
      var instance;
      // ----------------------------------------
      // some mandontory styling
      // ----------------------------------------
      if ( ! $(this).hasClass(options.cssClass)) $(this).addClass(options.cssClass);
      $(this).css({
         width: options.width + "px",
         height: options.height + "px"
      });
      // ----------------------------------------
      // create anchor links to make the structure simpler for manupilation
      // ----------------------------------------
      $(this).children("img").wrap(document.createElement("a"));
      $(this).children("a").attr("target", "blank");
      // ----------------------------------------
      // add item sequence markups
      // ----------------------------------------
      var i = 1;
      $(this).children("a").each(function(){
         $(this).attr("rel", i++);
      });
      // ----------------------------------------
      // create pagination and caption
      // ----------------------------------------
      $(this).append("<ul></ul>");
      $(this).append("<ol></ol>");
      var pagination = $(this).children("ul");
      var caption = $(this).children("ol");
      var i = 1;
      var j = 0;
      $(this).children("a").each(function(){
         pagination.append("<li><a href=\"#\">" + i++ + "</li>");
         caption.append("<li>" + $("#" + $(target).attr("id") + " img:nth(" + j++ + ")").attr("alt") + "</li>");
      });
      pagination.fadeTo(0, 1);
      caption.fadeTo(0, 0.6);
      caption.hide();
      // ----------------------------------------
      // shortcuts
      // ----------------------------------------
      var firstItem   = $(target).children("a:first");
      var lastItem    = $(target).children("a:last");
      var currentItem = firstItem;
      // ----------------------------------------
      // pagination highlight
      // ----------------------------------------
      var paginationHighlight = function(sequence){
         pagination.children("li").children("a").removeClass("current");
         pagination.children("li").children("a:nth(" + sequence + ")").addClass("current");
      }
      // ----------------------------------------
      // caption
      // ----------------------------------------
      var showCaption = function(sequence){
         caption.show();
         caption.children("li").hide();
         caption.children("li:nth(" + sequence + ")").fadeIn();
      }
      // ----------------------------------------
      // slideshow logic
      // ----------------------------------------
      var makeSlideshow = function(){
         // pagination click
         pagination.children("li").children("a").click(function(){
            if ( ! $(this).hasClass("current"))
            {
               // select the current item after the pagination click
               currentItem = $(target).children("a:nth(" + ($(this).text()-1) + ")");
               currentItem.show();
               startSlideshow();
            }
         });
         // pagination highlight
         paginationHighlight(currentItem.attr("rel")-1);
         // show caption
         if (options.caption == true)
         {
            showCaption(currentItem.attr("rel")-1);
         }
         // show the current slide
         currentItem.fadeIn(options.fadeSpeed*1000, function(){
            $(target).children("a").hide();
            $(this).show().css("z-index", 1);
         });
         // prepare for the next slide
         // determines the next item (or we need to rewind to the first item?)
         if (currentItem.children("img").attr("src") == lastItem.children("img").attr("src"))
         {
            currentItem = firstItem;
            currentItem.css("z-index", 2);
         }
         else
         {
            currentItem = currentItem.next();
         }
      };
      var startSlideshow = function(){
         clearInterval(instance);
         makeSlideshow();
         instance = setInterval(makeSlideshow, options.pauseSeconds*1000);
      };
      // ----------------------------------------
      // start the slideshow!
      // ----------------------------------------
      startSlideshow();
   };
})(jQuery);



Ho provato a modificarlo ma non riesco comunque a farlo sparire![/code]
« Ultima modifica: 23 Gen 2013, 14:53:55 da Blodoks »

Offline Blodoks

  • Nuovo arrivato
  • *
  • Post: 49
    • Mostra profilo
Re:Modifica slideshow template
« Risposta #3 il: 23 Gen 2013, 15:05:26 »
Non vorrei aver sbagliato io qualcosa, tu che intendi per comprenderlo nell'index?
L'ho compreso nel codice dell'index.php del template, se intendevi questo allora non funge :(

adottauncane

  • Visitatore
Re:Modifica slideshow template
« Risposta #4 il: 23 Gen 2013, 17:42:32 »
Apri l'index.php del template e la prima riga provi a metterla prima di questo codice, la seconda alla fine.

Codice: [Seleziona]
<script type="text/javascript" src="templates/<?php echo $this->template ?>/js/slideshow.js"></script>
    <script type="text/javascript" charset="utf-8">       
        var $j = jQuery.noConflict();             
            $j(document).ready(function(){           
            $j("#slideshow").slideshow({               
                 pauseSeconds:5,               
                 height:334,                 
                 fadeSpeed:0.5,               
                 width:681,                 
                 caption: true           
             });       
         });   
     </script>   

Offline Blodoks

  • Nuovo arrivato
  • *
  • Post: 49
    • Mostra profilo
Re:Modifica slideshow template
« Risposta #5 il: 29 Gen 2013, 10:13:46 »
Ho provato ma mi riporta un "Parse error: syntax error, unexpected '<' in /web/htdocs/www.alpi-ts.it/home/joomla/templates/md-urban/index.php on line 12"
[/size]
[/size]Dannato template! >:(
Vi riporto il file index.php, non vorrei ci fosse qualcosa da modificare li dentro..


[/size]
Codice: [Seleziona]

<?php


#####################################################
# #
Copyright  Magnolia Design - 2012 #
# Author Ozz #
Website http://www.magnolia-design.eu #
# #
#####################################################


defined'_JEXEC' ) or die( 'Restricted access' );
$LeftMenuOn = ($this->countModules('position-4') or $this->countModules('position-5') or $this->countModules('position-7'));
$RightMenuOn = ($this->countModules('position-6') or $this->countModules('position-8'));
$TopNavOn = ($this->countModules('position-13'));
$conf =& JFactory::getConfig();
$sitename $conf->getValue('config.sitename');
$logopath $this->baseurl '/templates/' $this->template '/images/logo.png';
$logo $this->params->get('logo'$logopath);
$logoimage $this->params->get('logoimage');
$sitetitle $this->params->get('sitetitle');
$sitedescription $this->params->get('sitedescription');
?>

<!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" xml:lang="<?php echo $this->language?>" lang="<?php echo $this->language?>" >
<head>
<jdoc:include type="head" />
<link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/system/css/system.css" type="text/css" />
<link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/system/css/general.css" type="text/css" />
<link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/<?php echo $this->template?>/css/template.css" type="text/css" />
<link href='http://fonts.googleapis.com/css?family=Droid+Sans:400,700' rel='stylesheet' type='text/css' />
<script type="text/javascript" src="<?php echo $this->baseurl ?>/templates/<?php echo $this->template?>/js/sfhover.js"></script>
<script type="text/javascript" src="templates/<?php echo $this->template ?>/js/jquery.js"></script>
<script type="text/javascript" src="templates/<?php echo $this->template ?>/js/slideshow.js"></script>
<script type="text/javascript" charset="utf-8">    
var $j = jQuery.noConflict();
$j(document).ready(function(){    
$j("#slideshow").slideshow({    
  pauseSeconds:5,    
  height:334,    
  fadeSpeed:0.5,
  width:681,    
  caption: true    
  });
  });
  </script>
</head>
<body>
<div id="wrapper">
<!-- TopNav -->
<?php if($TopNavOn ): ?>
<div id="topnav_wrap">
<div id="topnav">
<jdoc:include type="modules" name="position-13" style="xhtml" />
<>
<>
<?php endif; ?>



<div id="header_wrap">
<div id="header">


<!-- Logo -->
<div id="logo">


<?php if ($logo && $logoimage == 1): ?>
<a href="<?php echo $this->baseurl ?>"><img src="<?php echo htmlspecialchars($logo); ?>"  alt="<?php echo $sitename?>" /></a>
<?php endif; ?>
<?php if (!$logo || $logoimage == 0): ?>


<?php if ($sitetitle): ?>
<a href="<?php echo $this->baseurl ?>"><?php echo htmlspecialchars($sitetitle); ?></a><br/>
<?php endif; ?>


<?php if ($sitedescription): ?>
<div class="sitedescription"><?php echo htmlspecialchars($sitedescription); ?><>
<?php endif; ?>


<?php endif; ?>


  <>


<!-- Search -->
<div id="search">
<jdoc:include type="modules" name="position-0" />
<>
<>
<>

<div id="topmenu_wrap">
<div id="topmenu">
<jdoc:include type="modules" name="position-1" />
<>
<>



<!-- Content/Menu Wrap -->
<div id="content-menu_wrap_bg">
<div id="content-menu_wrap">


<!-- Breadcrumbs -->
<?php if ($this->countModules('position-2')): ?>
<div id="breadcrumbs">
<jdoc:include type="modules" name="position-2" />
<>
<?php endif; ?>




<!-- Left Menu -->
<?php if($LeftMenuOn ): ?>
<div id="leftmenu">
<jdoc:include type="modules" name="position-7" style="xhtml" />
<jdoc:include type="modules" name="position-4" style="xhtml" />
<jdoc:include type="modules" name="position-5" style="xhtml" />
<>
<?php endif; ?>




<!-- Right Menu -->
<?php if($RightMenuOn ): ?>
<div id="rightmenu">
<jdoc:include type="modules" name="position-6" style="xhtml" />
<jdoc:include type="modules" name="position-8" style="xhtml" />
<jdoc:include type="modules" name="position-3" style="xhtml" />
<>
<?php endif; ?>


<div id="wrapper-slide">    
            <div id="slide-bg">        
                <div class="pagewidth">        
                    <div id="slide">            
                        <div id="slideshow-w">        
                            <div id="slideshow">            
                                <img src="templates/<?php echo $this->template ?>/images/slide1.png" alt="image1" />        
                                <img src="templates/<?php echo $this->template ?>/images/slide2.png" alt="image2" />        
                                <img src="templates/<?php echo $this->template ?>/images/slide3.png" alt="image3" />
                            <>        
                        <>    
                    <>        
                <>
            <>
<>

<!-- Contents -->
<?php if($LeftMenuOn AND $RightMenuOn): ?>
<div id="content-w1">
<?php elseif($LeftMenuOn OR $RightMenuOn): ?>
<div id="content-w2">
<?php else: ?>
<div id="content-w3">
<?php endif; ?>
<jdoc:include type="message" />
<jdoc:include type="component" />
<>


<>
<>




<!-- Footer -->
<div id="footer_wrap">
<div id="footer">
<jdoc:include type="modules" name="position-14" />
<>
<>



<!-- Banner/Links -->
<div id="box_wrap">
<div id="box1"><jdoc:include type="modules" name="position-9" style="xhtml" /><>
<div id="box2"><jdoc:include type="modules" name="position-10" style="xhtml" /><>
<div id="box3"><jdoc:include type="modules" name="position-11" style="xhtml" /><>
<>



<div id="push"><>


<>




<?php /* --->>>   Please support our work by leaving this copyright section intact   */ ?>
<div id="copyright">
&copy;<?php echo date('Y'); ?> <?php echo $sitename?> | <a href="http://www.magnolia-design.eu">Designed by Magnolia Design</a><br/>


<?php /* <<<---   Please support our work by leaving this copyright section intact   */ ?>


<>


</body>
</html>

Offline Blodoks

  • Nuovo arrivato
  • *
  • Post: 49
    • Mostra profilo
Re:Modifica slideshow template
« Risposta #6 il: 30 Gen 2013, 18:28:12 »
Ho risolto cambiando template...
Tanto per dare una risposta ad eventuali altri lettori... nel template "nuovo" avevo lo stesso problema ma seguendo i consigli sopra riportati, il problema si è risolto...sono riuscito a disabilitare lo slider automatico ed ho inserito uno personalizzato.


Grazie a tutti!!

 



Web Design Bolzano Kreatif