если в коде шаблона сайта используется функция setadditionalcss это означает что
Цитата |
---|
login754 написал: Добрый день.Имеется ввиду создание активного или пассивного шаблона для статической страницы?Спасибо за ответ. |
Цитата |
---|
Валентин Золотов написал: Доброй ночи. Что-то затроил и написал в подключении скриптов в хэде SITE_TEMPLATE_PATH через php-теги, хотя это и так php. Следовательно они не подключились. Дописал через функцию, но без SITE_TEMPLATE_PATH. Это сильно влияет на результат? Сейчас только отключился. |
Правильно подключать через скрипты
Цитата |
---|
Валентин Золотов написал: Просто говорили что делать только то, что написано, я тоже не выносил ничего. |
Цитата |
---|
Иван Малышин написал: Уточните, вы о чем? В терминологии разработки по 1С-Битрикс нет разделения на «активный» и «пассивный» шаблон |
Здесь такое разделение есть.
А как скоро оно выйдет, есть примерные сроки, чтобы ориентироваться?
Какой браузер используется на боевом экзаменационном сервере? Не хром случайно, славящийся своей «производительностью»? Можно ли его заменить, скажем на Firefox, причем более старых версий (25-30)?
Цитата |
---|
login754 написал: А как скоро оно выйдет, есть примерные сроки, чтобы ориентироваться? |
Цитата |
---|
login754 написал: Еще такой момент. На демосервере не то, что установить, работать не возможно. все безбожно тормозит. Не все могут похвастаться мощными машинами. Будут ли на боевом экзаменационном сервере тормоза? |
Для торможения локального демосервера я не знаю причин, кроме как малого количества ресурсов для виртуальной машины.
Нет, комодо и саблайм, но саблайм почему-то очень медленный в терминале
Записал, посмотрю этот редактор.
Да ладно, невозможно все помнить наизусть 🙂
В списке заданий из файла Ex1AllType.pdf есть такое задание:
[ex1-t6-15] Реализовать возможность выбора, с каким демо-контентом создавать новую страницу
сайта: пустую или с контентом страницы page.html.
Это нужно реализовать с помощью активного, либо пассивного шаблона для статической страницы?
Хотя бы приблизительно? Через неделю, месяц, три месяца, полгода, год?
Может ли так оказаться, что реальные билеты будут содержать задания, которых нет в файле Ex1AllType.pdf?
Цитата |
---|
login754 написал: Это нужно реализовать с помощью активного, либо пассивного шаблона для статической страницы? |
Цитата |
---|
login754 написал: Хотя бы приблизительно? Через неделю, месяц, три месяца, полгода, год? |
Цитата |
---|
login754 написал: Может ли так оказаться, что реальные билеты будут содержать задания, которых нет в файле Ex1AllType.pdf? |
Цитата |
---|
Валентин Золотов написал: Доброй ночи. Что-то затроил и написал в подключении скриптов в хэде SITE_TEMPLATE_PATH через php-теги, хотя это и так php. Следовательно они не подключились. Дописал через функцию, но без SITE_TEMPLATE_PATH. Это сильно влияет на результат? Сейчас только отключился. |
Правильно подключать через скрипты
Цитата |
---|
Иван Малышин написал: Конкретные задания будут меняться, пополняться. Но темы заданий, способы их решения не меняются. |
Имеется ввиду новый тип заданий, а не изменение текущих.
Этот пост несколько привел в замешательство.
Экзамен все-таки является стрессовой ситуацией, а потому хотелось бы минимизировать количество «сюрпризов» на нем и заранее подготовиться, прорешав задания по всем темам.
Какие там могут появиться еще новые темы?
Цитата |
---|
Валентин Золотов написал: Просто говорили что делать только то, что написано, я тоже не выносил ничего. |
Сейчас это не станет причиной не сдачи.
Но нужно смотреть на правила экзамена и описание заданий, скоро выйдет обновление экзамена №1, будут уточнены требования по lang файлам
Еще такой вопрос:
Можно ли в качестве пути забытого пароля указывать /bitrix/admin/, или же это будет считаться ошибкой и нужно «кровь из носу» использовать LocalRedirect в индексной странице своего раздела?
Изменяем пользовательский интерфейс коробочного Битрикс24
Всем привет!
Продолжаем учиться правильно кастомизировать Битрикс24
В изучении этой темы вам поможет исходный код примеров из статьи, а так же запись вебинара, на котором мы показали решения «в живую»:
Под катом подробная статья, слово коллегам из Интерволги:
[spoiler]
Отличие подходов к доработке Б24 и сайта на БУС
Считайте Битрикс24 сайтом, разработанным на БУС – платформа, технологии – те же. Битрикс24, как и любой другой сайт, включает шаблоны сайта, публичную часть (разделы и страницы), компоненты и шаблоны компонентов. Однако при установке обновлений публичная часть тоже обновляется. Поэтому публичную часть, шаблоны сайта и компонентов так же можно считать ядром Битрикс24.
Как известно, вносить изменения в ядро нельзя. В Битрикс24 это означает, что нельзя изменять не только файлы Bitrix Framework, но и публичную часть, шаблоны сайта и компонентов. Как минимум потому, что ваши изменения будут удалены при очередном обновлении.
С копированием шаблонов компонентов ситуация еще интереснее.
Во-первых, даже если вы скопировали шаблон в каталог local с тем же именем, что и оригинальный, система будет подключать его всегда, вне зависимости от обновлений. Это, как минимум, означает, что после очередного обновления клиент не увидит новых функций, а также не будут исправлены ошибки в этом шаблоне, если они есть. Но это не самое страшное.
Во-вторых, компоненты Б24 представляют собой целостную систему и их код написан исходя из предположения, что во всей системе используются оригинальные шаблоны. Это означает, что кастомизированные шаблоны не ожидаются системой. Кастомизированный шаблон может привести к информационной несовместимости с остальными частями системы и стать источником странных, трудноуловимых ошибок.
Контекстное меню сущности CRM в списке
Вкладка в карточке сущности CRM
Действие в ленте сущности CRM
Карточка звонка
Типы пользовательских полей
Также REST-приложения могут регистрировать собственные типы пользовательских полей. Они могут быть использованы везде, где есть возможность добавить такие поля.
Пример поля REST-приложения в карточке CRM. Просмотр:
Если вы посмотрите на код шаблона сайта (/bitrix/templates/bitrix24), то увидите некоторое количество вызовов ShowViewContent. Штатные компоненты системы используют эти отложенные области для встраивания своих элементов. Но и вы тоже можете добавлять свою верстку!
Важно! Это «недокументированная возможность». Названия областей могут измениться со временем без предупреждения.
В качестве примера добавим свою кнопку в строку заголовка [ пример на вебинаре ]. Следующий код можно запустить из init.php.
Кнопку мы создаем с помощью модуля UI-библотека (ui). Сначала подключаем расширения «стили кнопок» (ui.buttons) и «иконки для кнопок» (ui.buttons.icons) с помощью класса Extension главного модуля. После этого необходимые стили будут загружены браузером.
Саму кнопку «Отчет» формируем с помощью HTML. Она ничего не делает, цель — научиться встраивать элементы.
У нас получится следующее:
3. Типы пользовательских полей
Можно использовать возможность типов пользовательских полей встраивания в карточки сущностей. Не обязательно делать настоящее поле, можно вывести свою верстку.
Однако этот способ работает только для карточек и списков. При этом само поле нужно создать в системе и следить за тем, чтобы его не удалили.
Чтобы создать свой тип пользовательского поля в коробке, необходимо объявить класс этого поля и зарегистрировать его в системе с помощью события OnUserTypeBuildList [ пример на вебинаре ]
Наследовать класс своего поля от класса другого поля может быть удобно, однако вы рискуете получить неправильную форму наследования. Поэтому, рекомендуется наследовать свой класс от TypeBase — базового класса всех типов пользовательских полей.
Важно определить константу USER_TYPE_ID (именно с таким именем). Она используется системой для различения типов полей.
Метод GetUserTypeDescription должен возвращать описание поля для системы: ID типа поля, класс-обработчик поля, название в интерфейсе управления пользовательскими полями, методы визуализации поля. Этот метод должен являться обработчиком события OnUserTypeBuildList.
Метод GetDBColumnType используется при создании поля нашего типа в какой-либо сущности. Он возвращает физический тип данных для СУБД.
Нас интересуют методы GetPublicView и GetPublicEdit. С помощью них происходит визуализация поля в карточках сущностей в публичной части. Они оба должны возвращать HTML. Выведем кнопки разных цветов с помощью модуля ui.
Помните, что некоторые карточки сущностей не отображают поле в режиме просмотра, если оно не заполнено. Чтобы быть уверенным, что при сохранении данных поле оказалось заполненным, в методе GetPublicEdit также выводится скрытый input.
Обратите внимание, что CJSCore автоматически передает на клиент необходимые языковые строки в зависимости от текущего языка. Получить к ним доступ можно с помощью JS-функции BX.message.
Перезагрузите страницу, откройте панель инструментов разработчика в браузере и выполните следующий JS-код в консоли:
Вы должны увидеть приветственное сообщение.
Важно! Весь JS-код, добавленный с помощью классов CJSCore, Asset или функций AddHeadScript, SetAdditionalCSS, будет объединен в один файл, если это включено в настройках главного модуля. При этом удаление вызова CJSCore::Init не приведет к удалению вашего кода из файла с объединенным кодом. Это значит, что вы не можете управлять загрузкой вашего кода на сторону клиента путем вызова или не вызова CJSCore::Init. Следует применять другой подход.
В custom_stuff.js следует лишь объявить все необходимые функции и классы, которые вам понадобятся для решения задачи (например, «добавить кнопку», «показать диалог подтверждения»).
Если же необходим запуск каких либо функций при загрузке страницы, то следует добавить на страницу еще один небольшой скрипт, который это сделает. Добавить этот скрипт можно с помощью метода Asset::addString (на замену AddHeadString). Он не будет объединен с другим JS-кодом, таким образом, вы можете контролировать запуск кода из custom_stuff.js со стороны сервера.
Например, чтобы метод helloWorld автоматически вызывался после загрузки каждой страницы, нужно сделать следующее:
Теперь рассмотрим несколько примеров.
Пример 1. Кнопка «поблагодарить сотрудника» на странице профиля
[ пример на вебинаре ]
На странице профиля есть небольшой блок действий. Добавим в него пункт «Поблагодарить сотрудника», вот сюда
Для начала добавим в custom_stuff.js функцию, которая создает кнопку.
Здесь узел, представляющий кнопку, создается с помощью функции BX.create (тег a с соответствующим текстом). Также к нему сразу привязывается обработчик клика.
С помощью функции BX.findChildByClassName выполняется поиск узла DOM-дерева — блока действий на странице профиля, а, затем, в нем выполняется поиск контейнера (группы действий). Мы берем первый найденный контейнер и добавляем в него созданную кнопку с помощью метода appendChild.
Теперь добавим вызов написанной функции на странице профиля.
Здесь мы получаем шаблон пути (ЧПУ) к странице профиля из настроек модуля «Интранет» с помощью Option::get, а затем проверяем соответствие текущего URL данному шаблону с помощью CComponentEngine::parseComponentPath.
Посмотрим, что получилось.
Теперь реализуем обработчик клика по этому пункту. Выведем всплывающее окно с полем ввода текста.
На случай двойного клика по нашей кнопке мы убеждаемся, что нет открытых всплывающих окон (если есть — закрываем и уничтожаем). Затем создаем новое окно и выводим его.
Про параметры всплывающего окна можно узнать из записи вебинара.
Посмотрим, что получилось.
На событие клика по кнопке «Отправить начальнику» запускается функция helloWorld. При выполнении реальной задачи, вы, например, могли бы сделать AJAX-запрос, который выполняет настоящую отправку сообщения.
Пример 2. Создание документа на диске из шаблона
[ пример на вебинаре ]
При нажатии на кнопку «Создать документ» в диске появляется окно, в котором можно выбрать, создать документ на компьютере или в облачном сервисе. Добавим в это окно выбор шаблона документа.
В данном случае мы не можем добавить нужную верстку сразу после загрузки страницы, т. к. всплывающее окно появляется в DOM-дереве в момент его открытия. В этом случае мы можем проверить, существуют ли какие-нибудь события, связанные с открытием этого окна.
Выполните в консоли браузера следующий код.
Теперь нажмите кнопку «Создать документ». В консоли браузера должно появиться следующее.
Значит, существуют события, связанные со всплывающим окном, одним из которых мы воспользуемся.
На самом деле фрагмент DOM-дерева для всплывающего окна будет готов уже к моменту onPopupWindowIsInitialized. В целях демонстрации мы подпишемся на событие onAfterPopupShow, чтобы добавить верстку для выбора шаблона.
Создадим функцию в custom_stuff.js, которая регистрирует обработчик события onAfterPopupShow с помощью функции BX.addCustomEvent.
Обратите внимание, что обработчик события onAfterPopupShow будет вызываться при каждом открытии любого всплывающего окна. Поэтому в самом начале мы проверяем, обрабатываем ли мы открытие окна создания документа или нет. Узнать ID всплывающего окна можно из лога событий.
На этот раз HTML-код выбора шаблона довольно объемный. Получим его с сервера с помощью AJAX. Мы используем функцию BX.ajax.get, чтобы выполнить запрос.
Важно! Не забывайте передавать параметр sessid и проверять его в обработчике запроса. Это необходимо для предотвращения некоторых атак.
Полученный код добавим во всплывающее окно. Ссылка на узел DOM-дерева хранится в поле contentContainer объекта всплывающего окна.
В целях демонстрации обработчик AJAX-запроса просто отдает верстку для шаблонов. При решении реальной задачи будет уместно вызвать компонент, генерирующий эту верстку.
Осталось сделать запускающий скрипт. Поскольку код на клиенте проверяет, открывается ли окно создания документа или другое. Значит мы можем подписываться на событие открытия окна на любой странице. Поэтому просто будем выполнять следующий код на каждом хите.
Теперь при открытии окна создания документа выводится список шаблонов.
Пример 3. Дополнительные поля в карточках ранней версии канбана
[ пример на вебинаре ]
Не так давно данный пример стал устаревшим, т. к. в канбане появились события. Тем не менее, описываемый подход полезно рассмотреть, на случай, если вы попадете в ситуацию, когда части страницы строятся динамически, а событий, за которые можно «зацепиться» нет. Например, при доработке свежей функциональности.
Весь интерфейс канбана строится на стороне клиента с помощью JS. В этом легко убедиться, отключив выполнение JS в браузере. Перед нами стоит задача добавления поля в карточку канбана.
Прежде чем переходить к «грубым» хакам, рассмотрим пример того, как можно дождаться появления на странице карточек, а затем выполнить свой код.
Реализуем функцию, которая выполняется через равные промежутки времени и проверяет наличие нужного нам элемента в DOM-дереве.
Таким образом, когда сетка канбана появится на странице, будет выполнена функция CustomStuff.addHelloWorldToKanban.
Существует и другой метод ожидания элемента DOM-дерева: с помощью MutationObserver.
Теперь реализуем функцию, которая добавит «Hello World!» в каждую карточку.
Функцию CustomStuff.extendKanbanOnFirstLoad будем вызывать, когда открывается любая страница раздела канбана лидов.
Посмотрим, что получилось.
Также нужно учитывать, что канбан имеет свойство обновлять свое состояние при изменениях на сервере. Например, при добавлении нового лида, его карточка появится без перезагрузки страницы. Чтобы дополнительные поля появились и в ней, момент ее добавления также придется обработать тем или иным образом.
Пример 4. Подтверждение на получение публичной ссылки в диске
[ пример на вебинаре ]
Существуют задачи, которые предыдущим способом делать либо дорого, либо вообще не возможно.
JS — особенный язык В нем позволяется заменить любую функцию или метод на свою реализацию.
Например, в контекстном меню объекта диска есть пункт «Получить публичную ссылку». Никаких событий при этом не происходит. Рассмотрим обработчик события клика по этому пункту меню.
Видим, что у некоторого объекта вызывается метод openExternalLinkDetailSettingsWithEditing, который создает публичную ссылку и показывает ее во всплывающем окне. Мы хотим запросить подтверждение на получение ссылки перед тем, как она будет показана. Для этого нам не надо знать реализацию метода получения ссылки. Мы заменим оригинальный метод на свой, который будет сначала запрашивать подтверждение, а потом просто вызывать оригинал.
Прежде всего нам нужно узнать, к какому классу относится метод и какая у него сигнатура.
Название класса поможет узнать следующий код, который нужно выполнить в консоли.
Далее можно сделать поиск по коду и узнать, что полное имя класса (с пространством имен) будет BX.Disk.FolderListClass. Ну или интуицию включить
Далее необходимо найти сигнатуру метода, который мы хотим заменить, чтобы узнать, какие аргументы он принимает. Для этого нужно открыть исходный код этого класса.
Посмотрим, что получилось.
Теперь, если нажать на этот пункт меню, появится всплывающее окно для подтверждения. Публичная ссылка появится только если нажать «Да».
Бонус: работа с боковой панелью-слайдером
[ пример на вебинаре ]
В последнее время все чаще используется панель-слайдер в интерфейсе КП. Например, при создании задачи, открытии карточки CRM и т. п.
Дело в том, что клик по кнопке, которая открывает слайдер, обрабатывается не на этапе всплытия, а на этапе перехвата, при чем на элементе html. Это значит, что если понадобится выполнить какой-то код перед открытием слайдера, обработчик клика уже не подойдет.
В данном примере мы сделаем окно с подтверждением при создании новой группы соц. сети.
Открытие страницы в слайдере сопровождается событием, на которое мы подпишем свой обработчик и воспользуемся функцией отмены открытия страницы.
Определить, что в данный момент открывается именно страница создания группы можно только по URL. Далее, используем event.denyAction(), чтобы остановить открытие страницы в слайдере и вызываем окно подтверждения. Когда согласие будет получено, еще раз запускаем открытие страницы в слайдере с помощью BX.SidePanel.Instance.open(. ), но на этот раз не останавливаем открытие.
Код всплывающего окна почти не отличается от предыдущего примера.
Теперь при нажатии кнопки «Создать» на странице групп, сначала появляется такое окно.
Также, иногда бывает полезно узнать, открывается ли текущая страница в слайдере или нет. В этом случае достаточно посмотреть на параметр запроса IFRAME. Он будет равен Y, если страница открывается в слайдере.
Кстати, да, в слайдерах находится iframe, в котором и открываются все страницы.
Если в коде шаблона сайта используется функция setadditionalcss это означает что
Цитатник веб-разработчиков В тексте курса вы встретите цитаты, высказанные в разное время разработчиками системы и разработчиками проектов на базе Bitrix Framework. Надеемся, что такие неформальные замечания внесут некоторое разнообразие в процесс изучения. Заодно опытные специалисты поделятся и своим опытом.
Чтобы научиться программировать в Bitrix Framework, нет необходимости изучать всю линейку курсов. Но есть моменты, которые необходимо знать разработчикам о системе, они раскрыты в начальных курсах:
Как построен курс
Общепринятая градация квалификации разработчиков в рамках курса обозначает что:
Начальные требования к подготовке
Для успешного изучения курса и овладения мастерством разработки сайтов на Bitrix Framework необходимо владеть (хотя бы на начальном уровне):
У нас часто спрашивают, сколько нужно заплатить
Но у нас есть Академия 1С-Битрикс, где можно обучиться на платной основе на курсах нашей компании либо наших партнёров.
Тесты
После изучения курса вам будет предложено пройти тесты на сертификацию. При успешной сдаче последовательности тестов на странице Моё обучение можно просмотреть результат обучения и загрузить сертификат в формате PDF.
Комментарии к статьям
Что дальше?
Одновременно с изучением курса Разработчик Bitrix Framework вам придётся обращаться к информации о других технологиях Bitrix Framework. Эта информация размещена в следующих курсах:
Для преподавания оффлайн
Если данный курс берётся в качестве основы для оффлайного преподавания, то рекомендуемая продолжительность: 5 дней (40 академических часов).
Если нет интернета
Скачать материалы курса в формате EPUB. Файлы формата EPUB Чем открыть файл на
Android:
EPUB Reader
CoolReader
FBReader
Moon+ Reader
eBoox
iPhone:
FBReader
CoolReader
iBook
Bookmate
Windows:
Calibre
FBReader
Icecream Ebook Reader
Плагины для браузеров:
EpuBReader – для Firefox
Readium – для Google Chrome
iOS
Marvin for iOS
ShortBook
обновляются периодически, поэтому возможно некоторое отставание их от онлайновой версии курса.