We launched new forums in March 2019—join us there. In a hurry for help with your website? Get Help Now!
    • 53985
    • 13 Posts
    Bonjour,
    je viens de tester "SimpleSearch" avec succès.
    Maintenant je souhaite adapté cette extension pour mon menu principal car à coté des liens de navigation il y a une icone en forme de loupe et je souhaiterai que le formulaire de SimpleSearch s'ouvre lorsque l'utilisateur clique sur cette icone en forme de loupe.
    D'après vous est-ce possible ou bien faut-il chercher une autre extension ?

    Merci pour votre aide.

    This question has been answered by achterbahn. See the first response.

    [ed. note: jean59 last edited this post 6 years, 2 months ago.]
    • discuss.answer
      • 36818
      • 119 Posts
      Si tu travailles avec Bootstrap, tu peux le réaliser avec un modal.

      1. Icone de loupe: 
      <a href="#" class="search-top" data-toggle="modal" data-focus="true" data-target=".search-modal"><span class="glyphicon glyphicon-search" aria-hidden="true"></span></a>


      2. Modal
           <!-- Site Search -->
      <div class="modal fade search-modal Fixed" role="dialog">
        <div class="modal-dialog" role="document">
          <div class="modal-content">
            <div class="modal-body">
              [[!SimpleSearchForm? &landing=`ID de ressource pour les résultats` &tpl=`SiSeaForm`]]
          </div><!-- /.modal-content -->
            </div>
        </div><!-- /.modal-dialog -->
      </div><!-- /.modal -->


      3. SiSeaForm-Chunk
      <form class="sisea-search-form form-inline" action="[[~[[+landing:default=`[[*id]]`]]]]" method="[[+method:default=`get`]]">
        <div class="form-group">
      	<input type="text" class="form-control" placeholder="Recherche..." name="[[+searchIndex]]" id="[[+searchIndex]]" value="[[+searchValue]]">
      	<button type="submit" class="btn btn-default" style="margin-top: 0;">Recherche</button>
        </div><!-- /input-group -->
        <input type="hidden" name="id" value="[[+landing:default=[[*id]]]]" />   
      </form>


      4. Ressource des résultats
      [[!SimpleSearch?
      &toPlaceholder=`sisea.results`
      ]]
      [[+sisea.results]]
        • 53985
        • 13 Posts
        Bonjour,

        C'est exactement ce qu'il me fallait. L'effet modal est excellent!!!

        Merci beaucoup Achterbahn