Внешность

Пожалуйста, экспериментируйте в песочнице!

Администраторам (основы)

Содержание

Что такое скин?

Скин это связка файлов управляющая внешним видом страниц (цветами, шрифтами, рамками и т.п.) и тем как они свёрстаны. Простейший путь понять что делают скины это попробовать воспользоваться следующими ссылками. Они все ведут на одну и ту же страницу (Внешность) на сайте pmwiki.org и открываются в новом окне.

Как вы заметили, все скины показывают одинаковое содержимое страниц, но такие элементы как меню, заголовок и подпись -- полностью переменились. Например, разные скины могут отображать меню слева, справа или даже его убрать. У некоторых скинов могут иметься функции, которых у других нет, особенно если они сделаны с применением редких рецептов.

Таким образом, скин это всего лишь набор файлов определяющий как отображать страницы PmWiki. Нормальные скины хранят в подпапках pub/skins/. Типичный скин содержит несколько файлов:

  • Файл шаблона, такой как skin.tmpl или gemini.tmpl. Шаблон написан на HTML или XHTML и является скелетом для скина. В нём размещаются специальные маркеры говорящие PmWiki где вставить содержимое страницы.
  • CSS файлы управляющие внешностью скина.
  • Файлы изображений для украшения страницы. Распространённые форматы изображений: .jpg, .png и .gif.
  • PHP файлы, такие как skin.php. Они позволяют скинам обесепечить дополнительные настройки и функциональность невозможную в HTML и CSS.
  • Файлы документации, традиционно readme.txt или skinname.txt. Обычно рассказывают об особенностях установки или хитроумных функциях.

Где берут скины?

Скины доступны в коллекции Skins:Skins. Скины из коллекции были выложены другими администраторами для любого пожелавшего ими воспользоваться. Часто они имеют свои собственные возможности перестройки. Когда вы найдёте понравившийся скин, следуйте по ссылке для скачивания файла архива со скином.

Как использовать или установить скин?

Большинство скинов упаковано в файлы типа .zip, .tgz или .tar.gz. Вам понадобится его распаковать известным архивным ПО.

  1. Распакуйте скин в папку pub/skins/ лежащую внутри папки pmwiki. Большинство хорошо сделаных скинов создают подпапку с собственным именем в pub/skins/.
    • Если скин не сделал папку сам, создайте её и переместите его файлы в неё.
  2. Раскройте ваш файл local/config.php, и добавьте строчку вроде

    $Skin = 'my-favourite-skin';

    где 'my-favourite-skin' это имя папки скина.

Перезагрузите страницу с вашего вики в броузере и вы сможете увидеть разницу.

Если вам хотелось бы позволить посетителям сайта выбирать скин из нескольких установленных, то загляните в рецепт Skins:SkinChange. (Тот, который мы использовали для демонстрации выше.)

Существует ряд способов как перестроить внешность скина, включая добавление операторов в /local/config.php совместимых со скином; добавление css файлов в /pub/css/, таких как local.css(для всего вашего вики) и MyGroup.css(для MyGroup); и непосредственное редактирование файлов скина. Если скин обновляется регулярно, то вероятно вы захотите избежать изменения файлов в папке скина. Проверьте страницу скина в Рецептурнике на предмет спец. указаний.

Как сделать свой скин?

Лучший способ сделать свой первый это изменить копию базового скина PmWiki.

  1. Сделайте копию папки pub/skins/pmwiki и дайте копии имя нового скина.
  2. В вашем файле local/config.php установите $Skin в имя нового скина.
  3. Измените файлы шаблона и CSS подходящим образом.
  4. Проверьте ваш новый скин.
  5. Повторите шаги 3 и 4 пока вы не будете довольны результатом.

Причина по которой мы рекомендуем начать с базового скина PmWiki в том, что это довольно простой скин, и весьма проще, чем многие скины из скинов. Отправной пункт скина это файл шаблона(.tmpl), определяющий общую вёрстку страницы. Внутри файла шаблона ряд специальных подстановок и директив указывающие PmWiki места для вставки данных относящихся к текущей странице для отображения. Страница SkinTemplates? описывается формат и директивы более подробно.

В материал данной страницы не входит объяснение как пользоваться HTML(язык разметки гипертекста), XHTML (расширяемый HTML, который немного новее) или CSS(каскадные таблицы стилей), так как и без того в интернете уже есть много хороших уроков по всем трём. Одно лишь предостережение: если вы наткнётесь на уроки объясняющие как пользоваться тэгами <font> или <blink>, или spacer.gif, то они уже устарели как минимум пять лет, так что пропускайте их и ищите далее.

Вам следует протестировать ваш скин на разнообразных броузерах -- в идеале надо попробовать как можно больше броузеров на как можно большем количестве платформ, но как минимум протестируйте на Internet Explorer 6 и Firefox/Mozilla, как наиболее распространённых и сильно отличающихся. Не забудьте при тестировании опробовать разные размеры окон и шрифтов.

Инструменты, которые могут понадобиться

Есть множество отличных примеров таких программ доступных бесплатно.

HTML и CSS редактор(ы). Существует два типа редакторов: графические (WYSIWYG, или "what you see is what you get" -- "что ты видишь -- то ты и получишь"), и для кодирования руками или программистские редакторы. Графические редакторы не так страшны для новичков, но так вы не научитесь многому. И не узнаете HTML/CSS так близко, как если бы пользовались редактором для кодирования руками. Какой бы вы не выбрали, возьмите тот, который подсвечивает синтаксис в коде, так как это помогает увидеть ошибки. Функция предпросмотра на лету не так полезна при написании PmWiki скина, потому что PmWiki подставляет своё содержимое вместо переменных и вставляет меню и текст страницы, отсутствующие в предпросмотре.

Тестовая вики. Вы наверняка не хотите чтобы посетители вашего сайта видели разрушения в вашем скине. Дабы такого не было, лучше установить тестовую вики либо на реальном вебсервере, либо на вашем компьютере. Пользователи Linux или MacOS часто уже имеют встроенный вебсервер и PHP на их машинах, в отличии от Windows, где такое не распространено. Если это относится к вам, тогда возможно вам будет полезно заглянуть в рецепт Cookbook:Standalone, который позволяет запустить PmWiki без вебсервера. Или же вы можете найти множество локальных серверных пакетов устанавливающих вебсервер, PHP и другие компоненты (вроде MySQL) уже настроенные на совместную работу. Постарайтесь найти такой пакет, чтобы он включал те же версии ПО что и использующиеся на вашей реальной PmWiki. В этом случае у вас будет меньше проблем с переносом отлаженного обратно.

FTP клиент для пересылки файлов на ваш вебсервер. Возможно у вас он уже есть.

Цветоподборщик(Color picker). Может быть уже включенным в ваш редактор, или же вам придётся использовать отдельное приложение. Очень полезное для образования и сохранения цветовых палитр.

Смотри также

<< Местная подстройка | Документация | Обновление >>

Перевод страницы PmWiki.Skins - Оригинал перевода PmWikiRu.Skins - Ссылаются
PmWikiRu.Skins: редакция от 30.01.2017 16:32
PmWiki.Skins: редакция от 14.10.2023 03:50