Back to top

Autore Topic: topmenu come questi  (Letto 9033 volte)

Offline alcor

  • Esploratore
  • **
  • Post: 60
  • Sesso: Maschio
    • Mostra profilo
topmenu come questi
« il: 21 Set 2007, 20:55:54 »
ciao
ragazzi come faccio ad inserire dei top menu tipo questi?
http://www.joomladesigns.co.uk/
http://www.diplod.it/

a me interesserebbe usarlo da solo eliminando il left o right, e questo è facile.
ma come inserisco quel tipo di animazioni e nel posto giusto, facendolo poi riconoscere dal css?
grazie

Offline bigham

  • Global Moderator
  • Instancabile
  • *****
  • Post: 3662
  • Sesso: Maschio
  • Contagiato dalla Joomlaite :)
    • Mostra profilo
Re: topmenu come questi
« Risposta #1 il: 21 Set 2007, 21:24:29 »
Ciao udein

Allora, se vuoi arrivarci da solo e capire come funzionano i template di Joomla  ;D ti consiglio due estensioni per Firefox che sono una meraviglia:


Con questi due componenti aggiuntivi puoi "spulciare" un template fino dei più reconditi meandri  ;D

Se poi vuoi la soluzione:
Installa Web developer toolbar per firefox e dal menù CSS dai View CSS. Ti visualizzerà i CSS utilizzati dal sito.
Le classi che creano il top menù con quell'effetto sono la mainlevel-nav e la menu.
Mi riferisco al top-menu del sito http://www.joomladesigns.co.uk/


Ci sono più cose in cielo e in terra, Orazio, di quante ne sogni la tua filosofia.

Offline alcor

  • Esploratore
  • **
  • Post: 60
  • Sesso: Maschio
    • Mostra profilo
Re: topmenu come questi
« Risposta #2 il: 21 Set 2007, 23:10:47 »
grazie bigham.
si, ho capito più o meno, il mio problema è che non so come posizionarlo nel punto giusto nel css di un'altro template.
ci ho provato ma non appare niente.

Offline bigham

  • Global Moderator
  • Instancabile
  • *****
  • Post: 3662
  • Sesso: Maschio
  • Contagiato dalla Joomlaite :)
    • Mostra profilo
Re: topmenu come questi
« Risposta #3 il: 21 Set 2007, 23:27:19 »
ok.
Allora stai creando un template da zero??

Mettilo immediatamente sotto l'intestazione
Citazione
...

...
<div id="top">
    qui c'è l'intestazione della pagina
</div>
<div id="menu">
    <div id="uls">
       <?php mosLoadModules ('nome_posizione_blocco_modulo',-1); ?>
    </div>
</div>
Il nome della posizione del blocco modulo che conterrà il topmenù lo scegli tu. Puoi usare user1, user2, top. L'importante è che ti ricordi che in quella posizione ci va il topmenù.

Ciao


Ci sono più cose in cielo e in terra, Orazio, di quante ne sogni la tua filosofia.

Offline alcor

  • Esploratore
  • **
  • Post: 60
  • Sesso: Maschio
    • Mostra profilo
Re: topmenu come questi
« Risposta #4 il: 21 Set 2007, 23:42:51 »
allora grazie per l'impegno ma mi sa che in questa fase sono un pò duretto.
tu stai parlando dell'index adesso? io avevo capito che dovevo incollare i tag css presi da quello di esempio, nel css del template che sto usando (e no, non lo sto facendo da zero)
certo io nell'index gli vado a dire dove voglio far apparire il topmenu, ma per far apparire quei tag che ho copiato, in che punto del css li devo incollare?
se vuoi bestemmia pure.. ;D

Offline bigham

  • Global Moderator
  • Instancabile
  • *****
  • Post: 3662
  • Sesso: Maschio
  • Contagiato dalla Joomlaite :)
    • Mostra profilo
Re: topmenu come questi
« Risposta #5 il: 22 Set 2007, 13:15:44 »
 ;D ;D
Non preoccuparti, ho tanta pazienza...

Si, avevo capito male io. Pensavo ti riferissi alla posizione del topmenù nel file index.php.

E, si, devi incollare le classi che ti ho indicato in fondo al css del template, magari controllando prima che non siano già presenti.
Poi modifica le classi secondo le tue esigenze.

Ciao

Ci sono più cose in cielo e in terra, Orazio, di quante ne sogni la tua filosofia.

Offline alcor

  • Esploratore
  • **
  • Post: 60
  • Sesso: Maschio
    • Mostra profilo
