[Résolu]cmsms 1.12 Bootstrap 3.3.5 ==> toggle button ne fonctionne pas

Note de ce sujet :
  • Moyenne : 0 (0 vote(s))
  • 1
  • 2
  • 3
  • 4
  • 5
#1
Citation :#~~~~~ DEBUT BLOC A NE PAS SUPPRIMER ~~~~~
#~ Version du CMS: 1.12
#~ Url du site :
#~ Hébergeur / Soft :
#~ Informations Système :
#~ ----------------------------------------------
#~ Cms Version: 1.12.1
#~ Installed Modules:
#~ CMSMailer: 5.2.2
#~ CMSPrinting: 1.0.5
#~ FileManager: 1.4.5
#~ MenuManager: 1.8.7
#~ MicroTiny: 1.2.9
#~ ModuleManager: 1.5.8
#~ News: 2.15.2
#~ Search: 1.7.13
#~ ThemeManager: 1.1.8
#~ Config Information:
#~ php_memory_limit:
#~ process_whole_template:
#~ max_upload_size: 2000000
#~ url_rewriting: none
#~ page_extension:
#~ query_var: page
#~ image_manipulation_prog: GD
#~ auto_alias_content: true
#~ locale:
#~ default_encoding: utf-8
#~ admin_encoding: utf-8
#~ set_names: true
#~ Php Information:
#~ phpversion: 5.4.31
#~ md5_function: On (Vrai)
#~ gd_version: 2
#~ tempnam_function: On (Vrai)
#~ magic_quotes_runtime: Off (Faux)
#~ E_STRICT: 2048
#~ E_DEPRECATED: 8192
#~ memory_limit: 128M
#~ max_execution_time: 30
#~ output_buffering: 4096
#~ safe_mode: Off (Faux)
#~ file_uploads: On (Vrai)
#~ post_max_size: 8M
#~ upload_max_filesize: 2M
#~ session_save_path: D:/DRIVE-REPTIKA/REPTIKA/Developpements/Uwamp/bin/apache/sessions (0555)
#~ session_use_cookies: On (Vrai)
#~ xml_function: On (Vrai)
#~ xmlreader_class: On (Vrai)
#~ Server Information:
#~ Server Api: apache2handler
#~ Server Db Type: MySQL (mysqli)
#~ Server Db Version: 5.6.20
#~ Server Db Grants: Trouvé un privilège "GRANT ALL" qui semble être adapté
#~ Server Time Diff: Aucune différence de date du système de fichiers trouvées
#~ ----------------------------------------------
#~~~~~ FIN BLOC A NE PAS SUPPRIMER ~~~~~


Bonjour,


Je viens d'installer cmsms 1.12. Voulant utiliser Bootstrap (version 3.3.5) afin d'avoir un site "responsive.
J'ai créé un nouveau gabarit de menu sur base d'une source venant de ce site :

elgatodesign.com rubrique blog

Résultat :

- Mon site s'affiche correctement
- Mon menu déroulants'affiche correctement

Problème :

- Afin de tester si mon boostrat fonctionne bien, j'ai réduit la fenêtre de mon navigateur ("chrome"). Le bouton "Toggle button" apparaît mais lorsque je clique dessus, mon menu n'apparaît pas.

Voici le code de mon gabarit de menu :


Code :
[== Indéfini ==]
{strip}

