Joomla.it Forum
Joomla! 3 => I Template di Joomla! 3 => : a30n 23 Jun 2014, 13:53:30
-
Buonasera,
avrei una richiesta da fare. Ho visto nella preview di questo templeate(http://www.asdesigning.com/demo/asj57/) questo modulo(IT SOLUTION, WEB ANALYTICS, DEVELOPMENT ED ECC). Come si fa a fare una cosa del genere? In html? Cioč l'immagine con scritta una accanto all'altra proprio come questo! č possibile trasformare una cosa del genere in un menų a tendina che passandoci sopra si apre il sotto-menų con le varie voci? inserendo ovviamente anche il loghino per ogni voce?
-
quelle 4 voci sono 4 semplici moduli html con dei div che richiamano uno specifico stile, l'immagine appunto.
ora per la trasformazione che tu chiedi, da quello a menų, la cosa č fattibile, pių o meno, ma non sei preciso e non posso darti nessuna risposta precisa, ma se conosci i css qualcosa combini. ;)
inoltre ti ricordo che ogni voce di menų nelle sue opzioni ha una casella dove inserire un immagine di 32x32 px in png.......forse č quello che cerchi?
-
Grazie della risposta.
Adesso volevo sapere una cosa. Ho inserito il box attraverso un codice div, ma tra lo slideshow e il box intercorre tanto spazio. Come mai?
Il codice div č questo: <div id="custom-content-wrapper">
<div id="featured-row">
<div class="featured-row-wrapper">
<div class="container">
<div class="row">
<div class="moduletable span3">
<div class="mod-newsflash mod-newsflash__">
<div class="item">
<p></p>
<h3>Aziende</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec facilisis consequat tellus a fermentum. Maecenas convallis.</p>
<a class="readmore" href="#">Read more ...[/url]<>
<>
<>
<div class="moduletable span3">
<div class="mod-newsflash mod-newsflash__">
<div class="item">
<p></p>
<h3>Assistenza</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec facilisis consequat tellus a fermentum. Maecenas convallis.</p>
<a class="readmore" href="#">Read more ...[/url]<>
<>
<>
<>
<>
<>
<><>
-
Ciao a30n,
devi modificare il css.
prova ad inserire questo nel file style.custom.css e controlla che la modifica sia solo lė.
#featured-row .featured-row-wrapper .container {padding-bottom: 20px; padding-top:0;}
-
Ho aperto il file style.default.css perchč style.custom.css non ha nulla all'interno.
Ma l'unico codice che c'č riguardo a featured-row č questo:
/* Featured Row */
#featured-row
{
background-color: #FFFFFF;
border-bottom: 1px solid #CCCCCC
}
#featured-row .featured-row-wrapper
{
border-top: 1px solid #FFFFFF;
border-bottom: 1px solid #FFFFFF;
}
#featured-row .mod-newsflash .item,
#featured-row .mod-custom
{
background-color: transparent;
}
#featured-row .mod-newsflash .item:hover,
#featured-row .mod-custom:hover
{
background-image: none;
-webkit-transition: background-color 0.3s linear;
-moz-transition: background-color 0.3s linear;
-o-transition: background-color 0.3s linear;
-ms-transition: background-color 0.3s linear;
transition: background-color 0.3s linear;
}
#featured-row .mod-newsflash .item:hover h2,
#featured-row .mod-custom:hover h2
{
color: #08aaf1;
}
#featured-row .module_title
{
background-color: transparent;
border-bottom: 1px solid #CCCCCC;
background-image: none;
}
#featured-row .mod-newsflash .item ul li a
{
color: #7f7f7f;
}
#featured-row .mod-newsflash .item ul li a:hover
{
color: #0099CC;
}
#featured-row .mod-newsflash .item img,
#featured-row .mod-custom img
{
margin-bottom: 0px;
}
che devo fare?
-
Quello che ho scritto...
Ciao a30n,
devi modificare il css.
prova ad inserire questo nel file style.custom.css e controlla che la modifica sia solo lė.
#featured-row .featured-row-wrapper .container {padding-bottom: 20px; padding-top:0;}
Prova. Non morde e se non va togli semplicemente il css aggiunto... In pių eventuali aggiornamenti del template non influiranno su queste modifiche. :)
Il file style.custom.css č vuoto apposta per scriverci i css tuoi. Sovrascrive gli altri, ma non li cancella.
-
fatto grazie! č possibile diminuire ulteriormente lo spazio? quale valore devo mettere?
-
Per lo spazio sotto togli padding-bottom:20px e ne metti meno o a zero.
Per quello sopra un margin-top negativo:
#featured-row .featured-row-wrapper .container {padding-bottom: 20px; padding-top:0; margin-top:-15px;}
-
ti ringrazio tutto fatto:)
mentre per quanto riguarda il menu top c'č la possibilitā di diminuire lo spazio tra la scritta č la parte superiore? e sopratutto usare un font che tenga conto delle lettere maiuscole?
come devo fare?:)
-
Hai tolto il link al sito?
-
HTTP://chiedietisarafatto.it
-
Per avere maiuscole e minuscole aggiungi questo al file di prima:
#as-menu ul.as-menu > li a, #as-menu ul.as-menu > li > span {
text-transform: none;
}
L'altra richiesta non l'ho capita. Quale scritta?
-
ma per avere le lettere maiuscole pure nelle voci del sottomenų come devo fare? quale č il codice?
-
Per avere maiuscole e minuscole aggiungi questo al file di prima:
#as-menu ul.as-menu > li a, #as-menu ul.as-menu > li > span {
text-transform: none;
}
L'altra richiesta non l'ho capita. Quale scritta?
Perfetto e per inserire le lettere maiuscole anche alle voci del sotto menų?
-
Non vedo voci di sottomenų...
-
guarda adesso...sono riuscito da solo a inserire il menų sotto lo slideshow..vorrei che le voci del sottomenų avessero le lettere maiuscole:)
-
Il primo se vuoi il testo alto e basso, il secondo se lo vuoi tutto maiuscolo
#as-menu ul.as-menu ul li a, #as-menu ul.as-menu ul li span {
text-transform: none;
}
#as-menu ul.as-menu ul li a, #as-menu ul.as-menu ul li span {
text-transform: uppercase;
}
-
ho provato ad inserire entrambi ma nessuno dei due ha effetto...lo ho inserito in style.custom.css ma nulla...se vedi tu stessa non mette le lettere maiuscole a inizio lettera...come mai?
poi un'altra domanda...il menų sotto lo slideshow č possibile posizionarlo centralmente?
-
Fai un refresh. E poi metti solo uno dei due, altrimenti l'ultimo sovrascrive.
Una domanda per 3D. Qui siamo giā a tre... Aprine uno nuovo.
-
ho inserito il primo codice che mi hai dato per avere il sottomenų con la lettera maiuscola...ma adesso il testo č tutto maiuscolo! dove sbaglio?
-
Ti ho scritto due codici. Se metti il secondo hai tutto maiscolo. Se metti il primo avrai cosa scrivi nella voce di menų. Quindi per avere la prima lettera maiscola metti solo il primo dei due codici e scrivi con la prima lettera maiscola.
Il primo se vuoi il testo alto e basso, il secondo se lo vuoi tutto maiuscolo
#as-menu ul.as-menu ul li a, #as-menu ul.as-menu ul li span {
text-transform: none;
}
#as-menu ul.as-menu ul li a, #as-menu ul.as-menu ul li span {
text-transform: uppercase;
}
-
perfetto! adesso va...potete chiudere:)