Создание alenin.info
После создания резюме, я приступил кновому ТЗ – создание главной страницы, на каторой мне надо было прикрутить слайдер, где в будущем будут показываться мои работы. Но для начала надо было перенести свою резюме на другой адрес – resume.alenin.info .
Для переноса резюме, создал поддомен resume.alenin.info. Так-как все сайты и поддомены расположены в корне сервера /etc/nginx/sites-enabled, создал файл resume.alenin.info. Скопировал туда стандартную конфигурцию файла default и изменил пару строчек:
/var/www; приобрела вид /var/www/resume.alenin.info/;
index index.php; заменил на index index.html;
server_name localhost; изменил на server_name resume.alenin.info;
Перезапускаем сервис nginx:
service nginx restart
Переходим по адресу resume.alenin.info – Все работает.
Создание alenin.info ничем примечательным не отличалось. Помимо самого верстки требовалось найти не совсем ужасный слайдер, и настроить ее для сайта.
Шаг первый: «поиск»
Находим понравившийся слайдер и скачиваем его.
Шаг второй: «установка»
Скаченный архив распаковываем в папку сайта. Можно переименовать папку со скриптом в удобочитаемый для себя вид. После установки подключаем библиотеку jquery (нужна для плагина slides) и сам скрипт. Библиотеку jquery можно загрузить на сервер, или воспользоваться сервисом Google. Я выбрал второй вариант. Всё это подключается в «HEAD».
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script src="js/slides.js"></script>
Шаг третий: «Настройка»
Создаем на странице «HTML» элементы слайдера:
<div id="slides">
<a href="http://resume.alenin.info"><img src="/img/slide-1.jpg" alt="Slide 1"></a>
<a href="http://resume.alenin.info"><img src="/img/slide-2.jpg" alt="Slide 2"></a>
<a href="http://resume.alenin.info"><img src="/img/slide-3.jpg" alt="Slide 3"></a>
<a href="http://resume.alenin.info"><img src="/img/slide-4.jpg" alt="Slide 4"></a>
<a href="http://resume.alenin.info"><img src="/img/slide-5.jpg" alt="Slide 5"></a>
<a href="http://resume.alenin.info"><img src="/img/slide-6.jpg" alt="Slide 6"></a>
<a href="http://resume.alenin.info"><img src="/img/slide-7.jpg" alt="Slide 7"></a>
</div>
Сделаем запуск слайдера автоматически:
<body onload=$("#slides").slides("play")>
Итог:
Получилось все довольно не плохо