{if $count > 0}
<div class='navbar-collapse collapse'>
    <ul class='nav navbar-nav' role='menu'>
    {* if using cmsms lower then 1.11 change foreach below to {foreach from=$nodelist item='node'} *}
    {foreach $nodelist as $node}
        
        {* if depth is greater then previous we need ul *}
        {if $node->depth > $node->prevdepth}
            {repeat string="<ul class='dropdown-menu' role='menu'>" times=$node->depth-$node->prevdepth}  
        {* if depth is lower then we have to close unordered list *}
        {elseif $node->depth < $node->prevdepth}
            {repeat string='</li></ul>' times=$node->prevdepth-$node->depth}
            </li>
        {elseif $node->index > 0}
            </li>
        {/if}
        
        {* is menu item current? *}
        {if $node->current == true}
        
            <li class='active{if $node->parent == true || $node->haschildren == true}{if $node->depth > 1} dropdown-submenu{else} dropdown{/if}{/if}'>
                <a href='{$node->url}' {if $node->parent == true || $node->haschildren == true}class='dropdown-toggle {$node->alias}' data-toggle='dropdown' data-target='#'{else}class='{$node->alias}'{/if}{if $node->target != ''} target='{$node->target}'{/if}>{$node->menutext}{if ($node->parent == true || $node->haschildren == true) && ($node->depth < 2)} <b class='caret'></b>{/if}</a>        
        
        {* is menu item parent and not sectionheader? *}
        {elseif $node->parent == true && ($node->type != 'sectionheader' && $node->type != 'separator')}
        
            <li class='{if $node->parent == true || $node->haschildren == true} active{if $node->depth > 1} dropdown-submenu{else} dropdown{/if}{/if}'>
                <a href='{$node->url}' data-toggle='dropdown' data-target='#' class='dropdown-toggle active {$node->alias}'{if $node->target != ''} target='{$node->target}'{/if}>{$node->menutext}{if ($node->parent == true || $node->haschildren == true) && ($node->depth < 2)} <b class='caret'></b>{/if}</a>        
      
        {* is menu item a sectionheader? *}
        {elseif $node->type == 'sectionheader' && ($node->parent == true || $node->haschildren == true)}
            <li class='sectionheader {if $node->depth > 1} dropdown-submenu{else} dropdown{/if}'>
                <a href='#' data-toggle='dropdown' role="button" class='dropdown-toggle {$node->alias}{if $node->current == true} active{/if}'>{$node->menutext}{if ($node->parent == true || $node->haschildren == true) && ($node->depth < 2)} <b class='caret'></b>{/if}</a>
        
        {* and sectionheader has no children? *}
        {elseif $node->type == 'sectionheader' && $node->haschildren == false}
            <li class='sectionheader nav-header'>
                {$node->menutext}            
        
        {* should a menu item be separated? *}
        {elseif $node->type == 'separator'}
            <li class='divider'>
        
        {else}
            <li{if $node->parent == true || $node->haschildren == true} class='{if $node->depth > 1}dropdown-submenu{else}dropdown{/if}'{/if}>
                <a href='{$node->url}' {if $node->parent == true || $node->haschildren == true}class='dropdown {$node->alias}'{else}class='{$node->alias}'{/if}{if $node->target != ''} target='{$node->target}'{/if}>{$node->menutext}{if ($node->parent == true || $node->haschildren == true) && ($node->depth < 2)} <b class='caret'></b>{/if}</a>
        {/if}
        
    {/foreach}

    {repeat string='</li></ul>' times=$node->depth-1}</li>
    </ul>
</div>
{/if}

{/strip}



Voici le code de mon gabarit de menu :


Code :
[== HTML ==]
{strip}
{process_pagedata}

{* With cms_lang_info we retrieve current language information, assign gives us $nls variable we can work with *}
{cms_lang_info assign='nls'}

