Mise à jour du menu de contenu pour une ouverture au clic au lieu d'une ouverture au survol

Le menu de contenu s'affiche lorsqu'un utilisateur survole un portlet contenant des objets HCL Web Content Manager. InCombined Cumulative Fix 05, you can set the content menu to open when a user clicks an icon in the portlet skin instead.

Pourquoi et quand exécuter cette tâche

Procédure

  1. Ajoutez l'icône de menu de contenu à votre habillage personnalisé. Mettez à jour le thème personnalisé CSS sprite pour inclure la nouvelle image d'icône de menu de contenu. Remplacez la ressource statique master.png par l'image de thème par défaut Portal 8.5 dans WebDAV qui figure dans le répertoire /themes/Portal8.5/css/images/master.png.
  2. Ajoutez le code HTML pour l'icône à votre habillage personnalisé. Ajoutez le code suivant aux modèles d'habillage personnalisé après le nœud <h2> : 
    <a aria-haspopup="true" aria-label="Display component action menu" role="button" href="javascript:;" class="wpthemeIcon wpthemeMenuFocus contextMenuInSkinIcon" style="display:none" tabindex="0">
                <span title="Display component action menu"><img aria-label="Display component action menu" alt="" src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7"></span>
                <span class="wpthemeAltText">Component Action Menu</span>
                <!-- start CAM template -->
                <span class="wpthemeMenu" data-positioning-handler="horizontallyCenteredBelow">
                    <div class="wpthemeMenuBorder">
                        <!-- define the menu item template inside the "ul" element.  only "css-class", "description", and "title" are handled by the theme's sample javascript. -->
                        <ul class="wpthemeMenuDropDown wpthemeTemplateMenu" role="menu">
                            <li class="${css-class}" role="menuitem" tabindex="-1"><span
                                class="wpthemeMenuText">${title}</span></li>
                        </ul>
                        <div class="verticalMenuPointer pointer"></div>
                    </div> <!-- Template for loading -->
                    <div class="wpthemeMenuLoading wpthemeTemplateLoading">${loading}</div>
                    <!-- Template for submenu -->
                    <div class="wpthemeAnchorSubmenu wpthemeTemplateSubmenu">
                        <div class="wpthemeMenuBorder wpthemeMenuSubmenu">
                            <ul id="${submenu-id}" class="wpthemeMenuDropDown"
                                role="menu">
                                <li role="menuitem" tabindex="-1"></li>
                            </ul>
                        </div>
                    </div>
                </span>
                <!-- end CAM template -->
            </a>
  3. Convertissez les valeurs aria-label et wpthemeAltText pour permettre la prise en charge des langues que vous souhaitez utiliser.
  4. Ajoutez la feuille de style en cascade pour l'icône. Ajoutez le code suivant n'importe où dans le thème personnalisé : 
    .wpthemeControlHeader a.wpthemeIcon.contextMenuInSkinIcon img {
                background-position:0 -1496px;
            }
  5. Ajoutez le nouveau menu de contenu au profil de thème personnalisé. Ouvrez le profil de thème et ajoutez wp_skin_cam à la section deferredModuleIDs.