Блог - помощник...

Приветствую уважаемое сообщество!
Возникла на одном проекте необходимость организовать живое общение в стандартных клубах на InstantCMS.
В просторах не нашел ни одного похожего решения или скрипта, так как данное решение объединяет в себе практически - Чат - Конференцию - Обсуждения и т.д. и т.п. воедино.
Долго расписывать функционал не буду - в двух словах.

Доброго времени суток, уважаемое сообщество!

Первый вариант - Псевдо WAP - с выходом новых релизов морально устарел, а вопросы по его использованию актуальны. Положение спас уважаемый Администратор - упростив внесение изменений и дополнений до минимума.

Суть идеи осталась прежней – направить пользователей сайта, работающих по средствам КПК и телефонов  на облегченный (резиновый) дизайн сайта (т.е. с отсутствием графики – отсутствием показа не нужных позиций для модулей – типа рекламы и прочего лишнего) - путем прямой ссылки или набором определенного адреса сайта в адресной строке браузера.

Может быть данное решение не будет красивым, как те что были на сайте представлены, но я вот тоже решил попробовать сделать выбор города в профиле пользователя, чтобы было красиво и удобно. В моем варианте самое ценное это база данных, которая является почти такой же, как на сайте mamba. База содержит информацию по странам, регионам и городам.
Итак как поставить данное решение:
1. Распаковать архив в корень сайта.
2. Через phpmyadmin вставить дамп базы в свою базу данных сайта.
3. Открыть профиль и проверить что все работает.


ссылка для скачивания http://www.instantcms.ru/users/files/download613.html

Исходные данные
- Мы имеет рабочий сайт на InstantCMS версии Х.Х.Х;
- самостоятельный шаблон для сайта;
- время, прямо пропорциональное скорости вашего Интернет соединения…

Необходимо
- Обновить версию сайта на InstantCMS до версии Y.Y.Y.;
- сохранить пользователей;
- весь имеющийся контент на сайте…

I. Подготовительный этап

1. Закрываем САЙТ – естественно указываем причину остановки -
(Админка – Настройки – Вкладка «Сайт» - Пункт - Причина остановки работы: Отображается на главной странице при отключении сайта…)
2. Ждем минут 10-15 – пока пользователи и гости, находящиеся на страницах сайта и изучающие его контент полностью покинут сайт (Это видно из Админки – сколько пользователей и гостей на сайте в данный момент)
3. Данные пункт необходим в основном для тех у кого на ХОСТИНГЕ нет АВТОМАТИЧЕСКОГО ЕЖЕДНЕВНОГО бекапа САЙТА и БАЗЫ!
  Снимаем с FTP полную копию сайта:
- путем прямого копирования на жесткий диск вашего компьютера;
- с использованием сторонних скриптов;
- использую программные средства вашего ХОСТИНГА…
  Снимаем в phpMyAdmin – копию БАЗЫ – сохраняем её на жесткий диск вашего компьютера (из практики, лично я снимаю несколько вариантов – простой и архивированный)
4. Скачиваем актуальную на момент обновления версию InstantCMS Y.Y.Y. с официального сайта InstantCMS.ru в разделе СКАЧАТЬ
4.1 Ознакомимся в архиве движка с файлом readme.txt, который содержит:
- требования InstantCMS к серверу, установку дополнительных расширений;
- список папок для которых необходимо установить особые права (CHMOD);
- краткую инструкцию по обновлению…

ВНИМАНИЕ! Также в данном файле могут быть дополнительные инструкции по удалению ненужных папок на ftp – просто дочитайте все до конца.

5. Распаковываем архив в локальную папку на жестком диске.

ВНИМАНИЕ! Если у вас установлен свой ВОДЯНОЙ ЗНАК - ВАТЕРМАРК (watermark.png), свои иконки в шаблоне, свои АВАТАРЫ по умолчанию, свои изображения в каталоге и т.д. советую предварительно – удалить все данные изображения из ПАПКИ с InctantCMS, подготовленной к обновлению – ВО ИЗБЕЖАНИИ ПЕРЕЗАПИСИ!