{* using strip as we don't want useless whitespace, especially not before doctype *}
{/strip}<!doctype html>
<html lang='{if isset($nls)}{$nls->htmlarea()}{/if}' dir='{if isset($nls)}{$nls->direction()}{/if}'>
<head>
<meta charset='{if isset($nls)}{$nls->encoding()}{/if}'>
<title>{title} - {sitename}</title>
<meta name='viewport' content='initial-scale=1.0 maximum-scale=1.0 user-scalable=no' />
<meta name='HandheldFriendly' content='true' />
{* Don't remove this! Metadata is entered in Site Admin/Global settings. *}
{metadata}
{* See in news detail template how cannonical url can be assigned from module *}
{if isset($canonical)}<link rel='canonical' href='{$canonical}' />{elseif isset($content_obj)}<link rel='canonical' href='{$content_obj->GetURL()}' />{/if}
{* This is how all the stylesheets attached to this template are linked to *}
{cms_stylesheet}
<link href="{root_url}/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">




{* learning IE lower then Version 9 some html5 *}
<!--[if lt IE 9]>
<script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
{* Relational links for interconnections between pages, good for accessibility and Search Engine Optmization *}
{cms_selflink dir='start' rellink='1'}
{cms_selflink dir='prev' rellink='1'}
{cms_selflink dir='next' rellink='1'}
</head>
<body>

    <!-- Static navbar -->
    <nav class="navbar navbar-default navbar-static-top">
      <div class="container">
        <div class="navbar-header">
          <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </button>
          <a class="navbar-brand" href="#">{Sitename}</a>
        </div>
        
        
        <div id="navbar" class="navbar-collapse collapse">
            
        {menu template='carryall.tpl'}
          
        </div><!--/.nav-collapse -->
      </div>
    </nav>


    <div class="container">

     {content}

    </div> <!-- /container -->



    <!-- Bootstrap core JavaScript
    ================================================== -->
    <!-- Placed at the end of the document so the pages load faster -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
    <script src="{root_url}/bootstrap/dist/js/bootstrap.min.js"></script>
    <!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
    <script src="{root_url}/bootstrap/docs/assets/js/ie10-viewport-bug-workaround.js"></script>







</body>
</html>


J'ai l'impression qu'il pourrait y avoir un problème au niveau du target mais je ne suis pas sûr. En espérant que vous pourrez me mettre sur la piste.

D'avance merci
#1
Citation :#~~~~~ DEBUT BLOC A NE PAS SUPPRIMER ~~~~~
#~ Version du CMS: 1.12
#~ Url du site :
#~ Hébergeur / Soft :
#~ Informations Système :
#~ ----------------------------------------------
#~ Cms Version: 1.12.1
#~ Installed Modules:
#~ CMSMailer: 5.2.2
#~ CMSPrinting: 1.0.5
#~ FileManager: 1.4.5
#~ MenuManager: 1.8.7
#~ MicroTiny: 1.2.9
#~ ModuleManager: 1.5.8
#~ News: 2.15.2
#~ Search: 1.7.13
#~ ThemeManager: 1.1.8
#~ Config Information:
#~ php_memory_limit:
#~ process_whole_template:
#~ max_upload_size: 2000000
#~ url_rewriting: none
#~ page_extension:
#~ query_var: page
#~ image_manipulation_prog: GD
#~ auto_alias_content: true
#~ locale:
#~ default_encoding: utf-8
#~ admin_encoding: utf-8
#~ set_names: true
#~ Php Information:
#~ phpversion: 5.4.31
#~ md5_function: On (Vrai)
#~ gd_version: 2
#~ tempnam_function: On (Vrai)
#~ magic_quotes_runtime: Off (Faux)
#~ E_STRICT: 2048
#~ E_DEPRECATED: 8192
#~ memory_limit: 128M
#~ max_execution_time: 30
#~ output_buffering: 4096
#~ safe_mode: Off (Faux)
#~ file_uploads: On (Vrai)
#~ post_max_size: 8M
#~ upload_max_filesize: 2M
#~ session_save_path: D:/DRIVE-REPTIKA/REPTIKA/Developpements/Uwamp/bin/apache/sessions (0555)
#~ session_use_cookies: On (Vrai)
#~ xml_function: On (Vrai)
#~ xmlreader_class: On (Vrai)
#~ Server Information:
#~ Server Api: apache2handler
#~ Server Db Type: MySQL (mysqli)
#~ Server Db Version: 5.6.20
#~ Server Db Grants: Trouvé un privilège "GRANT ALL" qui semble être adapté
#~ Server Time Diff: Aucune différence de date du système de fichiers trouvées
#~ ----------------------------------------------
#~~~~~ FIN BLOC A NE PAS SUPPRIMER ~~~~~


Bonjour,


Je viens d'installer cmsms 1.12. Voulant utiliser Bootstrap (version 3.3.5) afin d'avoir un site "responsive.
J'ai créé un nouveau gabarit de menu sur base d'une source venant de ce site :

elgatodesign.com rubrique blog

Résultat :

- Mon site s'affiche correctement
- Mon menu déroulants'affiche correctement

Problème :

- Afin de tester si mon boostrat fonctionne bien, j'ai réduit la fenêtre de mon navigateur ("chrome"). Le bouton "Toggle button" apparaît mais lorsque je clique dessus, mon menu n'apparaît pas.

Voici le code de mon gabarit de menu :


Code :
[== Indéfini ==]
{strip}

{if $count > 0}
<div class='navbar-collapse collapse'>
    <ul class='nav navbar-nav' role='menu'>
    {* if using cmsms lower then 1.11 change foreach below to {foreach from=$nodelist item='node'} *}
    {foreach $nodelist as $node}
        
        {* if depth is greater then previous we need ul *}
        {if $node->depth > $node->prevdepth}
            {repeat string="<ul class='dropdown-menu' role='menu'>" times=$node->depth-$node->prevdepth}  
        {* if depth is lower then we have to close unordered list *}
        {elseif $node->depth < $node->prevdepth}
            {repeat string='</li></ul>' times=$node->prevdepth-$node->depth}
            </li>
        {elseif $node->index > 0}
            </li>
        {/if}
        
        {* is menu item current? *}
        {if $node->current == true}
        
            <li class='active{if $node->parent == true || $node->haschildren == true}{if $node->depth > 1} dropdown-submenu{else} dropdown{/if}{/if}'>
                <a href='{$node->url}' {if $node->parent == true || $node->haschildren == true}class='dropdown-toggle {$node->alias}' data-toggle='dropdown' data-target='#'{else}class='{$node->alias}'{/if}{if $node->target != ''} target='{$node->target}'{/if}>{$node->menutext}{if ($node->parent == true || $node->haschildren == true) && ($node->depth < 2)} <b class='caret'></b>{/if}</a>        
        
        {* is menu item parent and not sectionheader? *}
        {elseif $node->parent == true && ($node->type != 'sectionheader' && $node->type != 'separator')}
        
            <li class='{if $node->parent == true || $node->haschildren == true} active{if $node->depth > 1} dropdown-submenu{else} dropdown{/if}{/if}'>
                <a href='{$node->url}' data-toggle='dropdown' data-target='#' class='dropdown-toggle active {$node->alias}'{if $node->target != ''} target='{$node->target}'{/if}>{$node->menutext}{if ($node->parent == true || $node->haschildren == true) && ($node->depth < 2)} <b class='caret'></b>{/if}</a>        
      
        {* is menu item a sectionheader? *}
        {elseif $node->type == 'sectionheader' && ($node->parent == true || $node->haschildren == true)}
            <li class='sectionheader {if $node->depth > 1} dropdown-submenu{else} dropdown{/if}'>
                <a href='#' data-toggle='dropdown' role="button" class='dropdown-toggle {$node->alias}{if $node->current == true} active{/if}'>{$node->menutext}{if ($node->parent == true || $node->haschildren == true) && ($node->depth < 2)} <b class='caret'></b>{/if}</a>
        
        {* and sectionheader has no children? *}
        {elseif $node->type == 'sectionheader' && $node->haschildren == false}
            <li class='sectionheader nav-header'>
                {$node->menutext}            
        
        {* should a menu item be separated? *}
        {elseif $node->type == 'separator'}
            <li class='divider'>
        
        {else}
            <li{if $node->parent == true || $node->haschildren == true} class='{if $node->depth > 1}dropdown-submenu{else}dropdown{/if}'{/if}>
                <a href='{$node->url}' {if $node->parent == true || $node->haschildren == true}class='dropdown {$node->alias}'{else}class='{$node->alias}'{/if}{if $node->target != ''} target='{$node->target}'{/if}>{$node->menutext}{if ($node->parent == true || $node->haschildren == true) && ($node->depth < 2)} <b class='caret'></b>{/if}</a>
        {/if}
        
    {/foreach}

    {repeat string='</li></ul>' times=$node->depth-1}</li>
    </ul>
</div>
{/if}

{/strip}



Voici le code de mon gabarit de menu :


Code :
[== HTML ==]
{strip}
{process_pagedata}

{* With cms_lang_info we retrieve current language information, assign gives us $nls variable we can work with *}
{cms_lang_info assign='nls'}

{* using strip as we don't want useless whitespace, especially not before doctype *}
{/strip}<!doctype html>
<html lang='{if isset($nls)}{$nls->htmlarea()}{/if}' dir='{if isset($nls)}{$nls->direction()}{/if}'>
<head>
<meta charset='{if isset($nls)}{$nls->encoding()}{/if}'>
<title>{title} - {sitename}</title>
<meta name='viewport' content='initial-scale=1.0 maximum-scale=1.0 user-scalable=no' />
<meta name='HandheldFriendly' content='true' />
{* Don't remove this! Metadata is entered in Site Admin/Global settings. *}
{metadata}
{* See in news detail template how cannonical url can be assigned from module *}
{if isset($canonical)}<link rel='canonical' href='{$canonical}' />{elseif isset($content_obj)}<link rel='canonical' href='{$content_obj->GetURL()}' />{/if}
{* This is how all the stylesheets attached to this template are linked to *}
{cms_stylesheet}
<link href="{root_url}/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">




{* learning IE lower then Version 9 some html5 *}
<!--[if lt IE 9]>
<script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
{* Relational links for interconnections between pages, good for accessibility and Search Engine Optmization *}
{cms_selflink dir='start' rellink='1'}
{cms_selflink dir='prev' rellink='1'}
{cms_selflink dir='next' rellink='1'}
</head>
<body>

    <!-- Static navbar -->
    <nav class="navbar navbar-default navbar-static-top">
      <div class="container">
        <div class="navbar-header">
          <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </button>
          <a class="navbar-brand" href="#">{Sitename}</a>
        </div>
        
        
        <div id="navbar" class="navbar-collapse collapse">
            
        {menu template='carryall.tpl'}
          
        </div><!--/.nav-collapse -->
      </div>
    </nav>


    <div class="container">

     {content}

    </div> <!-- /container -->



    <!-- Bootstrap core JavaScript
    ================================================== -->
    <!-- Placed at the end of the document so the pages load faster -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
    <script src="{root_url}/bootstrap/dist/js/bootstrap.min.js"></script>
    <!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
    <script src="{root_url}/bootstrap/docs/assets/js/ie10-viewport-bug-workaround.js"></script>







</body>
</html>


J'ai l'impression qu'il pourrait y avoir un problème au niveau du target mais je ne suis pas sûr. En espérant que vous pourrez me mettre sur la piste.

D'avance merci
#2
Bonjour et bienvenue,
Très difficile de te répondre sans avoir de lien vers ton site, ni le javascript appliqué à #navbar (?), ni la css de collapse.
A tout hasard, supprime <div class='navbar-collapse collapse'> et sa fermeture </div> qui me semblent inutiles.
#2
Bonjour et bienvenue,
Très difficile de te répondre sans avoir de lien vers ton site, ni le javascript appliqué à #navbar (?), ni la css de collapse.
A tout hasard, supprime <div class='navbar-collapse collapse'> et sa fermeture </div> qui me semblent inutiles.
#3
Bonjour,

Je suis occupé de mettre cela en ligne. Je devrais être prêt dans quelques minutes.
#3
Bonjour,

Je suis occupé de mettre cela en ligne. Je devrais être prêt dans quelques minutes.
#4
Voilà, c'est uploadé à cette adresse : carryall.fr
#4
Voilà, c'est uploadé à cette adresse : carryall.fr
#5
C'est exactement ce que je t'ai écris plus tôt : supprime <div class='navbar-collapse collapse'> et sa fermeture </div>, tire la chevillette et la bobinette cherra Smile
Code :
{if $count > 0}
<div class='navbar-collapse collapse'>
    <ul class='nav navbar-nav' role='menu'>
...
</div>
#5
C'est exactement ce que je t'ai écris plus tôt : supprime <div class='navbar-collapse collapse'> et sa fermeture </div>, tire la chevillette et la bobinette cherra Smile
Code :
{if $count > 0}
<div class='navbar-collapse collapse'>
    <ul class='nav navbar-nav' role='menu'>
...
</div>
#6
Yes , ça marche ! Impeccable.

Je te remercie.

A bientôt sur le forum Smile
#6
Yes , ça marche ! Impeccable.

Je te remercie.

A bientôt sur le forum Smile
#7
Content pour toi, n'oublie pas de modifier le titre de ton post pour y insérer [Résolu] Smile
A bientôt pour de nouvelles aventures Wink
#7
Content pour toi, n'oublie pas de modifier le titre de ton post pour y insérer [Résolu] Smile
A bientôt pour de nouvelles aventures Wink
#8
Dois-je fermer le sujet ou je laisse comme ça ? Dans ce cas comment faire ?
#8
Dois-je fermer le sujet ou je laisse comme ça ? Dans ce cas comment faire ?
#9
Tu remontes sur le premier post et tu cliques sur modifier (signaler citer), puis tu insères [Résolu] au début de ton titre.
#9
Tu remontes sur le premier post et tu cliques sur modifier (signaler citer), puis tu insères [Résolu] au début de ton titre.


Atteindre :


Utilisateur(s) parcourant ce sujet : 1 visiteur(s)