Joomla.it Forum

Joomla! 1.0.x (versione con supporto terminato) => Le voci di Joomla.it (solo per versione Joomla 1.0.x) => I Template di Joomla 1.0.x => : meteoloco 17 May 2008, 15:54:06

: Personalizzare Template JS Education (Joomlashack)
: meteoloco 17 May 2008, 15:54:06
Vorrei personalizzare il suddetto template
http://www.cisterpingpong.altervista.org

Inserendo nell'Header un'immagine, cosa non prevista dall'autore del Template stesso.
Dove devo agire? Sul file CSS?
Grazie per l'aiuto
: Re: Personalizzare Template JS Education (Joomlashack)
: meteoloco 17 May 2008, 16:42:19
Forse dovrei inserire un blocco nell'index.php a cui associare l'immagine dell'header che voglio aggiungere al template?
: Re: Personalizzare Template JS Education (Joomlashack)
: blackhorse 17 May 2008, 16:46:50
si certo, se non è previsto puoi inserire o un'immagine direttamente nell'index o una posizione per un modulo es. header che poi potrai gestire dal pannello di controllo.
: Re: Personalizzare Template JS Education (Joomlashack)
: meteoloco 17 May 2008, 16:52:22
Per inserire l'immagine direttamente nell'index, in che posizione del codice vado a metterla?

:
<?php
defined( '_VALID_MOS' ) or die( 'Restricted access' );

// load in some required files
require_once('js_template_config.php');

$school = $mosConfig_live_site . '/templates/' . $mainframe->getTemplate();
$iso = split( '=', _ISO );
$charset = ($force_utf8) ? 'charset=utf-8' : _ISO;
 ?>
<!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>
<meta http-equiv="Content-Type" content="text/html; <?php echo $charset; ?>" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<?php
if ( $my->id ) initEditor();
mosShowHead();
?>
<link rel="stylesheet" href="<?php echo $school; ?>/css/template_css.css" media="screen" type="text/css" />

<?php if($load_lightbox){ ?>
<script type="text/javascript" src="<?php echo $school;?>/js/prototype.lite.js"></script>
<script type="text/javascript" src="<?php echo $school;?>/js/moo.fx.js"></script>
<script type="text/javascript" src="<?php echo $school;?>/js/litebox-1.0.js"></script>
<link rel="stylesheet" href="<?php echo $school; ?>/css/lightbox.css" type="text/css" />
<?php } ?>
<script language="javascript" type="text/javascript" src="<?php echo $school;?>/js/styleswitcher.js"></script>
</head>
<body onload="initLightbox();" id="pagebg">
<script type="text/javascript">js_init();</script>
<table width="100%" border="0" cellspacing="0" cellpadding="0" class="table-wrapper">
  <tr>
    <td valign="top">
<div id="site-container">
<div id="container">
<div id="header">


<div id="header-functions">
<?php if($use_font_switcher){?>
<a href="index.php" title="Increase Text Size" onclick="changeFontSize(1);return false;"><img src="<?php echo $mosConfig_live_site;?>/templates/<?php echo $mainframe->getTemplate();?>/images/larger.png" alt="larger" width="37" height="26" border="0" /></a>
<a href="index.php" title="Decrease Text Size" onclick="changeFontSize(-1);return false;"><img src="<?php echo $mosConfig_live_site;?>/templates/<?php echo $mainframe->getTemplate();?>/images/smaller.png" alt="smaller" width="37" height="26" border="0" /></a>
<a href="index.php" title="Revert text styles to default" onclick="revertStyles(); return false;"><img src="<?php echo $mosConfig_live_site;?>/templates/<?php echo $mainframe->getTemplate();?>/images/reset.png" alt="reset" width="57" height="26" border="0" /></a>
<?php } ?>
<p class="date"><?php echo date('l, F dS Y'); ?></p>
<?php if(mosCountModules('inset')) { ?>
<?php mosLoadModules('inset', -2); ?>
<?php } ?>
</div>


<div class="header-logo">
<h1><a href="<?php echo $mosConfig_live_site;?>/index.php?option=com_frontpage&amp;Itemid=1" title="<?php echo $mosConfig_sitename; ?>">Education</a></h1>
<h2>Template Demo</h2>
</div>