Re: topmenu come questi
« Risposta #6 il: 22 Set 2007, 22:10:12 »
grazie bigham
alla fine ce l'ho fatta con varie peripezie e il tuo aiuto.
ora però avrei un'altro piccolo problema.
cioè vorrei utilizzare solo il top menu nascondendo il menu left.

come faccio a far si che i contenuti del mainbody si espandano prendendo lo spazio del menu left che non appare?
so che c'era un modo per farlo.
Grazie mille

Offline bigham

  • Global Moderator
  • Instancabile
  • *****
  • Post: 3662
  • Sesso: Maschio
  • Contagiato dalla Joomlaite :)
    • Mostra profilo
Re: topmenu come questi
« Risposta #7 il: 22 Set 2007, 22:26:55 »
Ciao.

Potresti provare intanto a tolgiere la pubblicazione su tutti i moduli che si trovano nell'area left

Visualizza l'elenco dei moduli, usa il filtro in alto a destra per viusalizzare solo quelli nell'area left e togli a tutti il segno di pubblicazione.
Poi prova a vedere come si vede la pagina.
Ci sono più cose in cielo e in terra, Orazio, di quante ne sogni la tua filosofia.

Offline alcor

  • Esploratore
  • **
  • Post: 60
  • Sesso: Maschio
    • Mostra profilo
Re: topmenu come questi
« Risposta #8 il: 22 Set 2007, 22:46:28 »
ho risolto armeggiando con l'index.php e le tabelle, ho salvato una copia dell'index: index_senza_menuleft.php da usare all'occorrenza.
ora però funziona o senza i laterali e mainbody largo o come prima con l'index originale.

se provo a rimettere qualche modulo left/right ovviamente si spagina.
cosa devo modificare per far si che se volessi aggiungere che so, un modulo per pubblicità in qualche pagina, il mainbody si adatti restringendosi?

Offline bigham

  • Global Moderator
  • Instancabile
  • *****
  • Post: 3662
  • Sesso: Maschio
  • Contagiato dalla Joomlaite :)
    • Mostra profilo
Re: topmenu come questi
« Risposta #9 il: 22 Set 2007, 22:51:35 »
Citazione
se provo a rimettere qualche modulo left/right ovviamente si spagina.
cosa devo modificare per far si che se volessi aggiungere che so, un modulo per pubblicità in qualche pagina, il mainbody si adatti restringendosi?

Scusami, perdono e mi cospargo il campo di cenere ma... non ci sto capendo più niente  ;D

Spiegati meglio.

Prima di smanettare sul template hai provato come ti ho detto io, ossia a togliere la pubblicazione su tutti i moduli che si trovano in left?

Ho come l'impressione che ti stai avviando verso l'uso di due template... mi auguro di no  ;D
Ci sono più cose in cielo e in terra, Orazio, di quante ne sogni la tua filosofia.

Offline alcor

  • Esploratore
  • **
  • Post: 60
  • Sesso: Maschio
    • Mostra profilo
Re: topmenu come questi
« Risposta #10 il: 23 Set 2007, 02:13:02 »
no no, solo un template.
si, ovviamente ho impostato affinchè non si vedano tutti i moduli left. te l'ho detto armeggiando nell'index del template sono riuscito ad allargare tutto il mainbody, però ovviamente non posso più ripensarci.

insomma o con menu left e contenuti stretti o senza menu left e contenuti larghi, ho le due opzioni e mi sta bene.
però se volessi rimettere la visualizzazione di un qualche modulo left in una qualche pagina, ovviamente spagina tutto. il mio desiderio sarebbe un template che capisca se ci sono moduli left pubblicati o meno e che adatti il mainbody di conseguenza, senza lasciare lo spazio vuoto nel primo caso e senza spaginare nel secondo.

Offline bigham

  • Global Moderator
  • Instancabile
  • *****
  • Post: 3662
  • Sesso: Maschio
  • Contagiato dalla Joomlaite :)
    • Mostra profilo
Re: topmenu come questi
« Risposta #11 il: 23 Set 2007, 11:09:39 »
Adesso ci siamo!  ;D
Scusami a a una certa ora della notte si sente il peso dell'età e del rinco...to  ;D

Non so quale template stai usando ma, visto come si comporta nel caso di svutamento della colonna left da tutti i moduli suppongo sia fatto utilizzando le tabelle.

Quindi la prima soluzione da adottare è quella di scegliere un template che utilizzi i container (<div> o <span>) e non le tabelle che, se anche le colonne sono vuote, mantengono la medesima dimensione.