II. Основной этап

1. В файловом менеджере перезаписываем поверх имеющихся папок на замену – все папки и корневые файлы – из локальной папки (с новой версией Y.Y.Y.) на ftp.

ВНИМАНИЕ! При использовании различных файловых менеджеров или распаковке архива прямо на ftp – возможно, что перезапись файлов не произойдет или произойдет не полностью – так как не все файловые менеджеры на хостингах имеют ПРАВА НА ПЕРЕЗАПИСЬ ФАЙЛОВ.

ИМХО - Лично я использую Total Commander и перезаписываю в «ручном режиме».

ВНИМАНИЕ! Хотелось бы поподробнее остановиться на шаблонной системе.
- во избежании недоразумений - советую - просто удалить из папки templates папку с шаблоном по умолчанию _default_ и закачать её полностью с нуля из нового архива InstantCMS;
- если вы используете свой автономный шаблон - обязательно замените все файлы *.tpl и у себя в папке с шаблоном.
Лично я просто удаляю папки - components и modules в папке с своим шаблоном и записываю на их место новые... Плюс сравниваю - какие еще произошли изменения - в папках и файлах своего шаблона и папки шаблона _default_ - возможно появились новые папки - изменились версии скриптов и т.д.
Сравниваю при помощи Total Commander’a файлы css.
При необходимости вношу изменения в свой шаблон.

2. В любом случае – при окончании перезаписи файлов – советую убедиться в замене файлов на ftp – для этого всего лишь необходимо – визуальным сравнением нескольких папок на выбор в локальной папке с распакованным архивом InstantCMS  и аналогичной папке на ftp – открыли например в Total Commander в различных окнах – и сравнили визуально размер имеющихся файлов. Также убедиться что все файлы находящиеся в корне (там где файл .htaccess) заменились на новые.
3. Далее следуя указаниям по обновлению – запускаем или переключаемся на браузер
Запускаем скрипт МИГРАЦИИ – набором в адресной строке – http://ваш_сайт/migrate
4. Далее следуем указаниям которые будут отображаться в окне браузера…

ВНИМАНИЕ! Не забываем удалять после миграции папки INSTALL и MIGRATE на FTP.  

5. Заходим на сайт – включаем его – осуществляем проверку целостности деревьев БД (Админка – Настройки – проверка деревьев)

III. Заключительный этап

1. Чистим куки-кеши сайта и браузера(ов).
- на ftp сайта (актуально на момент 1.6.2) папка  cache – откроем её и удалим содержимое за исключением служебного(ых) файла(ов) – служебные файлы – есть в архиве Y.Y.Y.
2. Закрываем браузер – перезагружаем компьютер.
3. Заходим на сайт и проверяем его работоспособность.

Если что то не работает… - не надо начинать пить, кричать что всё плохо, «откатываться» по бекапам сразу назад…, а нужно просто:
1. Перейти на шаблон по умолчанию _default_ (Админка – Настройки – вкладка «Дизайн») и проверить есть ли данная ошибка там (если работает все правильно, то смотрите свой шаблон);
2. Еще раз сверить все файлы и папки на предмет замены на ftp и архива Y.Y.Y.;
3. Если не работает, например, какой то конкретный модуль или компонент – то необходимо зайти в его настройки в Админке и посмотреть все ли там выставлено правильно;
4. Зайти на официальный сайт – возможно уже вышел патч;
5. Детально описать проблему на форуме официального сайта.

Успехов при обновлении - MadMах

Решил начинать выкладывать материал в блоге главами. Для удобства дальнейшего редактирования  и доработки. Все пожелания по улучшению и расширению справочника принимаются – только  личными сообщениями  – т.к. уследить за всеми комментариями и форумом практически невозможно…
        