<?php if (mosCountModules('top')) { ?>
<div id="navcontainer">
<div id="navbar">
<script type="text/javascript">
<!--//--><![CDATA[//><!--
navHover = function() {
var lis = document.getElementById("navbar").getElementsByTagName("LI");
for (var i=0; i<lis.length; i++) {
lis[i].onmouseover=function() {
this.className+=" sfhover";
}
lis[i].onmouseout=function() {
this.className=this.className.replace(new RegExp(" sfhover\\b"), "");
}
}
}
if (window.attachEvent) window.attachEvent("onload", navHover);
//--><!]]>
</script>
<?php mosLoadModules ( 'top',-1 ); ?>
</div>
</div>
<?php } ?>

</div><!-- /header -->

<div id="content-container" class="clearfix">
<table width="100%" cellspacing="0" cellpadding="0" style="height:100%;">
<tr valign="top">
<?php if (mosCountModules('left')) { ?>
<td id="left_sidebar">
<?php mosLoadModules( 'left', -2 );?>
    </td><!-- end #left_sidebar -->
<?php } ?>

<td id="main_content">
<?php mosMainBody(); ?>
</td><!-- end #main_content -->

<?php if (mosCountModules('right')) { ?>
<td id="right_sidebar">
<?php mosLoadModules( 'right', -2 );?>
    </td><!-- end #right_sidebar -->
<?php } ?>
</tr>
</table>
</div>
</div><!-- /container -->
</div><!-- /site-container -->



<?php if (mosCountModules('user1') || mosCountModules('user2') || mosCountModules('user3')) { ?>
<div id="lower-content">
<div class="lower-content-container">
<table width="100%" cellspacing="0" cellpadding="0" style="height:100%;">
<tr valign="top">
<?php if (mosCountModules('user1')) { ?>
<td id="leftcol">
<?php mosLoadModules( 'user1', -2 );?>
</td>
<?php } ?>
<?php if (mosCountModules('user2')) { ?>
<td id="maincol">
<?php mosLoadModules( 'user2', -2 );?>
</td>
<?php } ?>
<?php if (mosCountModules('user3')) { ?>
<td id="rightcol">
    <?php mosLoadModules( 'user3', -2 );?>
</td>
<?php } ?>
</tr>
</table>
</div>
</div>

<?php } ?>

</td>
  </tr>
  <tr>
  <td>
  </td>
  </tr>
</table>
<div class="footer">
<?php mosLoadModules ( 'footer',-1); ?>
</div>
<div class="designer"><?php include($mosConfig_absolute_path."/templates/" . $mainframe->getTemplate() . "/js/template.css.php"); ?></div>
</body>
</html>
: Re: Personalizzare Template JS Education (Joomlashack)
: blackhorse 17 May 2008, 17:07:48
dovrebbe essere dentro il div header
: Re: Personalizzare Template JS Education (Joomlashack)
: meteoloco 17 May 2008, 17:14:26
Ho inserito nel div header, (dopo aver creato il blocco header2 nel pannello di controllo, e aver associato il modulo del logo al    blocco suddetto), ma il logo viene troppo in basso

http://www.cisterpingpong.altervista.org/

:
<?php
defined( '_VALID_MOS' ) or die( 'Restricted access' );

// load in some required files
require_once('js_template_config.php');

$school = $mosConfig_live_site . '/templates/' . $mainframe->getTemplate();
$iso = split( '=', _ISO );
$charset = ($force_utf8) ? 'charset=utf-8' : _ISO;
 ?>
<!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>
<meta http-equiv="Content-Type" content="text/html; <?php echo $charset; ?>" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<?php
if ( $my->id ) initEditor();
mosShowHead();
?>
<link rel="stylesheet" href="<?php echo $school; ?>/css/template_css.css" media="screen" type="text/css" />

<?php if($load_lightbox){ ?>
<script type="text/javascript" src="<?php echo $school;?>/js/prototype.lite.js"></script>
<script type="text/javascript" src="<?php echo $school;?>/js/moo.fx.js"></script>
<script type="text/javascript" src="<?php echo $school;?>/js/litebox-1.0.js"></script>
<link rel="stylesheet" href="<?php echo $school; ?>/css/lightbox.css" type="text/css" />
<?php } ?>
<script language="javascript" type="text/javascript" src="<?php echo $school;?>/js/styleswitcher.js"></script>
</head>
<body onload="initLightbox();" id="pagebg">
<script type="text/javascript">js_init();</script>
<table width="100%" border="0" cellspacing="0" cellpadding="0" class="table-wrapper">
  <tr>
    <td valign="top">
<div id="site-container">
<div id="container">
<div id="header">


