none
SharePoint 2013: Скрыть область QuickLaunch Menu на странице. RRS feed

  • Вопрос

  • Добрый день.

    Вот уже который раз, безуспешно, пытаюсь выполнить сию магическую операцию - результат пока нулевой.

    Речь не о скрытии пунктов меню быстрого запуска, а именно скрытии самой области, на которой это меню расположено.

    Нашел в интернете такой вот ресурс:

    http://sharepointpromag.com/sharepoint-administration/four-ways-add-or-remove-quick-launch-menu-control

    Выбрал вариант "Content Editor Web Part", где добавляется редактор содержимого. Сделал вроде бы все верно, но меню никуда не исчезает. Остается на месте. 

    Есть ли какой то другой способ скрыть эту область? Хочется именно скрыть это меню на определенной странице а не глобально.

    Заранее благодарю.

    27 января 2015 г. 8:14

Ответы

  • Кстати различается разметка в SP2010 и в SP2013.

    Вам нужен другой код для вставки:

    <style>
    .ms-core-navigation { DISPLAY: none }
    #contentBox { margin-left: 0px }
    </style>

    или

    <style unselectable=”on”>
    /* hide left menu bar */
    #sideNavBox {
    display: none;
    }
    /* adjust position of content */
    #contentBox {
    margin-left:20px!important;
    }
    </style>

    • Помечено в качестве ответа VARD32 27 января 2015 г. 17:59
    27 января 2015 г. 9:11