Trasformare un template a tabelle non è una cosa semplice, tanto vale ricominciare da zero.  ;D

Quale template stai usando?
Io nel mio sito uso madeyourweb-ext che nel caso in cui nella colonna left non ci siano moduli allarga il mainbody per tutta la larghezza della pagina (uscendo un pò dal bordo).
Ed è fatto tutto utilizzando in container.

Ti consigli di leggere questa guida ai CSS 
« Ultima modifica: 23 Set 2007, 11:11:54 da bigham »
Ci sono più cose in cielo e in terra, Orazio, di quante ne sogni la tua filosofia.

Offline alcor

  • Esploratore
  • **
  • Post: 60
  • Sesso: Maschio
    • Mostra profilo
Re: topmenu come questi
« Risposta #12 il: 23 Set 2007, 18:18:06 »
grazie.
allora il template si chiama siteground40 e non mi ricordo dove l'ho trovato. è fatto il modo che duplichi il menu left in orizzontale, infatti all'inizio ne avevo due, però ha un file php chiamato "menu" in cui poter fare delle modifiche su cosa visualizzare.

si è a tabelle, ma io ho praticamente cancellato le tebelle di sinistra lasciando solo quelle in cui è presente il mainbody e il top ecc. insomma mi rimane sono il mainbody visualizzato e va bene alla fine.

il problema come ti dicevo è che non si adatta al fatto che ci sia o meno il modulo left, adesso mi hai detto dei container div, di cui avevo letto qualcosa che adesso ho capito meglio.
ora potrei trovare un template tipo il mio solo con div e span... ma come lo trovo? mi viene lo sconforto, anche perchè sono in una fase avanzata di personalizzazione colori/sfondi/caratteri, e ricominciare da capo... >:(

guarda a me starebbe bene anche cosi, però adesso sto notando una cosa fastidiosa; in firefox i contenuti del mainbody sono larghi e omogenei, in explorer sono allineati a sinistra... ma perchè??
ho provato ad agire nelle celle della tabella allineando tutto al centro ma non cambia, se mi risolvi questo piccolo enigma poi mi sta bene tutto cosi.
grazie mille big

EDIT
ti allego due immagini per farti capire meglio

[allegato eliminato da un amministratore]
« Ultima modifica: 23 Set 2007, 18:37:33 da udein »

Offline bigham

  • Global Moderator
  • Instancabile
  • *****
  • Post: 3662
  • Sesso: Maschio
  • Contagiato dalla Joomlaite :)
    • Mostra profilo
Re: topmenu come questi
« Risposta #13 il: 24 Set 2007, 11:04:17 »
Ciao.

Hai ragione, cambiare template adesso significherebbe ricominciare dall'inizio. Non è una buona idea  ;)

I template a tabelle sono i peggiori perchè troppo "rigidi" e difficilmente adattabili. Adesso lo sai!  ;D Quando scarichi un template, prima di applicarlo basta leggere il codice sorgente del file index.php e si capisce subito com'è fatto. Scartare a priori quelli che usano le tabelle.

Per quanto riguarda l'ultimo punto uno degli svantaggi di un layout con i css è dovuto, purtroppo, alle differenze di interpretazione dei fogli di stile. Mentre le tabelle garantiscono una certa solidità, i css sono purtroppo un terreno instabile a causa dei browsers.
In IE il supporto per i css, e in particolare per i css di livello 2, è piuttosto carente ed è veramente limitante.

In buona sostanza: quello che va bene per Firefox non vuol dire che funzione con Internet Explorer.

Che fare?
Una soluzione è passare il foglio di stile al controllo del W3C. L'indirizzo del validatore è: http://jigsaw.w3.org/css-validator/
Il report finale potrebbe darti un'idea di quali attributi non sono supportati da IE o da Firefox (considera importanti solo gli errori e non i warning).
Ti consiglio di leggere anche questo paragrafo della Guida ai CSS che parla del box model. Credo sia importante perchè il tuo problema dovrebbe essere proprio l'impostazione dell'area in cui viene inserito il contenuto dell'articolo.

Il problema si risolve sicuramente trovando gli attributi che IE non riesce a interpretare e modificandoli nel css.

Intanto vedo di trovare il template e vediamo com'è fatto.
Ci sono più cose in cielo e in terra, Orazio, di quante ne sogni la tua filosofia.

Offline bigham

  • Global Moderator
  • Instancabile
  • *****
  • Post: 3662
  • Sesso: Maschio
  • Contagiato dalla Joomlaite :)
    • Mostra profilo