<div id="header-functions">
<?php if($use_font_switcher){?>
<a href="index.php" title="Increase Text Size" onclick="changeFontSize(1);return false;"><img src="<?php echo $mosConfig_live_site;?>/templates/<?php echo $mainframe->getTemplate();?>/images/larger.png" alt="larger" width="37" height="26" border="0" /></a>
<a href="index.php" title="Decrease Text Size" onclick="changeFontSize(-1);return false;"><img src="<?php echo $mosConfig_live_site;?>/templates/<?php echo $mainframe->getTemplate();?>/images/smaller.png" alt="smaller" width="37" height="26" border="0" /></a>
<a href="index.php" title="Revert text styles to default" onclick="revertStyles(); return false;"><img src="<?php echo $mosConfig_live_site;?>/templates/<?php echo $mainframe->getTemplate();?>/images/reset.png" alt="reset" width="57" height="26" border="0" /></a>
<?php } ?>
<p class="date"><?php echo date('l, F dS Y'); ?></p>
<?php if(mosCountModules('inset')) { ?>
<?php mosLoadModules('inset', -2); ?>
<?php } ?>
</div>


<div class="header-logo">
<h1><a href="<?php echo $mosConfig_live_site;?>/index.php?option=com_frontpage&amp;Itemid=1" title="<?php echo $mosConfig_sitename; ?>">Education</a></h1>
<h2>Template Demo</h2>
                                <?php mosLoadModules ( 'header2'); ?>
</div>


<?php if (mosCountModules('top')) { ?>
<div id="navcontainer">
<div id="navbar">
<script type="text/javascript">
<!--//--><![CDATA[//><!--
navHover = function() {
var lis = document.getElementById("navbar").getElementsByTagName("LI");
for (var i=0; i<lis.length; i++) {
lis[i].onmouseover=function() {
this.className+=" sfhover";
}
lis[i].onmouseout=function() {
this.className=this.className.replace(new RegExp(" sfhover\\b"), "");
}
}
}
if (window.attachEvent) window.attachEvent("onload", navHover);
//--><!]]>
</script>
<?php mosLoadModules ( 'top',-1 ); ?>
</div>
</div>
<?php } ?>

</div><!-- /header -->

<div id="content-container" class="clearfix">
<table width="100%" cellspacing="0" cellpadding="0" style="height:100%;">
<tr valign="top">
<?php if (mosCountModules('left')) { ?>
<td id="left_sidebar">
<?php mosLoadModules( 'left', -2 );?>
    </td><!-- end #left_sidebar -->
<?php } ?>

<td id="main_content">
<?php mosMainBody(); ?>
</td><!-- end #main_content -->

<?php if (mosCountModules('right')) { ?>
<td id="right_sidebar">
<?php mosLoadModules( 'right', -2 );?>
    </td><!-- end #right_sidebar -->
<?php } ?>
</tr>
</table>
</div>
</div><!-- /container -->
</div><!-- /site-container -->



<?php if (mosCountModules('user1') || mosCountModules('user2') || mosCountModules('user3')) { ?>
<div id="lower-content">
<div class="lower-content-container">
<table width="100%" cellspacing="0" cellpadding="0" style="height:100%;">
<tr valign="top">
<?php if (mosCountModules('user1')) { ?>
<td id="leftcol">
<?php mosLoadModules( 'user1', -2 );?>
</td>
<?php } ?>
<?php if (mosCountModules('user2')) { ?>
<td id="maincol">
<?php mosLoadModules( 'user2', -2 );?>
</td>
<?php } ?>
<?php if (mosCountModules('user3')) { ?>
<td id="rightcol">
    <?php mosLoadModules( 'user3', -2 );?>
</td>
<?php } ?>
</tr>
</table>
</div>
</div>

<?php } ?>

</td>
  </tr>
  <tr>
  <td>
  </td>
  </tr>
</table>
<div class="footer">
<?php mosLoadModules ( 'footer',-1); ?>
</div>
<div class="designer"><?php include($mosConfig_absolute_path."/templates/" . $mainframe->getTemplate() . "/js/template.css.php"); ?></div>
</body>
</html>
: Re: Personalizzare Template JS Education (Joomlashack)
: blackhorse 17 May 2008, 17:23:48
lo devi mettere prima di tutti dove inizia il div header e non alla fine ed eventualmente levare il richiamo al nome del sito
: Re: Personalizzare Template JS Education (Joomlashack)
: meteoloco 17 May 2008, 19:01:49
: blackhorse  17 May 2008, 17:23:48
lo devi mettere prima di tutti dove inizia il div header e non alla fine ed eventualmente levare il richiamo al nome del sito
Ho eliminato il richiamo al nome del sito, ma non basta, il logo risulta allineato sempre troppo in basso....
: Re: Personalizzare Template JS Education (Joomlashack)
: blackhorse 17 May 2008, 19:11:39
rimetti il tuo index se no non posso vedere le modifiche che hai fatto.

