Personnalisation de la navigation

Bonjour,

Je viens de commencer un gros chantier de personnalisation Sharepoint et j'ai déjà un problème :ptdr:....
J'utilise Sharepoint designer 2013, cependant je suis prêt à installer d'autrs outils de développement.
Mon but est le suivant:
Personnalisation de la page d'accueil pour y afficher le menu de navigation supérieur dans le contenu de la page -> OK
Modification de ce menu pour afficher chaque lien sous forme d’icône -> la ça bloque.

pour le moment l'étape que j'essaye de franchir est d'afficher les liens avec une image stockée dans le Sharepoint.
Mon problème est que je ne trouve pas ou est stocké le code html (ou asp ou autre) des entrées de menu :calim2:.

Pouvez vous m'aider? Je reste à votre disposition pour tout renseignements complémentaires.

Cordialement,

Bonsoir,

Je pense que la bonne méthode serait de modifier le code de votre MasterPage directement. Elle se trouve dans la galerie des pages maîtres. Par défaut, ça sera seattle.master je crois. Sinon vous pouvez créer une MasterPage personnalisée en vous servant d'un des deux modèles proposés (Seattle ou Oslo) comme base.

Pour le stockage des images, tout dépend combien de collections de sites vous voulez créer. Là je suis en train d'industrialiser la création d'environ 1000 SiteColl et je pense mutualiser mes images sur un site Azure en lecture pour tous.

Ps : ça fait quelques mois seulement que je suis sur SP et je pense que les experts de ce site auront la bonne solution :)

Bon courage,
Axel

Bonjour,

Merci de votre réponse.
Je modifie la master page (enfin une copie).
Mais dans cette master page je ne trouve pas le détail du code de mes liens. J'ai des appels à du AJAX et du ASP dans la partie qui gère le menu mais je ne sais pas ou est stocké ce code AJAJ/ASP. Quand je teste ma master page dans un navigateur le code coté client contient des <UL> <LI> pour le menu mais dans la master page je ne le vois pas.

Cordialement,

En effet, en 2013 Online (je ne connais pas le OnPremise dsl ^^), vous ne pouvez injecter que du JSOM (Javascript JQuerry) dans la master page. Vous ne pouvez pas insérer directement du nouveau code serveur. Par exemple ci-dessous un petit script ajouté en bas de la master page qui permet de modifier le logo O365 et le lien O365.

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18

<iframe id="traceFrame" style="display:none" src=""></iframe> <script type="text/javascript"> if (typeof jQuery == 'undefined') { document.write('<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"><' + '/script>'); }   var interval = setInterval(function(){ if($('#O365_MainLink_Logo').length) { $('#O365_MainLink_Logo').html("<a href='http://monLien/' target='new'><img src='https://monImage.png' height='36px' style='padding-top:4px;'></a>"); $('#O365_MainLink_Logo').attr("style","padding-top: 3px"); clearInterval(interval); } }, 1000); </script> </body> </SharePoint:SPHtmlTag>

---

Cependant, vous pouvez jouer sur les paramètres des balises ASP et SHAREPOINT pour influer sur leur code serveur. Par exemple pour changer le logo de votre collection de site, vous pouvez passer par cette balise :

Code:

---

<SharePoint:SiteLogoImage CssClass="ms-siteicon-img" name="onetidHeadbnnr0" id="onetidHeadbnnr2" LogoImageUrl="https://monImage.png" runat="server"/>

---

Citation:

---

Personnalisation de la page d'accueil pour y afficher le menu de navigation supérieur dans le contenu de la page

---

Dans ce cas précis, je ne sais pas trop. Vous pouvez me dire comment vous avez procédé (j'avoue ne jamais utiliser Designer, même Microsoft le dé-conseil maintenant) ?

Citation:

---

Quand je teste ma master page dans un navigateur le code coté client contient des <UL><LI> pour le menu mais dans la master page je ne le vois pas.

---

Les balises <UL><LI> sont des balises HTML qui sont crées par le code serveur dont tu n'as pas le contrôle.

Bonjour,

Pour répondre à votre demande:

Citation:

---

Citation:

---

Personnalisation de la page d'accueil pour y afficher le menu de navigation supérieur dans le contenu de la page

---

Dans ce cas précis, je ne sais pas trop. Vous pouvez me dire comment vous avez procédé (j'avoue ne jamais utiliser Designer, même Microsoft le dé-conseil maintenant) ?

---

C'est trés simple (enfin ce que j'ai fait est simple je ne sais pas si c'esr recommandé), j'ai déplacé tout le contenu de la balise

Code:

---

<div class="ms-breadcrumb-top"> ... </div>

---

pour la positionner dans le contenu du site

Code:

---

<div id="contentbox"...> ... </div>

---

Ça fonctionne presque parfaitement après il y a juste quelques propriétés CSS à modifier pour qu'il s'affiche normalement.

Sinon merci pour les informations sur le code serveur je vais trouver un autre moyen de gérer mon menu.

Cordialement,

Moi je recommande toujours les solutions simples et qui fonctionnent :)

ps : moi aussi je commence à décortiquer la Master Page et je suis sûr qu'on va découvrir pleins de possibilités !

Bonne chance,
Axel

Le menu en haut (Top Navigation) est un contrôle SharePoint (derive de l'asp:menu) qui va générer du code html (<ul><li>...).
Donc pour modifier l'aspect, il faut aller chercher les classes css grace aux outils de développement IE, Firefox etc et créer un fichier css qui va "overrider" ces classes. Mais cela peut devenir assez vite casse-tête.

Ou alors, créer ton propre contrôle de navigation sur lequel tu auras la main sur la generation du code html et où tu pourras mettre tes propres classes css etc.

Pour tout cela, il faut créer (ou modifier une copie) ta propre masterpage.

J'ai pu tester les 2 approches et la 2ieme, qui implique du développement, est preferable car tu as entiérement la main sur l'affichage etc tandis que pour la 1ere, les classes css de SharePoint vont entrer en conflit avec tes modifs.

Citation:

---

Envoyé par Kellox

Ou alors, créer ton propre contrôle de navigation sur lequel tu auras la main sur la generation du code html et où tu pourras mettre tes propres classes css etc.

---

Milles fois oui pour cette approche !!! :mouarf:

Si tu es sur une plateforme on-premise et que tu es ok pour faire un peu de développement, alors fais ton propre user control qui va chercher les information dans une liste (ou la taxonomy) pour récupérer tes informations et faire un menu 100% manipulable.

Le problème quand tu utilises le standard pour ce genre de chose, c'est que potentiellement, sur un update de version (Cumulative Update), l'éditeur peut décider de changer le comportement de son composant (chose très souvent visible sur online) ce qui implique que tu devras recommencer ton travail... :aie:

Un user control qui fait se travail demande environ 2h de travail, je pense que ça vaut vraiment le coup d'opter pour cette solution.