Данное пособие не является догмой и не содержит максимум информации (т.к. это практически невозможно уложить в 35 - 40 страниц) и служит справочным материалом в основном для начинающих сайтостроителей, столкнувшихся с проблемой создания и верстки индивидуального шаблона сайта под InstantCMS.

Принцип для верстки будем использовать наиболее распространенный – смешанный.

Выбор метода верстки выбирает верстающий – исходя из своих знаний, подготовки и непосредственно из стоящей перед ним задачи. Лично сам я самоучка и мои личные познания в данных областях – это всего лишь практический опыт.

Спорить о преимуществах одного метода  верстки над другим – дивами или классическими таблицами – не будем. Задача для начала одна – дать общее представление о верстке в целом. В дальнейшем, я думаю, найду время описать процесс верстки на дивах.

Вот мы наконец – то решились и захотели создать свой блог (социальную сеть,  портал) используя бесплатную систему для сообществ InstantCMS (Целиком и полностью одобряю ваш выбор!).
Установили CMS для сайта на реальный хостинг (или локально) не суть.
Опробовали функционал – начали набивать контентом – появились первые пользователи и т.д.
Следующий вопрос  (хотя по идее, в дальнейшем, этот вопрос нужно выносить на первое место) – это создание индивидуального дизайнерского оформления сайта (т.е. его визуальное представление аудитории пользователей Интернета – его логотип  и фирменный стиль).

В данном справочном материале мы рассмотрим следующие вопросы:

Глава I. Подготовительный этап.
1. Подбор дизайн – макета для нашего сайта;
2. Определение позиций для вывода модулей;
3. Подготовка изображений для верстки.

Глава II. Верстка – template.php
1. Сопутствующее программное обеспечение;  
2. Из чего состоит шаблон;
3. Приступаем к верстке.

Глава III. Оформление – styles.css
1. Оформление с использованием каскадных стилей;
2. Пример индивидуального оформления модулей, текста и ссылок;
3. Дополнительные меню и формы на css.

Глава IV. Практические рекомендации.
1.  Подключение шаблона;
2. Дальнейшее обслуживание шаблона;
2. Возможные проблемы и их решение.

Глава V. Универсальный шаблон для верстки.
1. Фиксированный;
2. Резиновый;
3. Как с ними работать?


1. Подбор дизайн – макета для нашего сайта.

Прежде чем приступить к верстке самого шаблона - необходимо продумать и подготовить дизайн-макет сайта. Подготовка проводиться для наглядного т.е. зрительного представления подбора цветовой гаммы сайта, цвета ссылок, текста и другого дизайнерского оформления (а в основном - для утверждения дизайн-макета сайта заказчиком – во избежание лишней и не нужной работы в будущем).

Исходя из конкретной тематики будущего (или уже имеющегося сайта) выбираете свой стиль оформления, например:  на сайте готов – будут не уместны – яркие и пестрые цвета.

Варианты создания дизайн-макетов:
а) Нарисовать его самому, использую прикладные графические программы;
Сложного в этом по большому счету ничего нет. С тем огромным количеством клипарта и исходных материалов, находящихся на данный момент в Интернете, в магазинах на CD, DVD. В любом случае попробовать хотя бы один раз это необходимо.
б) Посетить специализированные сайты – предлагающие бесплатные дизайн-макеты сайтов, как в графическом формате, так уже и в «нарезанном» для верстки виде.
в) Скачать архивы уже сверстанных под любые системы шаблонов и переверстать (портировать) их под InstantCMS.
г) Взять за основу любую полиграфическую продукцию, буклеты,  рекламные проспекты, каталоги продукции и т.д. учитывая что над ними работали профессиональные дизайнеры и при помощи сканера перевести их в необходимый для вас формат.
д) Можно использовать смешанный тип оформления – т.е. шапку и подвал от одного дизайна, а оформление модулей с другого дизайна.