oppure nel css visto che c'è un div header prova a dargli un'immagine di sfondo.
: Re: Personalizzare Template JS Education (Joomlashack)
: meteoloco 17 May 2008, 19:22:42
Ho provato a inserire l'immagine di background nel CSS cosi

#header {

   position:relative;

   height:122px;

        background:url(../images/top_home.jpg) 100% no-repeat;

   }

Ma mi sballa tutto il sito, come mai?

http://www.cisterpingpong.altervista.org/index.php

Questo è l'attuale index.php

:
<?php
defined( '_VALID_MOS' ) or die( 'Restricted access' );

// load in some required files
require_once('js_template_config.php');

$school = $mosConfig_live_site . '/templates/' . $mainframe->getTemplate();
$iso = split( '=', _ISO );
$charset = ($force_utf8) ? 'charset=utf-8' : _ISO;
 ?>
<!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>
<meta http-equiv="Content-Type" content="text/html; <?php echo $charset; ?>" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<?php
if ( $my->id ) initEditor();
mosShowHead();
?>
<link rel="stylesheet" href="<?php echo $school; ?>/css/template_css.css" media="screen" type="text/css" />

<?php if($load_lightbox){ ?>
<script type="text/javascript" src="<?php echo $school;?>/js/prototype.lite.js"></script>
<script type="text/javascript" src="<?php echo $school;?>/js/moo.fx.js"></script>
<script type="text/javascript" src="<?php echo $school;?>/js/litebox-1.0.js"></script>
<link rel="stylesheet" href="<?php echo $school; ?>/css/lightbox.css" type="text/css" />
<?php } ?>
<script language="javascript" type="text/javascript" src="<?php echo $school;?>/js/styleswitcher.js"></script>
</head>
<body onload="initLightbox();" id="pagebg">
<script type="text/javascript">js_init();</script>
<table width="100%" border="0" cellspacing="0" cellpadding="0" class="table-wrapper">
  <tr>
    <td valign="top">
<div id="site-container">
<div id="container">
<div id="header">


<div id="header-functions">
<?php if($use_font_switcher){?>
<a href="index.php" title="Increase Text Size" onclick="changeFontSize(1);return false;"><img src="<?php echo $mosConfig_live_site;?>/templates/<?php echo $mainframe->getTemplate();?>/images/larger.png" alt="larger" width="37" height="26" border="0" /></a>
<a href="index.php" title="Decrease Text Size" onclick="changeFontSize(-1);return false;"><img src="<?php echo $mosConfig_live_site;?>/templates/<?php echo $mainframe->getTemplate();?>/images/smaller.png" alt="smaller" width="37" height="26" border="0" /></a>
<a href="index.php" title="Revert text styles to default" onclick="revertStyles(); return false;"><img src="<?php echo $mosConfig_live_site;?>/templates/<?php echo $mainframe->getTemplate();?>/images/reset.png" alt="reset" width="57" height="26" border="0" /></a>
<?php } ?>
<p class="date"><?php echo date('l, F dS Y'); ?></p>
<?php if(mosCountModules('inset')) { ?>
<?php mosLoadModules('inset', -2); ?>
<?php } ?>
</div>


<div class="header-logo">

                                <?php mosLoadModules ( 'header2'); ?>
</div>


<?php if (mosCountModules('top')) { ?>
<div id="navcontainer">
<div id="navbar">
<script type="text/javascript">
<!--//--><![CDATA[//><!--
navHover = function() {
var lis = document.getElementById("navbar").getElementsByTagName("LI");
for (var i=0; i<lis.length; i++) {
lis[i].onmouseover=function() {
this.className+=" sfhover";
}
lis[i].onmouseout=function() {
this.className=this.className.replace(new RegExp(" sfhover\\b"), "");
}
}
}
if (window.attachEvent) window.attachEvent("onload", navHover);
//--><!]]>
</script>
<?php mosLoadModules ( 'top',-1 ); ?>
</div>
</div>
<?php } ?>

</div><!-- /header -->

<div id="content-container" class="clearfix">
<table width="100%" cellspacing="0" cellpadding="0" style="height:100%;">
<tr valign="top">
<?php if (mosCountModules('left')) { ?>
<td id="left_sidebar">
<?php mosLoadModules( 'left', -2 );?>
    </td><!-- end #left_sidebar -->
<?php } ?>