Все ответы

  • Добрый день,

    данные способы скрывают панель устанавливая CSS в display:none.

    Откройте страницу в FireFox-FireBug или в режиме разработчика IE (F12) и убедитесь что у вас прошло переопределение CSS данного элемента.

    27 января 2015 г. 8:23
  • Открыл в IE по F12. Ничего похожего на:

    <style type="text/css">
     #s4-leftpanel {
       display:none;
     }
     .s4-ca {
       margin-left:0px;
     }
     </style>

    Я не нашел. Это значит что переопределение CSS у меня не прошло?

    27 января 2015 г. 8:55
  • Может быть всё дело в том, что веб-часть "Content Editor Web Part" я добавляю для левой зоны, а область QuickLaunch Menu она вообще находится вне каких либо зон. Сама по себе. И поэтому стиль не применяется?
    27 января 2015 г. 9:02
  • Если не нашли, то значит и нет такого кода.

    1. Откройте CEWP еще раз и проверьте его содержимое.

    2. Так же проведите инспектирование стиля элемента.

    Удобнее работать в FireBug.

    27 января 2015 г. 9:05
  • Кстати различается разметка в SP2010 и в SP2013.

    Вам нужен другой код для вставки:

    <style>
    .ms-core-navigation { DISPLAY: none }
    #contentBox { margin-left: 0px }
    </style>

    или

    <style unselectable=”on”>
    /* hide left menu bar */
    #sideNavBox {
    display: none;
    }
    /* adjust position of content */
    #contentBox {
    margin-left:20px!important;
    }
    </style>

    • Помечено в качестве ответа VARD32 27 января 2015 г. 17:59
    27 января 2015 г. 9:11
  • ООО!!! Ну так это же совсем другое дело! Получилось. Щас буду рыть дальше! Если Вы не против - можно я буду задавать вопросы по ходу "пьесы"? :)
    27 января 2015 г. 9:23
  • ООО!!! Ну так это же совсем другое дело! Получилось. Щас буду рыть дальше! Если Вы не против - можно я буду задавать вопросы по ходу "пьесы"? :)
    Не против, просто все зависит от часового пояса :)
    27 января 2015 г. 9:28
  • Спасибо. Я из Екатеринбурга ))
    27 января 2015 г. 9:41
  • Можно ещё вопросик по части понимания классов?

    Вот к примеру перевел я страницу по F12 В режим просмотра классов (кода). Веду стрелкой по вложенной иерархичной структуре, а в это время, интерактивно вижу, что в некоторых местах подсвечивается маркером. И, к примеру, я понимаю, что вот на этой строке (что под курсором мыши) подсвечивается на странице тот блок, который мне нужно... ну скажем скрыть!

    Смотрю что у меня находится под курсором мыши. К примеру:

    <div class="ms-breadcrumv-box ms-tableCell ms-verticalAlignTop">

    .....

    .....

    Значит ли это, что создав текстовый файлик с изменением стиля и добавлением атрибута display:none

    нужная мне часть скроется?

    К примеру если файлик будет содержать это:

    <style unselectable=”on”>
    #ms-breadcrumv-box ms-tableCell ms-verticalAlignTop {
    display: none;
    }
    </style>

    Нужная мне часть исчезнет?

    P.S. я пробовал - не исчезла! Но если атрибут display:none дописать прямо в режиме отладчика, то требуемая часть исчезает.

    Что я делаю не так?


    27 января 2015 г. 11:39
  • Вы пытаетесь сделать верно, но не забывайте про иерархию классов CSS и наследование...

    Добавьте тег так:

    <style unselectable=”on”>
    #ms-breadcrumv-box {
    display: none !important;
    }
    </style>

    Тег !important указывает на перезапись ранее существующих свойств.

    Если вам помог какой-то ответ, то пометьте его как правильный, тем самым вы поможете найти правильный ответ для других разработчиков.
    27 января 2015 г. 12:22
  • Есть еще способ, Открываем сайт в дизайнере и 

    на тот случай если нет желания возиться со стиляи и js


    27 января 2015 г. 13:40
  • Спасибо, Александр. На сколько я знаю, этот способ скрывает пункты меню, но занимаемое им место не освобождает?! (хотя могу ошибаться)
    27 января 2015 г. 18:02
  • Попробовал. Но чего то не исчезает элемент :(

    Вот что я делаю:

    На рисунке видно, что выделена строка с классом "js-callout-launchPoint", а на самой странице подсвечен маркером значок "!". Его то и надо мне убрать.

    Но сделав код:

    <style>
    #js-callout-launchPoint {DISPLAY: none!important;}
    </style>

    и вставив его через веб-часть "Редактор контента" ничего не происходит.:(

    Что я делаю не так???

    28 января 2015 г. 3:40
  • Отвечу сам себе, т.к. нашел ошибку! (Но всё равно не понимаю принцип по которому правильно определяется целевой класс). Можно сказать "попал наугад".

    По видимому, в стиле я использовал неправильный класс (несмотря на то, что подсвечивался именно он)

    Правильный класс это "DeltaPlaceHolderPageDescription", т.е. тот, что стоит выше строчкой и определяется в атрибуте "id".

    Правильно ли я понимаю, что класс, стиль которого нужно изменить, выбирается исключительно в атрибуте "id" ?

    28 января 2015 г. 4:13
  • Место чего?

    Вы добиваетесь очистить несколько бит заглавий? :)

    Еще можно проще. site settings- Change the look - выбираем шаблон- Site layout- меняем с сиетла  OSLO.

    28 января 2015 г. 11:46
  • Нет, я хочу понять, что если мне однажды понадобится поменять какой то стиль (увиденный мной в отладчике (IE по F12) то как мне определить, что именно это за стиль? Т.е. тот что прописан в атрибуте id=... или тот что в атрибуте class=... Пока что с атрибутом "class" у меня ничего не получилось.
    29 января 2015 г. 3:44
  • Добрый день,

    Один из самых частых вопросов в процессе знакомства с новыми стандартами -- в чем разница между атрибутами HTML-элементов "id" и "class". Ведь эффект, вроде бы, одинаковый.

    Одинаковый эффект у них только в самых простых случаях использования в CSS. На самом деле отличий полно.

    СУТЬ

    id
    уникальное собственное имя элемента на странице, то есть на странице не должно быть нескольких элементов с одним id. Например блоку с шапкой сайта можно дать id="title".
    class
    вольный признак, который дается обычно нескольким элементам, чтобы отличать их от других. Например, картинкам, которые просто сопровождают текст, можно дать class="decor", а картинкам, которые важны для понимания текста -- class="content".

    СЛЕДСТВИЯ

    Из этой сути прямо или косвенно вытекают остальные отличия, которые видны и в HTML, и в CSS, и в скриптах.

    Якорные ссылки
    Если нужно поставить ссылку на какой-то элемент в странице, то ему достаточно дать id (<h2 id="about">...</h2>) и ссылаться на него якорем (http://site/path/#about). Это, кстати, предпочтительный способ взамен старого <a name="...">.
    Множественные признаки

    Элементу можно задавать несколько классов через пробелы: <img class="important centered printable">. Причем их можно использовать и по отдельности:

    /* все important элементы */
    .important {color:red;}
    

    ... и в сочетании:

    /* элементы с important и centered одновременно */
    .important.centered {border:solid black 1px;}
    

    Обратите внимание, что между классами в CSS-правиле нет пробела.

    Разный вес в CSS

    У каждого правила в CSS есть "вес", по которому определяется порядок их применений. У id этот вес больше. Поэтому если у элемента задан и id, и class:

    <h2 id="about" class="important">...</h2>
    

    ... то из двух правил

    #about     {color:green;}
    .important {color:red;}
    

    ... выиграет первое, цвет заголовка будет зеленым. (Веса правил -- это отдельная песня, о ней будет статья в свое время.)

    Поиск в скрипте
    Элемент с "id" можно легко найти в скрипте с помощью функции document.getElementById(). Для классов такой функции нет.
    29 января 2015 г. 6:24
  • Спасибо.
    29 января 2015 г. 9:52