В любом случае на данном этапе мы определяем практически 80% оформления сайта.
Естественно, корректировки и доработки будут происходить на протяжении всей жизнедеятельности сайта. При создании макетов рекомендуется использовать web цвета!

Данный вопрос оставляю на Ваш выбор. В учебных целях будем считать, что мы определились с макетом. Для образца я взял шаблон с сайта www.freecsstemplates.org – Newfangled (Рис. 1) – лишь только потому, что, его цветовая гамма сочетается с официальным сайтом InstantCMS.


Важно также определить каким будет ваш шаблон – его стиль – фиксированным (постоянным), меняющим размер от разрешения (резиновым) или смешанным (постоянный каркас и резиновое графическое оформление).

2. Определение позиций для вывода модулей в шаблоне.

Перед версткой необходимо более точно определить количество необходимых позиций для вывода модулей. Сложного в этом ничего нет – зрительно, с использованием графического редактора или просто на листе бумаги – продумываем позиции, которые и будем в дальнейшем верстать.

Исходя из логики имеющегося шаблона, то позиции можно определить следующим образом  (рис. 2 – обозначены красным цветом) –
- logo – логотип или текстовый вывод названия сайта;
- info – баннер или вывод графическо – текстовой информации;
- meny – горизонтальное меню сайта;
- left – top – bottom – right – стандартные позиции для вывода модулей;
- footer – информация разработчика и правообладателя.


Но в ученических и благоразумных целях мы расширим количество выводимых позиций
(рис. 3 – обозначены синим цветом)
Добавив к вышеуказанным:
- topmeny – для вывода – например объявлений;
- pathway – глубиномер сайта;
Разобьем позицию footer на три – lfoot – footer – rfoot;
- lfoot – рейтинг сайта
- rfoot – не забываем – что наш сайт работает на InstantCMS
- foot – счетчики посещений


3. Подготовка изображений для верстки.

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

Подготовка изображений производиться с учетом выбора стиля вашего шаблона (фиксированный, резиновый, смешанный) и имеет определенное значение для будущей верстки.

Я не ставлю целью в данной статье рассматривать процесс нарезки, подгонки и оптимизации изображений – ибо этому можно посвятить целую книгу.

Будем считать что мы их подготовили.

Подводя итого подготовительного этапа – мы имеем:
- дизайн-макет сайта;
- определились с основными цветами текста и ссылок, графическим оформлением;
- продумали позиции для модулей;
- подготовили (нарезали) изображения для верстки с учетом, что стиль шаблона будет  
  Фиксированный в 960px по ширине.




1. Сопутствующее программное обеспечение

Внимание - важно!
Для дальнейшего удобства работы нам необходимо:
- Джентльменский Набор Web - разработчика ("Д.н.w.р", читается "Денвер")
Включающий в себя набор дистрибутивов (Apache+SSL, PHP5 в виде модуля, MySQL5, phpMyAdmin и т.д.)и программную оболочку, используемую Web - разработчиками (программистами и дизайнерами) для отладки сайтов на "домашней" (локальной) компьютере без необходимости выхода в Интернет.
Для версий 1.5 и выше необходимо установить расширение для Денвера.
- установленный тренировочный сайт на InstantCMS - версии на которую мы будем верстать шаблон;
Версии InstantCMS всегда можно cкачать на официальном сайте instantcms.ru
- установленный визуальный редактор типа - Macromedia Dreamweaver
  MX 2004, Adobe Dreamweaver CS3 или любой другой.
Выбрал их так как на примере данных редакторов удобно проводить обучение

Еще не плохо бы было иметь под рукой:
- графический редактор для обработки и подгонки изображений.
Лично я использую - Adobe Photoshop и Corel
- файловый менеджер Total Commander .
Данный менеджер имеет удобную структуру и все необходимое для работы с FTP, поиска файлов, текста и т.д.