Re: topmenu come questi
« Risposta #14 il: 24 Set 2007, 12:35:13 »
Ho controllato il CSS e sembra non ci siano errori gravi.
Piuttosto, aggiungi questa classe al CSS:
Citazione
.blog {
   width: 100%;
   text-align: left;
}

Credo che così le differenze di formattazione del testo tra IE e Firefox dovrebbero sparire.  ;D

Ciao!!
Ci sono più cose in cielo e in terra, Orazio, di quante ne sogni la tua filosofia.

Offline alcor

  • Esploratore
  • **
  • Post: 60
  • Sesso: Maschio
    • Mostra profilo
Re: topmenu come questi
« Risposta #15 il: 24 Set 2007, 22:50:47 »
grazie mille bigham.
il problema del testo l'ho risolto diversamente in quanto eliminando le tabelle di sinistra non avevo tolto quella che separava il body ed il left, si era ristretta al minimo e non si vedeva.
tolta quella il testo si è sistemato, ma il tuo tag mi ha sistemato altre differenze di formattazione tra i due browser che non mi spiegavo.
un'ultima cosa...come faccio a linkare l'immagine top? devo farlo nel css o nell'index? il richiamo c'è solo nel css però.

grazie di tutto l'impegno  ;)

Offline bigham

  • Global Moderator
  • Instancabile
  • *****
  • Post: 3662
  • Sesso: Maschio
  • Contagiato dalla Joomlaite :)
    • Mostra profilo
Re: topmenu come questi
« Risposta #16 il: 24 Set 2007, 23:19:41 »
Apri l'index.php del template, individua la posizione dell'immagine e metti questo tag

Citazione
<a href="index.php"><img src="<?php echo $mosConfig_live_site;?>/templates/nome_template/images_<?php echo $color; ?>/logo.gif" border="0" width="250" height="80" alt="logo, link to homepage" />[/url]

Cambia il nome_template e il nome dell'immagine ed eventualmente modifica o togli i valori di dimensione.

Ciaoooo!  ;D
Ci sono più cose in cielo e in terra, Orazio, di quante ne sogni la tua filosofia.

Offline alcor

  • Esploratore
  • **
  • Post: 60
  • Sesso: Maschio
    • Mostra profilo
Re: topmenu come questi
« Risposta #17 il: 25 Set 2007, 00:40:52 »
mamma mia che casino, praticamente nell'index non c'è il riferimento all'immagine del logo, c'è solo il div top.

nel css il richiamo di top porta un'immagine di sfondo che è appunto il logo. adesso come faccio a linkare uno sfondo? ma sono matti questi..
Codice: [Seleziona]
<?php defined"_VALID_MOS" ) or die( "Direct Access to this location is not allowed." );$iso split'='_ISO );echo '<?xml version="1.0" encoding="'$iso[1] .'"?' .'>';?>
<!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>
<?php mosShowHead(); ?>
<meta http-equiv="Content-Type" content="text/html" <?php echo _ISO?>" />
<?php if ( $my->id ) { initEditor(); } ?>
<?php echo "<link rel=\"stylesheet\" href=\"$GLOBALS[mosConfig_live_site]/templates/$GLOBALS[cur_template]/css/template_css.css\" type=\"text/css\"/>" ?>
<link rel="alternate" title="<?php echo $mosConfig_sitename?>" href="<?php echo $GLOBALS['mosConfig_live_site']; ?>/index2.php?option=com_rss&no_html=1" type="application/rss+xml" />
<link rel="alternate" type="application/rss+xml" title="<?php echo $mosConfig_sitename?>" href="<?php echo $mosConfig_live_site;?>/index.php?option=com_rss&feed=RSS2.0&no_html=1" />
<script language="JavaScript" type="text/javascript">
    <!--
    function MM_reloadPage(init) {  //reloads the window if Nav4 resized
      if (init==true) with (navigator) {if ((appName=="Netscape")&&(parseInt(appVersion)==4)) {
        document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; }}
      else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload();
    }
    MM_reloadPage(true);
    //-->
  </script>
</head>
<body class="body">
<center>
<div class="bg">
    <div class="top">
      <div align="center"></div>
    </div>
<?php include'menu.php'?>
    <table width="702" border="0" cellpadding="0" cellspacing="0">
      <tr align="center">
        <td width="2" valign="top"> <br> </td>
        <td width="700" valign="top">
          <div>
            <table width="100%" border="0" bordercolor="#666666">
              <tr>
                <td bordercolor="#666666" bgcolor="#666666"><span class="pathway">
                  <?php include "pathway.php"?>
                  </span></td>
              </tr>
            </table>
            <?php mosMainBody(); ?>
          </div></td>
      </tr>
    </table>

