Joomla.it Forum

Joomla! 3 => Joomla! 3 => : Silvio Trisorio 11 Jun 2017, 14:37:16

: Personalizzazione form
: Silvio Trisorio 11 Jun 2017, 14:37:16

Ciao a tutti,
ho creato dei moduli personalizzati con dei form tipo questo:

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.pack.js"></script>

       
        <div align="center">
          <select id="cerca_promo">
          <option name="# ">Cerca paese</option>           
<option name="http://www.google.it ">ISOLA SANT'ANTONIO</option>           
          </select>
         
         
         
         
          <script type="text/javascript">

  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-3223941-55']);
  _gaq.push(['_trackPageview']);

  (function() {
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
  })();

        </script>
</div>
        <script type="text/javascript">
$('#cerca_promo').change(function () {
    window.location = $(':selected', this).attr('name');
    });

        </script>

Vorrei però renderli più belli, magari con selettori arrotondati e così via...come posso fare a personalizzarli?

Grazie in anticipo.

Silvio.

: Re:Personalizzazione form
: pupito 11 Jun 2017, 20:01:24

Ciao, sarebbe meglio un link del sito. Comunque in linea di massima dovresti agire sul codicei css

: Re:Personalizzazione form
: Silvio Trisorio 11 Jun 2017, 20:04:11

Ciao,
non è possibile dare le variabili nel codice che ho scritto?

: Re:Personalizzazione form
: danielecr 11 Jun 2017, 21:06:57

Si, puoi inserire gli style direttamente inline, ma secondo me è più ordinato nel file separato css.

: Re:Personalizzazione form
: Silvio Trisorio 11 Jun 2017, 22:53:44

Quali sono i valori che devo inserire nel css?

: Re:Personalizzazione form
: danielecr 11 Jun 2017, 23:42:02

[/size][/font]

Vorrei però renderli più belli, magari con selettori arrotondati e così via...come posso fare a personalizzarli?

Dovresti essere più preciso!

: Re:Personalizzazione form
: Silvio Trisorio 12 Jun 2017, 00:03:57

Ok,
cosa ci scrivo nel css?

: Re:Personalizzazione form
: danielecr 12 Jun 2017, 10:10:26

Nel css o negli stili inline si scrivono appunto gli stili, ovvero le regole estetiche.
Non so in particolare cosa puoi scrivere, perchè non so come vuoi far apparire il form!

Qui hai un esempio generale con stili inline:

:

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.pack.js"></script>
<div align="center">
    <select id="cerca_promo" style="background-color:#F96; border-radius:8px;">
        <option name="# " style="font-size:14px; font-weight:bolder; background-color:#FC0;">Cerca paese</option>           
        <option name="http://www.google.it " style="background-color:#FC0;">ISOLA SANT'ANTONIO</option>           
    </select>
         
    <script type="text/javascript">
          var _gaq = _gaq || [];
          _gaq.push(['_setAccount', 'UA-3223941-55']);
          _gaq.push(['_trackPageview']);

          (function() {
        var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
        ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
        var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
          })();
    </script>
</div>

<script type="text/javascript">
$('#cerca_promo').change(function () {
    window.location = $(':selected', this).attr('name');
    });
</script>

Puoi modificare la grandezza del testo, lo stile del testo, i colori, l'arrotondamento e tutto quello che ti viene in mente..

Allego anche 2 screenshot, id1 relativo al tuo codice, id2 a quello modificato.

: Re:Personalizzazione form
: giusebos 12 Jun 2017, 10:39:48

la cosa migliore è postare il link, in maniera da darti istruzioni precise.
Con solo il codice js che richiama il form non ci si fa niente, occorre invece HTML.

In questi casi, avendo la pagina a disposizione, si analizza gli elementi con firebug, così chè possiamo darti una istruzione precisa da incollare nel file del CSS principale del sito.

Se invece, ad esempio, ti bastasse la regola che arrontonda gli angoli e magari abbia un bordo rosso:

tua_classe {
border-radius: 4px;
border: 1px solid #e40000;
}

: Re:Personalizzazione form
: Silvio Trisorio 20 Jun 2017, 17:39:16

Ciao scusa il ritardo,
ecco la pagina  "Seleziona il tuo paese"  cerca centro, vorrei renderlo un pò più carino.

Grazie mille.

: Re:Personalizzazione form
: Sitiwebjoomla.it 20 Jun 2017, 19:32:45

Se non sai usare il css ti conviene usare un modulo che gestisca i form come ad esempio cronoform oppure altri