Attention cette page a été mise à jour le 28/04/2014 à 16h52
Personnellement je trouve les menus un peu fade, d'autant plus que je n'ai pas encore pris le temps d'ajouter la barre des menus dans les fichiers de Calibre.
En attendant je vous propose d'ajouter un menu déroulant au menu Livres.
C'est plus fun, non !
Sur chaque page de votre LibraryBox : index.html deCalibre, Catalog_video deAnt Movie Catalog vous aller remplacer le menu existant par le mien. Tout simplement.
Ouvrez le fichier LibraryBox/Content/index.html avec Notepad (bloc-note, ou notepad.exe, ou mieux encore Notepad++).
Nous commencerons par masquer l'ancien menu de la LibraryBox.
Pour mettre en commentaire dans HTML mettez <!-- votre texte en commentaire -->, comme ceci, il apparaîtra en vert (dans notepad++).
Donc dans index.html :
J'ai mis <!-- Ancien menu libraryBox... blablabla du menu librarybox -->>, et cela apparaît..... en vert dans notepad++) ainsi que toutes les lignes que j'ai pu modifié.
Puis copiez depuis mon texte ci-dessous en jaune, les parties modifiez par rapport à la version originale.
Vue, que j'ai fait moi-même des erreurs, je vous invite à comparer lignes par lignes votre fichier avec le mien.
En vert, je met les éléments qui peuvent être différents, les liens par exemples.
</head>
<body>
<span id="vc_count"></span>
<!-- <div id="top-nav" class="navbar navbar-inverse navbar-fixed-top" role="navigation"> -->
<div id="top-nav">
<div class="navbar navbar-inverse navbar-static-top" role="navigation">
<div class="container">
<div class="navbar-header">
<a href="/Content/" class="brand navbar-brand"><img src="/img/lbx-logo-small-white.png" width="24" alt="lbx-logo-small"> LibraryBox</a>
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<!--<span class="sr-only">Toggle navigation</span> -->
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<!--</div> -->
<!-- Nouveau menu Library Box -->
<div class="collapse navbar-collapse navHeaderCollapse">
<ul class="nav navbar-nav navbar-right">
<li><a href="/index.html">Accueil</a></li>
<li class="dropdown">
<a href="/Shared/text/calibre/_catalog/index.html" class="dropdown-toggle" data-toggle="dropdown">Livres<b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a href="/Shared/text/calibre/_catalog/9390c9cb/9390c9cb_books.html">Index alphabétique</a></li>
<li><a href="/Shared/text/calibre/_catalog/9390c9cb/9390c9cb_authors.html">Par auteur</a></li>
<li><a href="/Shared/text/calibre/_catalog/9390c9cb/9390c9cb_tags.html">Par genre</a></li>
<li><a href="/Shared/text/calibre/_catalog/9390c9cb/9390c9cb_recent.html">Ajouts récents</a></li>
<li><a href="/Shared/text/calibre/_catalog/9390c9cb/9390c9cb_rating.html">Appréciations</a></li>
<li><a href="/Shared/text/calibre/_catalog/_search/search.html">Rechercher</a></li>
</ul>
</li>
<li><a href="/Shared/picture/">Images</a></li>
<li><a href="/Shared/audio/">Audio</a></li>
<li><a href="/catalog_video.html">Video</a></li>
<li><a href="/Shared/software/">Apps</a></li>
<li><a href="/content/stats.html">Stats</a></li>
<li><a href="/content/about.html">A propos</a></li>
</ul>
</div>
<!--Ancien menu LibraryBox ...
<div class="collapse navbar-collapse">
<ul class="nav navbar-nav">
<li><a href="/" class="active">Accueil</a></li>
<li><a href="/Shared/text/calibre/_catalog/index.html">Livres</a></li>
<li><a href="/Shared/picture/">Images</a></li>
<li><a href="/Shared/audio/">Audio</a></li>
<li><a href="/catalog_video.html">Video</a></li>
<li><a href="/Shared/software/">Apps</a></li>
<li><a href="/content/stats.html">Stats</a></li>
<li><a href="/content/about.html">A propos</a></li>
</ul>
</div>
... -->
<!--/.nav-collapse -->
</div>
</div>
</div>
Enregistrer votre fichier et effectuez un test, si les chemins ne fonctionnent pas, il suffit de les modifier.
Exemple : ci-dessous en orange le chemin à modifier. Il suffit de se rendre dans /shared/text/_calibre et lancer les différents chemins blabla-books.html, blabla-authors.html et de faire un copier dans la barre d'adresse pour la copier dans vos liens de index.html.
<li><a href="/Shared/text/calibre/_catalog/9390c9cb/9390c9cb_books.html">Index alphabétique</a></li>
Chaque page CONTENANT LE MENU DEVRA ETRE MODIFIEE de la sorte (en attendant de pouvoir mettre la page menu.html dans une page php) !