В заключительной части этой серии мы проведем вас через заключительные этапы создания веб-сайта с фотографиями с нуля с использованием системы управления контентом Drupal (CMS).
Веб-сайты, созданные с использованием CMS, более сложны, чем сайты, состоящие из фиксированных или «статических» страниц текста, и необходимы для отображения изображений.
Как CMS общего назначения с открытым исходным кодом, Drupal может похвастаться большим сообществом разработчиков и пользуется популярностью у правительств, некоммерческих фирм и образовательных учреждений.
Создание веб-сайта на Drupal сложнее, чем на других CMS, таких как WordPress, поэтому он понравится компьютерно грамотным людям, которым нравится идея «за кулисами» веб-сайта.
Наградой будет специальный и безопасный веб-сайт, построенный на гибко настраиваемой платформе, где дополнительные функции предоставляются путем установки модулей (дополнительных функций) и тем (которые определяют внешний вид).
Чтобы добраться до этого момента, мы начали сборку нашего сайта в локальной среде, используя локальный хост Acquia Dev Desktop.
Начните с загрузки Acquia Dev Desktop и запуска установщика, затем запустите программное обеспечение и выберите «Начать с нуля».
Используйте предлагаемые по умолчанию для поиска файлов кодовой базы в вашей системе, введите имя вашего сайта и примите запросы по умолчанию для версии PHP и имени базы данных. Выберите v8.9.1 в разделе «Установить дистрибутив Drupal», введите всю необходимую информацию, и Drupal будет установлен.
Затем установите модуль Media Gallery и тему Showcase Lite. Затем начните создавать свои галереи…
Что вам понадобится для создания фото-сайта на Drupal
- Компьютер
- доступ в Интернет
- Изображения готовы к загрузке
- Приложение для разработки (мы используем Acquia Dev Desktop)
- Срок: 1 неделя (сборка)
Три этапа разработки сайта Drupal
1. Начните с настройки вашего доменного имени.
В отличие от wordpress.com, Drupal не предлагает вариант хостинга, поэтому вам нужно будет сделать это самостоятельно.
Прежде чем начать, вам также необходимо приобрести доменное имя для своего сайта - посетите Domain.com, Bluehost или www.123-reg.co.uk или найдите поставщика в Интернете.
Введите желаемое название сайта, и вы получите список доступных расширений (.com, .co.uk и т. Д.) И плату за регистрацию.
2. Разработайте свой сайт Drupal на собственном компьютере.
Вы можете установить Drupal на сайт веб-хостинга и создать его там, но разработка вашего сайта на локальном хосте (вашем собственном компьютере) значительно упрощает задачу. Вы можете создавать сайт в своем собственном темпе, устраняя любые возникающие препятствия и улучшая внешний вид по мере продвижения.
3. Разверните готовый сайт у своего хостинг-провайдера.
Когда ваш сайт будет готов, вы можете развернуть его у своего хостинг-провайдера. Передача файлов на хост-сайт и настройка всех параметров может занять до одного дня, но тогда ваш фото-сайт готов к большому раскрытию.
Создайте фото-сайт на Drupal за 10 шагов
Используя локальную среду Acquia Dev Desktop, мы продолжаем разработку наших
site перед тестированием и последующим развертыванием на платформе хостинга веб-сайтов…
01 Создание ссылок меню для галерей
Создав несколько галерей, мы связали их с основной навигацией, чтобы посетители сайта могли легко их просматривать. В области администратора мы щелкнули по структуре, затем по главному меню навигации и редактирования.
Мы ввели заголовок для ссылки меню, затем набрали «/ media_gallery / 1» в поле «Ссылка», повторив этот шаг для других галерей, заменив «/ 1» на «/ 2», «/ 3» и так далее.
02 Улучшение отображения изображений
Наши галереи выиграют от "лайтбокса" для отображения фотографий. При выборе изображения откроется всплывающее окно, по которому мы можем щелкнуть, чтобы просмотреть все изображения, отображаемые в галерее.
Colorbox - это популярный плагин для лайтбоксов, который работал с несколькими версиями Drupal, поэтому он хорошо зарекомендовал себя и активно поддерживается.
Вы можете найти его страницу здесь - взгляните на описание плагина, чтобы узнать, на что он способен.
03 Загрузите модуль Colorbox
Из описания вы заметите, что Colorbox состоит из двух отдельных элементов - модуля и подключаемого модуля - и этот подключаемый модуль загружается отдельно.
Начнем с модуля. Прокрутите страницу вниз и найдите версию Drupal 8 (это верхний из двух зеленых прямоугольников), наведите указатель мыши на ссылку tar.gz, щелкните правой кнопкой мыши и выберите «Копировать адрес ссылки».
Вернитесь в область администратора сайта, перейдите на вкладку «Расширение», нажмите «Установить новый модуль», вставьте URL-адрес и нажмите «Установить».
04 Загрузите плагин Colorbox
Вернитесь на страницу загрузки Colorbox; непосредственно в разделе «Зависимости» щелкните ссылку Плагин Colorbox 1.x. В результате сжатый архивный файл будет сохранен в указанном на вашем компьютере месте для загрузки.
Теперь вам нужно создать в вашей системе каталог для файлов плагина Colorbox. В соответствии с инструкциями на странице загрузки Colorbox создайте каталог, чтобы путь к файлам стал (имя сайта) / libraries / colorbox /, затем распакуйте архив в это место.
05 Поместите несжатые файлы плагинов
В несжатом архиве вы должны увидеть 14 файлов в каталоге, включая очень важный файл JavaScript jquery.colorbox-min.js.
Если в вашей папке отображается что-то другое, убедитесь, что вы смотрите в нужном месте - синтаксис папки (sitename) / modules / colorbox очень похож. (Эта папка должна содержать 22 файла, включая восемь подпапок - см. Вставку выше.)
06 Включите модуль Colorbox
После того, как мы уже установили модуль Colorbox, теперь нам нужно включить его. (Этот процесс не является автоматическим.) Вернитесь в область администратора своего сайта и перейдите на вкладку «Расширить».
Прокрутите вниз две трети страницы; в разделе «Медиа» установите флажок слева от Colorbox. Справа внизу страницы нажмите «Установить».
Перейдите в Отчеты и запустите отчет о состоянии: если Colorbox нет в списке найденных ошибок, значит, все в порядке.
07 Оцените эффект нашего нового лайтбокса
Теперь давайте посмотрим, что изменилось при использовании графического лайтбокса. Нажмите «Вернуться на сайт» в верхнем левом углу экрана и вызовите одну из галерей, которые вы добавили в основную навигацию.
Щелкните изображение, и оно откроется во всплывающем окне. Пара кнопок в нижнем левом углу позволяет перемещаться по изображениям в галерее, а значок X в правом нижнем углу закрывает всплывающее окно - все работает нормально.
08 Просмотрите информацию о подписи к изображению
Еще одна особенность Colorbox - это возможность отображать подписи к изображениям, которые появляются из нижней части просматриваемого изображения, когда вы наводите на него указатель мыши.
В настоящее время он использует альтернативный текст (краткое описание, используемое программами чтения с экрана или когда изображение не загружается), который мы вводим для каждой фотографии при загрузке файлов изображений. Чтобы изменить какие-либо подписи, откройте файл изображения в меню Content / Files.
09 Добавьте на сайт еще несколько ключевых страниц
Теперь, когда изображение выглядит лучше, мы можем приступить к созданию сайта и добавлению некоторых других ключевых элементов. Прежде всего, давайте создадим страницу «О нас», чтобы описать предлагаемые нами фотоуслуги.
Щелкните вкладку «Содержимое», щелкните «Добавить содержимое» и выберите «Базовая страница». Введите желаемый текст и встроенное изображение, обрезанное до подходящего размера. (Мы использовали 200 x 200 пикселей.) Другие страницы для создания включают страницу приветствия.
10 Оцените прогресс и добавьте другие элементы
Итак, теперь у нас есть полностью функционирующий веб-сайт фотографии, организованный в серию галерей, которые отображают изображения во всплывающем окне с информацией о подписи.
Это хорошее начало, но это только начало. Другие элементы сайта, которые вы могли бы подумать о добавлении, включают регулярные сообщения в блоге, чтобы начать разговор с посетителями вашего сайта - и это еще одна функция, которую Drupal поддерживает прямо из коробки.
Заключительные шаги: разверните свой локальный сайт в сети
Итак, вы завершили сборку и сгладили некоторые острые углы, полностью протестировав ее - теперь пора развернуть свой сайт в Интернете и раскрыть его глобальной аудитории. Вот как это делается…
1. Найдите поставщика услуг хостинга.
После того, как ваш сайт будет полностью построен и протестирован, а все ошибки и затруднения устранены, он будет готов к выпуску для глобальной аудитории.
Первый шаг - найти хостинг-провайдера. Убедитесь, что ваш хостинг-провайдер поддерживает PHP и MySQL, которые требуются Drupal.
2. Загрузите FTP-клиент на свой компьютер.
Протокол передачи файлов (FTP) - это средство, с помощью которого вы загружаете файлы своего локального сайта на своего провайдера веб-хостинга. Один из самых популярных FTP-клиентов - FileZilla, который работает как в Windows, так и в macOS. Вы можете найти FileZilla здесь.
3. Загрузите файлы с помощью панели управления.
Ваш провайдер предоставит вам доступ к панели управления для комплексного управления сайтом - cPanel - популярный вариант. Следуйте инструкциям вашего провайдера по развертыванию, но имейте в виду, что передача файлов и настройка параметров может занять до целого дня.
- самый популярный в мире журнал о фотографии. Каждый выпуск упакован последними новостями, обзорами, учебными материалами, советами экспертов по покупке, советами и вдохновляющими изображениями. Кроме того, в каждом выпуске есть набор бонусных подарков, которые интересны фотографам любого уровня подготовки.
Лучшие сайты-хостинг-сайты для фотографов: разместите свое портфолио онлайн
Лучшие варианты бесплатного облачного хранилища для фотографов: платформы и приложения
Лучшие онлайн-курсы фотографии - от гидов для начинающих до мастер-классов
Лучшие конструкторы сайтов для фотографов
Лучшие менеджеры паролей
Лучший студенческий ноутбук
Лучшее программное обеспечение для редактирования фотографий