Приступим.
1. Запускаем Денвер, через ярлык – Start Denwer.
2. Запускаем браузер (у меня – пока рулит Mozilla Fierfox) и открываем в нем наш тестовый сайт на InstantCMS (естественно по адресу указанному нами при установке cms - например - http://www.mysait.ru )
3. Через - Total Commander (или как вам удобнее) открываем наш локальный FTP – у меня он находиться на виртуальном диске Z:\, сам сайт находиться по адресу - Z:\home\mysait.ru\

2. Из чего состоит шаблон;

На примере шаблона по умолчанию рассмотрим составляющие шаблона. Внутри папки "_default_" (/templates/_default_) находиться:
- папка "basic" – содержит служебную информацию.
- папка "components" – содержит шаблоны компонентов
- папка "css" – содержит файл с оформлением шаблона – styles.css
- папка "images" – включает в себя все графические объекты используемые в шаблоне
- папка "modules" – содержит шаблоны модулей
- папка "plugins" – содержит шаблоны плагинов
- файл "index.htm" – на случай если кто-то наберет в адресной строке что-нибудь типа      
   "http://www.mysite.ru/templates/mytemplate".
- файл "jquery.iepnghack.1.6.js" – файл скрипт
- файл "positions.txt" – файл содержит позиции назначенные для вывода модулей
- файл "readme!.txt" – справочная информация
- файл "template.php" – непосредственно файл шаблона самой страницы.

(папки ./components/components_c,  ./modules/modules_c и ./plugins/plugins_c  содержат в себе кеш шаблонов и должны быть доступны для записи)

По-умолчанию шаблоны компонентов движок будет искать в папке:
/templates/ваш-шаблон/components  
Если такая папка не будет найдена, или в ней не окажется нужного шаблона,
то движок возьмет нужный файл из папки /templates/_default_/components
Это означает, что в папке ./components вашего личного шаблона могут быть
только те файлы, дизайн которых должен отличаться от стандартного.
Все сказанное выше идентично работает также для модулей и плагинов.

3. Приступаем к верстке.

Чтобы создать новый шаблон, сначала необходимо создать для него папку внутри папки "templates". В папке templates\   (Z:\home\mysait.ru\templates\) создаем папку для нашего шаблона – и назовем её – mytemplate. Система сама обнаружит появление новой папки и шаблон станет доступен для выбора из панели управления сайта.

Важно!
В папке templates находиться уже папка -  _default_ (шаблон по умолчанию). Нам необходимо в учебных целях скопировать все папки и файлы из папки - _default_ в созданную нами папку – mytemplate.

Т.е. на данный момент в папке templates\  у нас две разные папки (_default_ и mytemplate) но с одинаковым содержимым.

Приступим к работе! Все изменения в дальнейшем мы будем производить только папке mytemplate!

1. Открываем файл positions.txt (templates\mytemplate\positions.txt)  для редактирования (я это делаю прямо в Total Commander – f4), меняем название шаблона на своё и ниже добавляем построчно все будущие позиции нашего шаблона!


#
#  В этом файле перечислены все позиции, предусмотренные для                        
#  вывода модулей в шаблоне Mytemplate.                                                
#  
#  Чтобы добавить новую позицию для вывода модулей,
#  добавьте ее название (латинскими буквами и цифрами) в список.
#  Затем в нужном месте шаблона вставьте код: <?php echo cmsModule("название_позиции");?>
#
#
topmeny
logo
info
meny
left
right
top
bottom
lfoot
rfoot
foot

Закрываем – сохранив изменения!

2. Далее - все подготовленные изображения копируем в папку images (templates\mytemplate\images\)

Все эти предварительные операции мы производим для дальнейшего удобства работы.

3. Запускаем Dreamweaver  - через вкладку Файл – Открыть  - выбираем  

Z:\home\mysait.ru\templates\ mytemplate\ - файл template.php