HTML Templates Documentation

Редактирование файлов PSD

Файлы PSD находятся в папке "sources/psd" шаблона. PSD — это исходные файлы дизайна шаблона.

Они состоят из множества слоёв, поэтому любую часть дизайна шаблона можно изменить.

Во время редактирования можно использовать файлы PSD для редактирования картинок контента страниц или изображений, составляющих дизайн.

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

Более детальную информацию о работе с Photoshop можно найти в туториалах.

Редактирование файлов .html и .css

Все редактируемые HTML файлы находятся в папке "site" шаблона (index.html, index-1.html, index-2.html, и т.д.). Каждый файл index-#.html представляет отдельную страницу шаблона.

Sublime Text 3 - это рекомендуемое приложение, позволяющее редактировать контент файлов HTML, но Вы можете воспользоваться любым удобным для Вас.

Чтобы открыть файл .html при помощи программы Sublime Text 3, щелкните правой кнопкой мыши по файлу и в контекстном меню выберите Открыть с помощью > Sublime Text 3. Когда файл открыт, его можно редактировать.

Файлы CSS используются для изменения внешнего вида шаблона, например шрифтов (семейство шрифтов, размер, начертание, цвет и т.д.), фон, значения ширины блоков и т.д. Файлы .css можно редактировать при помощи программы Sublime Text 3.

В нашем онлайн-центре поддержки находятся детальные туториалы о том, как работать с файлами CSS.

Как редактировать текст

Как оговаривалось ранее, весь контент находится в файлах .html. Вам нужны минимальные навыки ориентирования по коду.

Для замены “рыбы” (текста-заглушки) на подготовленый вами текст необходимо проделать следующие действия:

1. Перейдите в папку site шаблона.
2. Откройте файл index.html в редакторе HTML.
3. Можно использовать функцию поиска CTRL+F , чтобы найти нужный текст.
4. Измените текст в редакторе HTML. Сохраните файл и откройте в браузере, чтобы увидеть изменения.

Также, для поиска нужных блоков, можно использовать браузерные инструменты разработчика.

Более детальная информация о инструментах разработчиков находится в описаниях и туториалах.

Предлагаем ознакомиться со статьей Инструменты Разработчика.

Вы можете посмотреть детальный видео туториал Как редактировать текст в шаблонах JS Animated

Как редактировать изображения

Перейдите в папку 'site/img' шаблона. Первый способ - Вы можете загружать изображения с тем же названием и расширением, что и исходные, таким образом заменяя их.

Второй способ - можно загружать пользовательские картинки со своим названием и расширением.

Затем необходимо изменить название файла изображения в html.

1. Откройте файл .html в папке “site” редактором html.
2. При помощи функции поиска CTRL+F найдите изображение в файле html.
3. Отредактируйте название и расширение файла-картинки.

Вы также можете ознакомиться с детальным видео туториалом Как изменять изображения.