Drupal 7

Загрузка изображений в зависимости от размеров экрана.

Рассмотрим один из вариантов загрузки, к примеру, фоновых изображений в зависимости от размеров экрана пользователя. Это актуально, если в качестве фона используется слайдшоу из изображений.

Основная идея алгоритма заключается в следующем: jQuery-метод после построения DOM-структуры страницы отправляет запрос на сервер с указанием ширины экрана. Сервер обрабатывает запрос, подготавливает изображения соответствующего размера и возвращает их в качестве ответа.

Изображения разместим в каталоге /sites/default/files/background. Также предварительно необходимо создать нужные "Стили изображений".

Создадим специальный модуль ajax_module с 3 файлами: ajax_module.info, ajax_module.module и ajax_module_script.js.

ajax_module.info:

Теги: 

CKEditor + wysiwyg. Настраиваем визуальный редактор.

Модуль Wysiwyg позволяет подключать визуальные редакторы для редактирования текста на сайте. В качестве такого редактора я использую CKEditor 3.6.6.

Рассмотрим возможность подключения сторонней темы (например, BootstrapCK-Skin), поскольку стандартные выглядят довольно ужасно. Для CKEditor 4 есть официальная тема Moono, советую использовать ее, однако она не портирована на предыдущие версии редактора.

Скачиваем нужную тему, распаковываем в каталог /sites/all/libraries/ckeditor/skins, таким образом, полный путь будет выглядеть так: /sites/all/libraries/ckeditor/skins/BootstrapCK-Skin.

Не загружаются изображения кнопок в панели редактора CKEditor. Drupal 7

Проблема проявляется после обновления библиотеки CKEditor с версии 3 на версию 4, как показано на изображении:

Для ее устранения необходимо очистить кэш в Drupal и браузере.

Для Google Chrome: Settings - Show advanced settings - Clear browsing data - Empty the cache.

Теги: 

Правильное подключение js-скрипта. Drupal 7.

Для использования сокращенного варианта вызова jQuery методов необходимо применять следующий код:

1. Вариант 1

jQuery(function($) {
   $(document).ready(function() {
      .....
   });
});

2. Вариант 2

(function ($) {
   $(document).ready(function() {
      .....
   });
})(jQuery);

Теги: 

Сообщение о подтверждении отправки формы во всплывающем окне. Webform. Drupal 7

Далее привожу простой способ переноса сообщения после отправки пользователем формы Webform во всплывающее окно.

1. Перейдите в режим редактирования соответствующей формы. Выберите вкладку Webform - Form settings.

Поле Confirmation message оставьте пустым, оно нам не понадобится. В разделе Redirection Location выберите Custom URL и введите следующий текст (редирект будет действовать на главную страницу сайта): ?confirmation=yes.

Если наша форма расположена на заранее известной странице, то используем адрес этой страницы, например: home?confirmation=yes

Теги: 

Скрываем ссылки на смену языка (language links) внутри ноды. Drupal 7.

При добавлении функционала перевода контента внутри нод появляются дополнительные ссылки в блоке links inline.

В Drupal 6 для их скрытия необходимо реализовать хук hook_preprocess_node(&$vars) и внести соответствующие изменения (более подробно).

В Drupal 7 эта опция доступна на странице /admin/config/regional/i18n/node (Конфигурация -> Локализация -> Мультиязычные настройки -> Настройка материала). Поставьте галочку напротив пункта "Скрыть ссылки на перевод содержимого".

Создание виджета для голосования с помощью jQuery.

Данная статья основана на главе 18 книги "CMS Drupal 7 Руководство по разработке системы управления веб-сайтом" (автор - Тодд Томлинсон).

В книге есть достаточно много интересных глав, но на мой взгляд она уже устарела, помимо этого в примерах часто встречаются ошибки либо неточности, которые могут быть связаны как с дальнейшим развитием Drupal, так и с опечатками (с некоторыми ошибками и их исправлениями можно ознакомиться по этой ссылке). Поэтому я решил выложить полностью работоспособный модуль Plusone. Версия Drupal - 7.19, версия jQuery - 1.4.4.

Теги: 

Страницы