<td id="main_content">
<?php mosMainBody(); ?>
</td><!-- end #main_content -->

<?php if (mosCountModules('right')) { ?>
<td id="right_sidebar">
<?php mosLoadModules( 'right', -2 );?>
    </td><!-- end #right_sidebar -->
<?php } ?>
</tr>
</table>
</div>
</div><!-- /container -->
</div><!-- /site-container -->



<?php if (mosCountModules('user1') || mosCountModules('user2') || mosCountModules('user3')) { ?>
<div id="lower-content">
<div class="lower-content-container">
<table width="100%" cellspacing="0" cellpadding="0" style="height:100%;">
<tr valign="top">
<?php if (mosCountModules('user1')) { ?>
<td id="leftcol">
<?php mosLoadModules( 'user1', -2 );?>
</td>
<?php } ?>
<?php if (mosCountModules('user2')) { ?>
<td id="maincol">
<?php mosLoadModules( 'user2', -2 );?>
</td>
<?php } ?>
<?php if (mosCountModules('user3')) { ?>
<td id="rightcol">
    <?php mosLoadModules( 'user3', -2 );?>
</td>
<?php } ?>
</tr>
</table>
</div>
</div>

<?php } ?>

</td>
  </tr>
  <tr>
  <td>
  </td>
  </tr>
</table>
<div class="footer">
<?php mosLoadModules ( 'footer',-1); ?>
</div>
<div class="designer"><?php include($mosConfig_absolute_path."/templates/" . $mainframe->getTemplate() . "/js/template.css.php"); ?></div>
</body>
</html>
: Re: Personalizzare Template JS Education (Joomlashack)
: meteoloco 17 May 2008, 19:36:36
Probabilmente devo agire modificando qualcosa qui:


:
/* $2 - Header Styles */



.header-logo {

height:87px;

padding-top:24px;

}

.header-logo h1 a {

color: #FFF;

padding:0;

margin: 0;

font: 38px/38px Georgia, "Times New Roman", Times, serif;

text-decoration: none;

}

.header-logo h2 {

color: #000033;

font: 20px/20px Georgia, "Times New Roman", Times, serif;

padding:0;

margin: 0;

}



#header-functions {

position:absolute;

top:20px;

right:0;

width:250px;

}
: Re: Personalizzare Template JS Education (Joomlashack)
: blackhorse 17 May 2008, 20:20:01
così come è adesso modificando la posizione della data e della funzione dei caratteri non ti va bene?
: Re: Personalizzare Template JS Education (Joomlashack)
: meteoloco 17 May 2008, 21:57:21
: blackhorse  17 May 2008, 20:20:01
così come è adesso modificando la posizione della data e della funzione dei caratteri non ti va bene?
Si, devo solo modificare la posizione della funzione dei caratteri e della data e andrebbe bene...
Agisco sempre in css per farlo?
Grazie cmq per l'aiuto finora
: Re: Personalizzare Template JS Education (Joomlashack)
: meteoloco 17 May 2008, 22:13:06
Ho spostato un po' la posizione della funzione dei caratteri e della data, anche se non riesco più a destra.

Ho modificato questo nel CSS cosi:


#header-functions {

   position:absolute;

   top:65px;

   right:0;

   width:190px;

   }

Top da 20 l'ho portato a 65, width dA 250 A 190.
Tolto il bold dalla data.
Come fare a spostarlo ancora più a destra?

Esiste un modo per tradurre la data?

Grazie mille

: Re: Personalizzare Template JS Education (Joomlashack)
: blackhorse 17 May 2008, 23:02:17
potresti anche modificare l'immagine creando una zona in modo che in quel preciso spazio ci sia un riquadro un colore di sfondo una trasparenza insomma qualcosa per non confondere la data e altro.
: Re: Personalizzare Template JS Education (Joomlashack)
: meteoloco 18 May 2008, 21:31:23
Riuardo l'extended menu, come posso fare per distanziare la tendina dei  sotto menu da quello principale?

Nel caso specifico, ad esempio, passando col mouse su società, Organigramma si apre troppo sopra laq dicitura Società (link www.cisterpingpong.altervista.org)
: Re: Personalizzare Template JS Education (Joomlashack)
: blackhorse 18 May 2008, 22:15:12
sinceramente non mi è mai capitato però credo che ci sia qualche valore da modificare nel css che imposta quella distanza