</div>
<div class="footer_bg">
</div>
<br>
 
  <? $sg = 'banner'; include "templates.php"; ?>
  <? $sg = ''; include "templates.php"; ?>
</center>
</body>
</html>
« Ultima modifica: 25 Set 2007, 00:47:40 da udein »

Offline alcor

  • Esploratore
  • **
  • Post: 60
  • Sesso: Maschio
    • Mostra profilo
Re: topmenu come questi
« Risposta #18 il: 25 Set 2007, 03:34:04 »
ho semirisolto inserendo onclick="location.href='index.php';" onkeypress="location.href='index.php';"> nel div top, e "cursor:pointer; nel css.

funziona ma in questo modo non c'è nessuna informazione alt.

Offline bigham

  • Global Moderator
  • Instancabile
  • *****
  • Post: 3662
  • Sesso: Maschio
  • Contagiato dalla Joomlaite :)
    • Mostra profilo
Re: topmenu come questi
« Risposta #19 il: 25 Set 2007, 10:30:26 »
E' una buona soluzione, al limite rinunci all'alt.
L'alternativa è togliere il riferimento all'immagine del css e metterla nel codice del file index.php.

Secondo me una vale l'altra  ;D
Ci sono più cose in cielo e in terra, Orazio, di quante ne sogni la tua filosofia.

Offline alcor

  • Esploratore
  • **
  • Post: 60
  • Sesso: Maschio
    • Mostra profilo
Re: topmenu come questi
« Risposta #20 il: 25 Set 2007, 21:53:38 »
ho risolto.
ho eliminato come hai detto il riferimento dell'immagine dal css, ma con qualsiasi stringa provavo non mi riusciva di visualizzare il logo. ho provato in tutte le salse, alla fine ho semplicemente spostato l'immagine dalla cartella del template alla cartella images centrale di joomla, ho impostato il link su quell'immagine e ha funzionato  ;D
grazie del supporto big!

Offline bigham

  • Global Moderator
  • Instancabile
  • *****
  • Post: 3662
  • Sesso: Maschio
  • Contagiato dalla Joomlaite :)
    • Mostra profilo
Re: topmenu come questi
« Risposta #21 il: 25 Set 2007, 21:57:03 »
 ;D ;D
Pregooo!!!
 ;D ;D
Contento di essere stato utile!
Ci sono più cose in cielo e in terra, Orazio, di quante ne sogni la tua filosofia.

Offline alcor

  • Esploratore
  • **
  • Post: 60
  • Sesso: Maschio
    • Mostra profilo
Re: topmenu come questi
« Risposta #22 il: 28 Set 2007, 19:07:12 »
ciao bigham
scusa se approfitto ancora ma, il template siteground40 non mi fa gli elenchi puntati, proprio non appaiono.
con tutti gli altri templates nessun problema.

hai idea del perchè e cosa posso aggiungere nel css per risolvere?

grazie

Offline bigham

  • Global Moderator
  • Instancabile
  • *****
  • Post: 3662
  • Sesso: Maschio
  • Contagiato dalla Joomlaite :)
    • Mostra profilo
Re: topmenu come questi
« Risposta #23 il: 28 Set 2007, 20:03:21 »
Ciao

Che pasienza che ci vuole con i newbie  ;D ;D ;D ;D

Lo stile degli elenchi puntati si può impostare con le seguenti classi:
Citazione
ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

li {
  line-height: 15px;
  padding-left: 10px;
  padding-top: 0px;
  background-image: url(../images/arrow.gif) ;
  background-repeat: no-repeat;
  background-position: 0px 3px;
}

i valori sono chiarmente indicativi e l'immagine di background, se la vuoi usare, deve essere presente nella cartella images del template. In genere si disegna un triangolino rivolto verso destra del colore che vuoi.

Controlla il foglio di stile del template. Magari le classi ci sono ma non hanno impostazioni.

Ciaooo!!  ;D ;D ;D

Ci sono più cose in cielo e in terra, Orazio, di quante ne sogni la tua filosofia.

Offline alcor

  • Esploratore
  • **
  • Post: 60
  • Sesso: Maschio
    • Mostra profilo
Re: topmenu come questi
« Risposta #24 il: 28 Set 2007, 22:58:51 »
no la classe non c'era, grazie mille

 



Web Design Bolzano Kreatif