Как да създадем уебсайт за снимки в Drupal, част 3

За финалната част от тази поредица ще ви преведем през последните етапи на изграждане на уебсайт за фотография от нулата, използвайки системата за управление на съдържанието на 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, ние продължаваме да разработваме нашата
сайт преди тестване и последващо внедряване на уеб хостинг платформа …

01 Създайте връзки към менюто за галериите

След създаването на някои галерии ги свързахме с основната навигация, така че посетителите на сайта да могат лесно да ги разглеждат. В областта Администриране щракнахме върху Структура, след това върху Главно меню за навигация и редактиране.

Въведохме заглавие за връзката в менюто, след това въведохме ‘/ media_gallery / 1’ в полето Link, като повторихме тази стъпка за останалите галерии, заменихки ‘/ 1’ с ‘/ 2’, ‘/ 3’ и т.н.

02 Подобряване на изображенията

Нашите галерии ще се възползват от „лайтбокс“ за показване на снимките. Избирането на изображение ще отвори изскачащо наслагване, през което можем да щракнем, за да видим всички изображения, показани в галерията.

Colorbox е популярен лайтбокс плъгин, който е работил с няколко версии на Drupal, така че е добре установен и се поддържа активно.

Можете да намерите страницата му тук - надникнете в описанието на приставката, за да видите какво може да направи.

03 Изтеглете модула Colorbox

От описанието ще забележите, че в Colorbox има два отделни елемента - модул и приставка - и приставката е отделно изтегляне.

Нека започнем с модула. Превъртете до края на страницата и намерете версията на Drupal 8 (това е горната една от двете зелени кутии), мишката върху връзката tar.gz, щракнете с десния бутон и изберете Копиране на адрес на връзката.

Върнете се в Администраторската зона на сайта, кликнете върху раздела Extend, щракнете върху Install New Module, поставете URL адреса и щракнете върху Install.

04 Изтеглете приставката Colorbox

Върнете се на страницата за изтегляне на Colorbox; веднага под Зависимости щракнете върху връзката Colorbox Plugin 1.x. Това ще запази компресиран архивен файл в номинираното от компютъра ви място за изтегляне.

Сега трябва да създадете директория във вашата система за файловете с приставки Colorbox. Съгласно инструкциите на страницата за изтегляне на Colorbox, създайте директория, така че пътят до файловете да стане (име на сайта) / библиотеки / colorbox /, след което разопаковайте архива на това място.

05 Поставете некомпресираните приставни файлове

С некомпресирания архив би трябвало да можете да видите 14 файла в директорията, включително най-важния jquery.colorbox-min.js JavaScript файл.

Ако папката ви показва нещо различно, уверете се, че търсите на правилното място - папката (sitename) / modules / colorbox има синтаксис, който е много сходен. (Тази папка трябва да съдържа 22 файла, включително осем подпапки - вижте вмъкването по-горе.)

06 Активирайте модула Colorbox

След като вече сме инсталирали модула Colorbox, сега трябва да го активираме. (Този процес не е автоматичен.) Върнете се в Администраторската зона на вашия сайт и кликнете върху раздела Удължи.

Превъртете надолу две трети от страницата; под раздела Медия поставете отметка вляво от Colorbox. В долната част на страницата щракнете върху Инсталиране.

Отидете на Отчети и стартирайте отчет за състоянието: ако Colorbox не е посочен в Намерени грешки, тогава всичко е наред.

07 Вижте ефекта от новата ни лайтбокс

Сега да видим каква е разликата, която е направила една лайтбокс с изображение. Щракнете върху Назад към сайта в горния ляв ъгъл на екрана и извикайте една от галериите, които сте добавили към основната навигация.

Кликнете върху изображение и то ще се отвори в изскачащ слой. Двойка бутони в долния ляв ъгъл ви позволяват да се придвижвате през изображенията в галерията, докато X в долния десен ъгъл затваря изскачащия прозорец - всичко работи добре.

08 Прегледайте информацията за надписа на изображението

Друга характеристика на Colorbox е способността му да показва надпис за изображенията, който изскача от дъното на изображението, което се разглежда, когато мишката върху него.

Понастоящем се използва алтернативният текст (кратко описание, използвано от четците на екрана или когато изображението не се зарежда), което въвеждаме за всяка снимка, докато качваме файловете с изображения. За да промените надписите, отворете файла с изображение в менюто Съдържание / Файлове.

09 Добавете някои други ключови страници към сайта

С показването на изображението, което изглежда по-добре сега, можем да започнем да изграждаме сайта и да добавяме някои други ключови елементи. Първо, нека създадем страница „Информация“, за да очертаем фотографските услуги, които предлагаме.

Кликнете върху раздела Съдържание, щракнете върху Добавяне на съдържание и изберете Основна страница. Въведете желания текст плюс вградено изображение, изрязано до подходящ размер. (Използвахме 200 х 200 пиксела.) Други страници за изграждане включват страницата за добре дошли.

10 Оценете напредъка и добавете други елементи

Така че сега имаме напълно функциониращ уебсайт за фотография, организиран в поредица от галерии, които показват изображенията в изскачащ слой с информация за надписи.

Това е добро начало, но това е само началото. Други елементи на сайта, които бихте могли да помислите за добавяне, включват редовни публикации в блога, за да отворите разговор с посетителите на вашия сайт - и това е друга функция, която Drupal поддържа веднага.

Последни стъпки: внедрете вашия локален сайт в мрежата

Така че завършихте своето изграждане и изгладихте някои груби ръбове, като го изпробвахте напълно - сега е време да внедрите сайта си в интернет и да го разкриете пред глобална аудитория. Ето как се прави …

1. Намерете доставчик на хостинг услуги

След като сайтът ви е напълно изграден и тестван и всички грешки или проблеми са изгладени, той е готов да бъде пуснат за глобална аудитория.

Първата стъпка е да намерите хостинг доставчик. Уверете се, че вашият хостинг доставчик може да поддържа PHP и MySQL, изисквани от Drupal.

2. Изтеглете FTP клиент на вашия компютър

Протоколът за прехвърляне на файлове (FTP) е средство, чрез което качвате файловете на вашия локален сайт към вашия доставчик на уеб хостинг. Един от най-популярните FTP клиенти е FileZilla, който работи както на Windows, така и на macOS. Можете да намерите FileZilla тук.

3. Качете файловете с помощта на контролния панел

Вашият доставчик ще ви даде достъп до контролен панел за управление на сайта на едно място - cPanel е популярна опция. Следвайте инструкциите на вашия доставчик за внедряване, но имайте предвид, че прехвърлянето на файлове и конфигурирането на настройките може да отнеме цял ден.

е любимото списание за фотография в света. Всеки брой е пълен с най-новите новини, рецензии, уроци, експертни съвети за покупка, съвети и вдъхновяващи изображения. Освен това, всеки брой се предлага с избор от бонус подаръци, представляващи интерес за фотографи от всякакви способности

Най-добрите уеб сайтове за хостинг на фотографи: вземете своето портфолио онлайн
Най-добрите безплатни опции за съхранение в облак за фотографи: платформи и приложения
Най-добрите онлайн курсове по фотография - от начинаещи ръководства до майсторски класове
Най-добрите конструктори на уебсайтове за фотографи
Най-добрите мениджъри на пароли
Най-добър студентски лаптоп
Най-добрият софтуер за редактиране на снимки

Интересни статии...