Шаблоны для artisteer – Artisteer — программа для создания и редактирования шаблонов для Joomla и тем для WordPress

Artisteer Themler Nicepage программы для создания шаблонов и сайтов

 

Artisteer, Themler и Nicepage программы для создания своего сайта и шаблонов популярных CMS самостоятельно, без специальных знаний.  Инструкции, видео уроки, форум, шаблоны
 

Artisteer

Программа на сегодняшний день считается устаревшей, новые проекты рекомендуется делать на заменивших её программах Themler и Nicepage (ред. 05.03.2019 г.)

Artisteer — программа уже несколько лет является лидером в сегменте программ для веб дизайна. Одно из главных достоинств программы: интуитивно понятный интерфейс, доступность для освоения даже новичкам впервые решившим создать сайт.

Последняя на сегодня версия Artisteer 4.3 обладает оптимизированным валидным кодом, использующим современную разметку HTML5. Оптимизированными, по сравнению с пред идущими версиями, стилями CSS, что позволяет делать легкие, не перегруженные страницы.

В Artisteer в отличии от других программ есть возможность уникализировать код шаблона, путем замены демо префикса art- на любой другой, можно получить совершенно уникальный не похожий на любой другой код созданного шаблона.

Подробнее можно прочитать в «Наши статьи —> Artisteer и Themler —> Качество шаблонов в Artisteer» 

Themler

Темлер это современная программа для создания шаблонов и сайтов, проект официально запущен разработчиками 29.07.2015 г. Themler является наследником ( иногда его называют новой версией Artisteer ) и альтернативой программы Artisteer, имеет богатый функционал по созданию шаблонов, для различных движков. Шаблоны создаются на Bootstrap 3.x.

На данный момент лицензия для Themler поставляется бесплатно, при наличии действующей лицензии ( бесплатного периода обновлений ) на программу Artisteer, с приблизительно одинаковым набором возможностей для версий Home и Standart соответственно Personal и Business, плюс есть две дополнительные версии, Themler E-Commerce и Pro, для создания магазинов на базе популярных движков. Посмотреть различие версий можно здесь.

Подробнее о Themler можно почитать в нашем обзоре программы

Nicepage

Nicepage новая программа, от тех же разработчиков, для создания шаблонов и сайтов. Шаблоны в Nicepage можно делать новейшем современном стиле Web 3.0 который позволяет расположить объекты на странице не только в блочном (плоском, web 2.0) формате, но и расположить нужные блоки в любом месте страницы по слоям (web 3.0) при необходимости заступая на уже расположенные блоки. Подробнее о возможностях

Nicepage можно прочитать здесь, в дальнейшем мы добавим еще информации и видео по возможностям.

Nicepage будет находкой для тех кто делает одностраничники (лендинги) так как имеет безграничные возможности по расположению объектов на странице. В Nicepage дизайнер может реализовать все свои самые смелые решения.

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

Nicepage постовляется в четырех версиях которые как и пред идущие программы различаются по воозможностям делать шаблоны для разных CMS. Nicepage Starter — бесплатная, служит скорее для ознакомления и демонстрации возможностей.

Nicepage Personal — позволяет делать шаблоны для WordPress и статичные HTML сайты. Nicepage Business — включает все пред идущее, плюс возможность делать шаблоны для Joomla, плюс более широкий выбор изображений из базы (но во всех версиях можно конечно вставлять свои изображения). Nicepage PRO — самая дорогая версия в которой можно будет делать шаблоны для магазинов на WooCommerce Theme и VirtueMart Template.

Сравнить версии Nicepage Вы можете здесь

Artisteer Themler Nicepage

Программы, это возможность создавать полностью готовые шаблоны для популярных движков WordPress, Joomla, Drupal, Blogger и др. в зависимости от версии программы. Кроме этого в программах можно создавать полностью готовые небольшие сайты визитки без движков, на простых статичных страницах.

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

Из личных наблюдений участников нашего форума установлено, что шаблоны из программ не влияют отрицательно на ранжирование сайта в поиске, скорее наоборот вышеперечисленные плюсы, валидная кроссбраузерная верстка, адаптивный дизайн, легкие страницы, дадут изначальное преимущество вашему сайту. Остальное зависит от внутренней СЕО оптимизации сайта, а не от шаблона.

В программах на сегодня можно реализовать шаблоны любой сложности от простых, используя кнопку «Предложить дизайн» или вставок и редактирования готовых секций в программах Themler и Nicepage, до самых сложных, используя для основы макеты нарисованные профессиональными художниками. Все зависит от ваших целей и желания, можно сделать сайт за 30 мин. выбрав готовые макеты в программе, а можно потратить несколько часов-дней и получить соответствующий результат. 

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

Artisteer 4 программа для создания шаблонов сайтов

• Тип – программа для создания шаблонов сайтов Joomla, WordPress, Blogger, Drupal, DotNetNuke.

 

 

Artisteer – это программа для создания шаблонов сайтов популярных систем управления содержимым (CMS), таких как Joomla, WordPress, Blogger, Drupal, DotNetNuke. В предыдущих циклах статей «Обзор Artisteer (часть 1, 2, 3)», «Обзор Artisteer 3.1 (часть 1, 2, 3)» и «Уроки Artisteer 3.1 (часть 1, 2)» были рассмотрены версии 3 и 3.1. 16 июля 2012 на официальном сайте была опубликована новая версия программы – Artisteer 4.0.0.55648 Beta для Windows. В этой статье будут кратко рассмотрены основные новшества четвёртой версии программы для создания шаблонов Artisteer.

При написании статьи были использованы официальные материалы (перевод с английского) с сайта разработчика. Шаблон будет создаваться для системы управления содержимым Joomla 2.5.6. Программно-аппаратная часть компьютера, на котором производится тестирование:

• Операционная система Microsoft Windows 7 Максимальная SP1 (сборка 7601), x64.
• Разрешение экрана 1920х1080.
• Качество цветопередачи 32 бита.
• Mozilla Firefox 14.0.1.
• Adobe Flash Playe 11.3.300.265.
• Microsoft .NET Framework 4.

Хочу отметить, что на момент написания статьи 17.07.2012 Artisteer 4 поддерживает русский язык интерфейса, но перевод неполный. Скорее всего, это будет исправлено со временем.

К основным новшествам Artisteer 4.0 хочу отнести следующие:

• Обновлено и расширено редактирование содержимого.
• Поддержка HTML5 и CSS3.
• Шрифты Google.
• Доступ к коллекции изображений Flickr.
• Персональный альбом изображений
• Усовершенствованное создание шапки сайта при помощи визуального редактирования.
  • Новый инструмент выделения.
  • Создание коллажей.
  • Маска для текстур.
  • Текстовые блоки.
• Новые опции для изображений.
  • Стиль всплывающего окна Lightbox.
  • Слайд шоу.
  • Добавлено больше источников изображений.
• Возможность разметки нижнего колонтитула (подвала).
• Новые опции стилей.
  • Эффект тени для текста.
  • Новые опции скругления для столбцов и рядов.
• Возможность редактирования HTML элементов управления.
• Усовершенствован инструмент выбора цвета.
• Усовершенствовано меню, создаваемое для сайтов.
  • Границы для заголовков блоков и меню.
• Режим панели.
• Немного переработаны инструменты Идеи (Предложения).
• Общая реорганизация параметров инструментов.
• Плагин SDK.
• Поддержка «Изображения и ссылки» для Joomla 2.5.

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

Сейчас (17.07.2012) в коллекции насчитывается двадцать четыре категории шаблонов (около 181 шаблон).

В отличии от третьей версии в Artisteer 4 нет необходимости в начале создания проекта выбирать, для какой CMS будет создаваться шаблон. После того как шаблон будет готов к установке на сайт, Вы просто выберите CMS и её версию при экспорте.

Редактирование содержимого

В Artisteer 3.1 Вы могли создавать содержимое страниц только при создании тем для

Сайт или блог. В Artisteer 4 Вы можете создавать шаблон и содержимое страницы для любой системы управления содержимым, например, Joomla или WordPress. Более того, Вам не нужно больше выбирать тип шаблона. Просто выберите опцию Include Content при экспорте шаблона (рисунок ниже).

Перемещение содержимого из Artisteer в Вашу систему управления содержимым – это дело двух шагов.

Данная функциональная возможность не удаляет содержимое из Вашей CMS (например, из Joomla). Но на этапе бета тестирования Artisteer 4 рекомендуется создать полную резервную копию Вашего сайта.

Хочу отметить, что это очень полезная функциональная возможность. Несколько раз я обращался в службу технической поддержки Artisteer с просьбой о добавлении возможности редактирования стандартного текста шаблона. При создании шаблона сайта под заказ несколько раз сталкивался с проблемой, когда заказчик абсолютно не представляет, к чему этот текст, таблицы и изображения в шаблоне. Во всех версиях Artisteer до 4-й была одна «стандартная статья» для любого шаблона (пример №1, №2, №3, №4). Приходилось устанавливать шаблон в «пустую» CMS и заполнять несколько страниц нужным содержимым. В Artisteer 4 тоже придётся создавать страницу (или воспользоваться готовыми вариантами собственного «производства» или из коллекции шаблонов Artisteer), но можно создать одну – две тематические страницы про телефоны (если заказчик хочет сайт, посвящённый телефонам) и использовать их для нескольких вариантов шаблонов. Так будет гораздо проще Вам и нагляднее Вашим заказчикам.

При редактировании Вам будет доступна панель инструментов, вкладка Правка (рисунок ниже) чем-то отдалённо напоминающая панель инструментов Microsoft Word.

Привычные инструменты вставки позволят копировать, вставлять и вырезать фрагменты содержимого страницы (текст, списки, изображения). Далее идёт область Стиль и шрифты. В ней Вы можете выбрать один из шести стилей заголовков или стиль абзаца (они, как и раньше настраиваются во вкладке Содержимое (детальнее в статье «Обзор Artisteer (часть 3). Создание WordPress шаблонов»)), задать шрифт, начертание и размер выделенному фрагменту текста. Помимо этого можно задать эффект тени, изменить цвет шрифта, заливку и создать элемент Цитата.

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

Следующая группа инструментов Содержимое представляет повышенный интерес, так как позволяет менять (или создавать) макет содержимого страницы. На рисунке ниже показаны возможные варианты макета содержимого страницы.

Ниже Вы можете видеть пример того, как выглядит статья, созданная средствами Artisteer 4 Beta в шаблоне сайта.

В Artisteer 4.0.0.55648 предусмотрено создание собственного макета (рисунок ниже) при помощи встроенного редактора макетов.

Для блоков макета можно задать стиль (рисунок ниже). Например, можно задать отображение границы между блоками или задать обводку для блоков. Также можно задать заливку для всех или некоторых блоков и задать смешанный вариант сочетания границ и заливки.

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

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

Помимо этого можно задать макет конкретной строки (рисунок ниже).

Как и при создании таблицы в Microsoft Word, в Artisteer 4.0 Вы сможете вставить или удалить строки в общую таблицу макета содержимого страницы. При этом Вы сможете сразу вставлять строки с нужным макетом строки (рисунок выше).

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

Каждая из настроек элементов обладает своими собственными настройками, а те, в свою очередь, своими (рисунок ниже на примере настроек обводки).

Следующая группа инструментов – Вставка. На ней расположен инструмент вставки ссылки (рисунок ниже). При помощи него Вы сможете вставить ссылку или на страницу в интернете или на страницу в проекте Artisteer. Можно указать, как надо открыть страницу (в этом же окне, в новом и так далее), можно задать подсказку для ссылки или указать, что это ссылка на RSS ленту.

Инструмент Изображение позволяет вставить в проект изображение, указав путь на локальном компьютере, адрес в интернете, выбрав изображение из клипарта (по сравнению с 3-й версией в 4-й доступно гораздо больше изображений), а также выбрать картинку из интернет каталога изображений (об этом детальнее немного ниже). При редактировании изображения (рисунок ниже) Вы сможете задать его ширину и высоту, замещающий текст, способ расположения (В тексте, Слева, Справа), границы, поля и задать возможность просмотра увеличенного размера изображения во всплывающем окне при нажатии на миниатюру.

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

Вставка таблицы осуществляется при помощи инструмента Таблица. После вставки таблицы на страницу можно будет добавить, удалить и\или объединить, разделить ячейки, поменять параметры обводки и выравнивания текста в них. Помимо этого можно будет задать ширину таблицы в пикселях или процентах.

Инструмент Controls (рисунок ниже) позволяет вставить такие элементы управления: кнопка, текстовое поле, поле поиска, чек-бокс и радио кнопка.

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

При помощи редактора HTML (рисунок ниже) Вы сможете отредактировать уже существующий код страницы или добавить собственный.

Набор инструментов Слайд шоу (рисунок ниже) позволяет разместить из выбранных Вами изображений (путь на локальном компьютере, адрес в интернете, изображение из клипарта, картинка из интернет каталога изображений) слайд шоу на странице. При этом Вы сможете задать форму слайдов, фон и эффект анимации. В качестве фона можно задать изображение или сплошной цвет. Можно указать такие эффекты как перекрашивание, размытие, текстура, градиент, блики и маска. В качестве эффекта анимации доступно 5 эффектов с возможностью задания скорости, задержки и повтора. Слайд шоу можно просмотреть прямо в Artisteer.

Нужно отметить, что при создании иерархии страниц Вам доступны следующие инструменты (рисунок ниже).

• Новая страница. Создаёт новую страницу.
• Новая дочерняя страница. Создаёт дочернюю страницу для выбранной страницы.
• Новое сообщение блога.
• Правка.
• Переименовать.
• Удалить.
• Использовать под блог. Трансформирует выбранную Вами страницу в сообщение блога. О том, как создать блог на Joomla Вы можете прочитать в статье «Обзор RSBlog (часть 1, 2, 3)».
• Скрыть заголовок статьи.
• Свойства.

Команда Сообщение блога создаст страницу с уже размещёнными на ней некоторыми элементами. Например, пиктограммы печати, сохранения страницы в PDF, метками (тегами) и так далее. Эти элементы можно отключать (рисунок ниже)

Свойства страницы (рисунок ниже) разделены на три части

1. Общие.
2. Page Tgs.
3. Show in Menu.

В Общие Вы сможете задать имя страницы и её заголовок. В PageTgs расположены поля для ввода описания, ключевых слов и мета тегов. Show in Menu позволит Вам указать в каких меню (горизонтальном и\или вертикальном) необходимо отображать ссылку на данную страницу.

Некоторые из вышеперечисленных инструментов были доступны и в версиях 3, но, повторюсь, только при создании шаблона тип Сайт или блог.

В HTML версии шаблона Вы можете увидеть результаты работы некоторых из инструментов Artisteer 4.0.0.55648.

Продолжим рассмотрение новых и обновлённых возможностей Artisteer 4.

Поддержка HTML5 и CSS3

Теперь Artisteer поддерживает самые прогрессивные и новые стандарты для более гибкого создания шаблонов, отвечающих последним требованиям вёрстки (HTML 5 и CSS3). Вы можете внести в шаблон свой собственный код, например, анимацию, непосредственно при помощи Artisteer 4. Это даёт дополнительные возможности для создания шаблонов, а так же делает Ваш сайт не только более красивым и функциональным, но и обеспечивает более долгий срок совместимости с новыми версиями браузеров, так как рано или поздно поддержка устаревших технологий прекращается.

Шрифты Google

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

Доступ к коллекции изображений Flickr

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

Пожалуйста, обратите внимание на то, что изображения, размещённые в Flickr распространяются по лицензии Creative Commons.

Flickr – это интернет-сервис для хранения и использования цифровых фото и видео.

Персональный альбом изображений

В Artisteer 4 Вы можете создавать персональные альбомы изображений (рисунок ниже). Они появляются вместе с изображениями с Flickr.

Для работы с альбомами в боковой панели Choose content image нажмите на All и в появившемся контекстном меню выберите или уже существующий альбом или создайте новый (рисунок ниже). Тут же Вы сможете сортировать найденные во Flickr результаты по релевантности, популярности или дате добавления. Вы также можете включать в альбомы отдельные изображения с компьютера или целые папки с изображениями.

В следующих статьях «Обзор Artisteer 4 (часть 2). Создание меню сайта» и «Обзор Extensoft Artisteer 4 (часть 3). Программа для создания шаблонов Joomla» будут рассмотрены такие новшества как: создание коллажей, маска для текстур, текстовые блоки, разметка нижнего колонтитула, HTML элементы управления и многое другое.

Похожие материалы

 

Полезные ссылки:

Artisteer 4.0 создание шаблонов сайтов

• Тип – программа для создания шаблонов сайтов Joomla, WordPress, Blogger, Drupal, DotNetNuke.

 

Новый инструмент выделения.

Создание коллажей.

Маска для текстур.

Текстовые блоки.

Стиль всплывающего окна Lightbox.

Слайд шоу.

Больше источников.

Эффект тени для текста.

Новые опции скругления для столбцов и рядов.

 

В предыдущей части статьи «Обзор Artisteer 4 (часть 1). Программа для создания шаблонов Joomla» мы начали рассмотрение новых возможностей, заявленных в Artisteer 4.0.0.55648 Beta для Windows. В этой статье будут рассмотрены другие, не менее важные нововведения, например, поддержка плагинов для осуществления совместимости с новыми системами управления содержимым.

Усовершенствованное создание шапки сайта при помощи визуального редактирования

Artisteer 4 Beta обладает новыми средствами по созданию шапки сайта (верхнего колонтитула), которые предоставляют ранее недоступные возможности.

С новыми инструментами Вы сможете:

• добавлять слайд шоу в шапку сайта.
• для каждого слайда можно задать отдельные настройки. Также можно установить эффект перехода для каждого слайда отдельно.

Вы сможете вставить слайд шоу не только в шапку сайта, но и в содержимое страницы, подвал (нижний колонтитул) и в боковую панель. Настройки слайд шоу были рассмотрены в статье «Обзор Artisteer 4 (часть 1). Программа для создания шаблонов Joomla».

Новый инструмент выделения

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

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

Создание коллажей

Если Вам необходимо добавить больше одного изображения в шапку сайта, то в Artisteer 4 Beta Вы сможете это сделать (рисунок ниже).

Маска для текстур

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

В Artisteer 3.1, прозрачные маски были доступны только в качестве специального эффекта текстуры, выбранного из галереи текстур. Вы не могли добавить ещё одну структуру, и если хотели другой эффект, то должны были создать собственные текстуры.

В Artisteer 4.0, прозрачные маски выбираются отдельно, теперь можно добавить маску, а также выбрать и добавить ещё одну текстуру на заголовок. Есть дополнительные опции маски, которые определяют, где и как маска применяется.

При настройке масок Вам будут доступны опции повторения (По горизонтали, По вертикали, Без повторения, Заливка), расположения (По центру, Внизу слева и так далее), отражения (По горизонтали, По вертикали), поворота и масштабирования (рисунок ниже).

Текстовые блоки

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

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

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

Также можно добавить блоки на страницы. Если Вы хотите добавить слайд-шоу на страницу Вашего сайта, то в Artisteer 4.0 это можно сделать с наложением текста поверх него (рисунок ниже).

Новые опции для изображений

Стиль всплывающего окна Lightbox

При вставке изображений Artisteer 4 Beta автоматически добавляет класс атрибутов “art-lightbox” в тег <img/> для создания всплывающего окна (Lightbox) для изображений. Теперь при нажатии на изображение можно просмотреть его увеличенную версию в окне поверх страницы. Вы можете включить или отключить Lightbox в настройках изображения («Preview») (рисунок ниже).

Слайд шоу

Шапка сайта — это не единственное место, куда Вы можете поместить слайд шоу. Везде, где можно разместить изображение, может быть и слайд шоу.

Больше источников

Теперь Вы можете вставить изображение в шаблон, указав его URL или выбрав нужное из онлайн галереи (рисунок ниже).

Разметка нижнего колонтитула

В Artisteer 4 Beta Вы сможете задавать определённую разметку для нижнего колонтитула (подвала), точно так, как это делается для страниц (рисунок ниже). Считаю это очень удобным, особенно учитывая тот факт, что на многих сайтах нижний колонтитул играет роль дополнительного меню, там размещают контактную информацию, логотипы партнёров и так далее.

Новые опции стилей

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

Эффект тени для текста

В большинстве областей шаблона, где можно расположить текст, к нему можно будет применить эффект тени (рисунок ниже).

Новые опции скругления для столбцов и рядов

Данная возможность была описана при рассмотрении редактирования содержимого страницы в статье «Обзор Artisteer 4 (часть 1). Программа для создания шаблонов Joomla».

HTML элементы управления

Теперь в Artisteer 4.0 Вы сможете задать стиль для стандартных элементов управления HTML, таких как радиокнопки, чек-боксы (checkboxes) и так далее. Как правило, они отображаются на страницах сайтов CMS при помощи плагинов. Но теперь, в Artisteer 4, Вы сможете настроить, как именно чек-бокс должен выглядеть. Специально для этого одна из вкладок ленты инструментов Кнопки была переименована в Controls и на неё были добавлены новые инструменты (рисунок ниже). Рассмотрим эту панель более детально. При рассмотрении будут освещены только новые инструменты, которые появились в Artisteer 4.0.0.55648 Beta.

К настройкам кнопок из версии Artisteer 3 добавлено 3 группы инструментов.

1. Contrlos.
2. Поиск.
3. Стиль и шрифты.

В группе Controls собраны настройки для строки ввода текстa (Input), чек-бокса и радиокнопки.

Для HTML объекта управления Input Вы можете выбрать один из пяти стилей оформления, доступный по умолчанию (рисунок ниже).

Также Вы сможете настроить данный элемент более точно при помощи дополнительных настроек, которые разделены на четыре части (рисунок ниже).

1. Input control
2. Градиент.
3. Обводка.
4. Тень.

Основные настройки строки ввода текстa (Input) содержат опции (рисунок выше), позволяющие задать ширину поля (Автоматически или Фиксировано (в пикселях)), вертикальный отступ, скругление, заливку, прозрачность и настроить отображение текста (Цвет, Шрифт, Размер, Стиль).

В качестве градиента можно выбрать один из 57 стилей градиента и задать ему контрастность.

Для границы (рисунок выше) можно задать ширину самой обводки (в пикселях), её стиль (один из 8), задать прозрачность и цвет, выбрав его из палитры цветов, доступных по умолчанию, или задав свой собственный.

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

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

Помимо этого Вы сможете задать собственные настройки стиля для чек-бокса (рисунок ниже).

Они разделены на 6 частей (рисунок выше).

1. CheckBox.
2. Пассивный.
3. Наведённый.
4. Pressed.
5. Градиент. Аналогично настройкам поля ввода текста, описанного выше.
6. Тень. Аналогично настройкам поля ввода текста, описанного выше.

В группе настроек CheckBox (рисунок выше) Вы сможете задать иконку «птички» («галочки») для самого чек-бокса. По умолчанию доступно 14 иконок с возможностью смены цвета, но можно указать и свою собственную из файла (JPG, JPEG, PNG, GIF). Вы можете задать отступ слева и сверху от центра кнопки до центра «птички» («галочки»), можно задать ширину и высоту всей области кнопки (в пикселях), скругление (в процентах), границу (ширину и стиль), а также настроить отображение текста (Цвет, Шрифт, Размер, Стиль).

Группы настроек Пассивный, Наведённый и Pressed позволяют задавать заливку, цвет границы и прозрачность для трёх состояний кнопки соответственно (пассивное, наведённое, нажатое).

Настройки для радиокнопки аналогичны настройкам чек-бокса. За исключением предложенных по умолчанию стилей оформления (рисунок ниже).

Одним из важных элементов навигации любого сайта является поиск. В Artisteer 4.0.0.55648 Beta Вы можете задать толщину обводки поля поиска, тень (можно указать её размер, прозрачность, расстояние и угол), градиент для области поиска, задать иконку, которая будет отображаться в области поиска и задать скругление краёв для этого поля.

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

В HTML версии шаблона Вы можете увидеть результаты работы некоторых из инструментов Artisteer 4.0.0.55648.

Цвета

Выбор цвета также претерпел изменения. Теперь при выборе цвета в разделе Дополнительные цвета всегда доступны два цвета «Чёрный» и «Белый» (рисунок ниже).

При переключении в режим «Настройки цвета» можно для любого цвета задать прозрачность при помощи специального ползунка (рисунок ниже) без возврата к панели инструментов. Стоит отметить, что изменение прозрачности не всегда доступно.

Меню

С Artisteer 4 теперь Вы сможете создавать меню в «журнальном» стиле в несколько колонок (рисунок ниже). Доступно 4 стиля подменю.

1. Многоуровневое.
2. Extended.
3. Megamenu.
4. Megamenu Extended.

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

Границы для заголовков блоков и меню

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

Режим панели

В Artisteer 4.0 появился новый режим отображения параметров настройки различных элементов — «Режим панели». В правой части экрана может отображаться дополнительная панель с настройками того элемента дизайна шаблона, например, меню, заголовка, картинки, с которой Вы сейчас работаете (рисунок ниже).

Это очень удобно, так как Вам не нужно переходить на панель инструментов (ленту инструментов) или открывать дополнительные диалоговые окна для изменения дополнительных параметров стиля элементов.

При нажатии на один из элементов шаблона или содержимого страницы, например, на изображение, появляется контекстное меню с возможностью быстрого доступа к определённым инструментам (рисунок ниже).

Предложения

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

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

Предложения повлияют не только на стили объектов содержимого, но и на его структуру.

Рекомендуется пользоваться предложениями до того, как Вы начнёте создавать содержимое страниц в Artisteer, например, для автоматической генерации содержимого страницы. Это очень удобно, если Вам (или Вашему заказчику) не критично соблюдение тематики содержимого шаблона и будущего сайта. Так как создавать содержимое, особенно включающее большинство элементов (таблицы, рисунки, текст, маркированный и нумерованный списки и так далее), достаточно трудоёмкий процесс.

Реорганизация параметров

Многие опции в новой версии Artisteer были реорганизованы для ускорения доступа к ним и для создания ещё более интуитивно понятного интерфейса в целом (рисунок ниже).

Плагин SDK

Для обеспечения совместимости программы с другими системами управления содержимым в Artisteer 4.0 включён набор средств для разработчиков программного обеспечения (SDK). Если Вы владеете необходимыми навыками работы с HTML и JavaScript, то Вы можете написать плагин, а затем разместить его в Marketplace.

В будущем в Artisteer планируется включить поддержку наиболее популярных CMS и блог-платформ (о том, как создать блог на Joomla Вы можете прочитать в статье «Обзор RSBlog (часть 1, 2, 3)») за счёт плагинов, которые Вы можете добавить в Artisteer. Для получения дополнительной информации о написании плагинов для Artisteer, пожалуйста, обратитесь к вики-странице. Сейчас (20.07.2012) там находится 2 плагина Hello World Plugin и Artisteer HTML Export Plugin, ссылка на краткое руководство по созданию плагинов, ответы на часто задаваемые вопросы по этой тематике и ссылка на соответствующую ветвь форума.

Данное нововведение, поможет расширить область использования Artisteer, сделать его более популярным и, как следствие, привлечь больше пользователей, идей и разработчиков, что будет делать программу всё более функциональной и удобной. Немного более детально этот вопрос будет рассмотрен в статье «Обзор Extensoft Artisteer 4 (часть 3). Программа для создания шаблонов Joomla». Подробнее о различных лагинвх экспорта Вы можете прочесть в статье «Обзор Artisteer 4.2. Шаблоны Joomla 2.5 – 3.0».

Поддержка «Изображения и ссылки» для Joomla 2.5

Для тех, кто создаёт сайты при помощи системы управления содержимым Joomla 2.5, в Artisteer 4 предусмотрена поддержка добавления изображений и ссылок для статей в менеджере материалов Joomla 2.5 (рисунок ниже).

Совместимость с предыдущими версиями

Был проведён маленький эксперимент. Шаблон, изначально созданный в Artisteer 3.1.048375 Standard Edition для Windows для Joomla 2.5 был открыт в Artisteer 4.0.0.55648 Beta Standard Edition для Windows. В левой части картинки ниже шаблон версии 3.1, в правой – 4.0 (для увеличения нажмите на изображение).

Как видите, в результате конвертирования произошли не слишком большие изменения. В основном, они затронули те элементы шаблона, которые нельзя было редактировать в Artisteer 3.1, например, HTML элементы управления (строки ввода в форме регистрации). При дальнейшем исследовании результатов конвертации проекта, сделанного в версии 3.1 в версию 4.0, были обнаружены небольшие погрешности, например, отступы в блоках почему-то увеличились, после экспорта на сайт стала плохо отображаться постраничная навигация и так далее. Но учтите, что сейчас (20.07.2012) Artisteer 4 находится на стадии бета тестирования! В целом, можно надеяться на то, что перевод шаблонов, сделанных в предыдущей версии Artisteer на новую версию не вызовет больших затруднений.

Обратите внимание на то, что после сохранения проекта в Artisteer 4 он не будет открываться в предыдущих версиях программы.

Если сохранить один и тот же проект в качестве шаблона для Joomla 2.5 (ZIP архив), то получится следующий результат:

Artisteer 3.1.048375 Standard Edition – размер файла 677 Кб. 93 файла 14 папок.

Artisteer 4.0.0.55648 Beta Standard Edition – размер файла 483 Кб. 120 файлов 22 папки.

Стоит отметить, что в случае, когда Вы создадите в Artisteer 4 готовые страницы с содержимым, то размер файла может существенно увеличиться.

В версии Artisteer 4.0.0.55648 Beta ещё есть над чем работать. Но список тех новых и обновлённых возможностей, которые были заявлены на момент выхода бета версии, очень большой. Чего только стоит поддержка CSS3 и HTML5! А плагины порадуют разработчиков и веб мастеров, которые используют не поддерживаемые ранее в Artisteer системы управления содержимым. В следующей статье «Обзор Extensoft Artisteer 4 (часть 3). Программа для создания шаблонов Joomla» мы рассмотрим плагины экспорта, а также преимущества лицензионной версии программы.

Похожие материалы

 

Полезные ссылки:

Необычный вариант использования возможностей Artisteer в верстке / Sandbox / Habr

Долго время пользовался интересной для веб-разработчика программой Artisteer, которая позволяет в режиме wysiwyg создавать готовые шаблоны для wordpress, joomla!, drupal, blogger. После работы с программой достаточно немного подрихтовать стили, добавить кастомные шрифты, если нужно, подгрузить необходимые скрипты, картинки где-то поменять — и готовая тема! Быстро, удобно, очень много настроек — выбор цветов, расположение блоков, типографика, бекграунды, текстуры, градиенты, прозрачность — все это доступно в настройках. Кликаешь кнопку и тут же видишь, как будет выглядет результат на выходе. Потом экспортируешь шаблон в нужном формате (можно даже сразу задать название и версию шаблона, имя и url автора, которые сразу пропишутся в файле стилей. Собственная разработка все-таки ж!

Но есть нюансы — уж больно глючная программа. То не хочет экспортировать, то не хочет правильно открывать сделанный ранее проект, то просто неожиданно вылетает с сообщением об ошибке. И многие ее вышеперечисленные достоинства этими недостатками просто сводятся на нет. Сидишь несколько часов, правишь шаблончик, все отточил как только можно, все выглядит идеально. Нажимаешь «экспорт», программа вылетает, и о всех твоих трудах только воспоминанья…

Сделав с этой программой несколько тем, и истратив изрядно нервов, задумался. С одной стороны, шаблоны программа выдает очень удобные. Например, для wordpress она сразу задает несколько настраиваемых сайдбаров — сверху, снизу и несколько сбоку, создает специальную страницу в админке, где можно настроить дополнительные опции — копирайт в футере, блоки рекламы. Кроме того, в папке шаблона создается дополнительный шаблон страницы — one-column-page.php, как то так. И еще несколько разных шаблонов для постов, которые можно поменять прямо в редакторе поста. Ну и не говоря уже про всякие интересные строчки кода в function.php, которые иногда очень сильно облегчают жизнь верстальщика.

Думал, думал, полазил на официальном сайте и нашел там страничку samples — готовые шаблоны. Можно сразу бесплатно скачать готовые шаблоны для разных CMS, созданные в Artisteer. А при желании — и отредактировать. Присмотрел я шаблончик, похожий по расположению блоков на тот, что мне заказали верстать в тот момент. Скачал, поменял картинки, цвета, добавил фичи, подключил шрифты через font-face, ну вобщем, просто переделал его, как надо, активно при этом пользуясь всеми теми возможностями, которые были заложены в шаблон изначально. Вот такой опыт. Сейчас делаю очередной проект, шаблон для wordpress, собираюсь воспользоваться тем же способом, потому что вот только что установил последнюю версию программы, а она опять вылетела. Зато на сайте нашел подходящий шаблончик, которым и займусь.

А вот такие позиции предустановлены в шаблонах Artisteer для джумлы:

Artisteer — конструктор профессиональных CMS шаблонов

Представляю вашему вниманию, ну просто самую уникальную программу для создания тем на различные движки. Artisteer позволяет без каких-либо технических знаний, создать профессионально выглядящий шаблон для самых популярных CMS, в частности, это: Joomla, Drupal, WordPress, Blogger, DotNetNuke. А также «слепить» простой сайт на готовых блоках.

Итак, давайте разберем, в кратком обзоре что мы имеем в этой программе.

При первом запуске Artisteer высветится окно «Новый проект» в котором предлагается выбрать или создать шаблон для последующих действий. Это окно появляется при каждом запуске, но если вы находите его ненужным внизу имеется галочка чтобы отключить показ.

После выбора шаблона становится доступным само действующее окно программы, где мы начинаем творить. Расскажу немного об интерфейсе этого чуда. Здесь все выполнено в стиле MS Office 2007, то есть для каждого элемента своя вкладка, что очень удобно. На первой вкладке «Начало» нам Artisteer предлагает идеи дизайна элементом шаблона, который генерирует в случайном порядке.

Эта функция доступна и при наведении на некоторые элементы. Она отображается в правам верхнем углу под иконкой «лампочка».

При ее нажатии с генерируется в случайном порядке дизайн данного элемента и так до бесконечности.

Вторая вкладка «Правка» позволяет форматировать текст. Содержит следующие настройки: выбор шрифта, размер, цвет, тень, подчеркивание и т.д.

На третьей вкладке «Цвет и шрифты», выбираем шрифт и цвета для вашего сайта. Как всегда, используется правило «Трех цветов», но в дальнейшем изменять цвет можно у любой части сайта, это наличное усмотрение.

Обратите внимание на пункт «Коррекция» в нем есть возможность подобрать оттенки главных цветов.

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

Вкладка «Содержимое» позволит в один клик менять цвет, размер шрифта и т.д.

Итак, следующая вкладка «Фон», тут мы встречаемся с графикой. Настройки фона впечатляют. Также можно загрузить собственное изображение.

Пару примеров.

Далее, «Лист» — все подробные настройки макета сайта.

Мы добрались до «шапки» сайта, вкладка «Верх. Колонтитул». Это самое интересное.

В этой вкладке есть раздел «Изображения» в нем находятся отдельные картинки, которые можно помещать поверх шапки.

Пару примеров.

Все эти примеры и объяснение лишь поверхность, чтобы углубиться и полностью разобраться в функциональности Artisteer нужно с ним поработать. И вы убедитесь в его несложности и простоте, но есть один минус, я бы подчеркнул, БОЛЬШОЙ минус. На выходе шаблона получаются грязные CSS стили, что значит грязные? – много лишнего из-за этого трудно редактировать или вносить потом изменения.

И про разметку HTML тоже есть что сказать, вот, к примеру, зачем навигации три класса и это плюс что всем этим классом заданы стили. Потом трудно найти конфликт, а в остальном довольно неплохо.

Приобрести программу Artisteer можно на официальном сайте Artisteer.com за некую сумму или воспользоваться триалом. Демо просмотр.

Ну вот, пожалуй, и все!

Как создать уникальный шаблон для сайта,с помощью программы Artisteer 4

Ну и как всегда, на связи автор блога, Игорь.

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

Есть такие программы, для того что бы делать самому шаблоны.

По крайней мере, я знаю две.Ну это как я уже писал, программа Artisteer и программа аналог первой, это Template Toaster, тоже отличная программка.

Эти программы платные, но есть и бесплатные версии.

Ну так как, шаблон я создавал с помощью программы Artisteer 4, то об ней и буду писать.

Как я создавал шаблон с помощью програмы Artisteer 4

Для начала, программу Artisteer 4 надо приобрести на официальном сайте.
Так же там есть бесплатный период, где вы можете ознакомиться с данной программой.

Но как вы понимаете, в бесплатной версии, некоторые функции ограничены.Так же после создания шаблона, у вас останутся ссылки и водяные знаки.
Когда я первый раз начал вершить шаблон, я на это потратил около получаса времени.
И вот посмотрите что у меня получилось.

 

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

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

 

Если вас заинтересует этот шаблон, то его можно скачать по этой ссылке:

 ЗАБЕРИ БЕСПЛАТНО.

Я его тестировал на данном блоге, все работает отлично.Установка такая же, как и у простого шаблона.Вообще эта программа, очень удобна для штамповки уникальных шаблонов.Особенно кто делает сайты сателлиты или ГС сайты.
Но это не реклама.

Видеоурок по созданию шаблона

Ну а теперь я предоставляю видео, где я за несколько минут создаю шаблон и устанавливаю его на блог.

Если возникнут вопросы, обращайтесь.

С Уважением, Игорь Александрович

Artisteer — инстумент для создания шаблонов

Привет. Разговор сегодня будет об очень интересной программе создания шаблонов для сайтов  – Artisteer.

Главная особенность этой программы в том, что делать это она умеет быстро, красиво и вполне грамотно. По сути Artisteer сильно автоматизированный генератор шаблонов позволяющий создать полноценный шаблон буквально в один клик. Вам останется только экспортировать его в нужный формат. А поддерживает он многое. Это все самые популярные смс и как обычный шаблон HTML. Разумеется, полностью поддерживается и Word Press.

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

Artisteer обладает очень приятным и интуитивно понятным интерфейсом похожим на интерфейс MS Word. Что особо приятно – полностью поддерживается русский язык, как и многие другие. Рассмотрим отдельно по пунктам содержащиеся там основные закладки на примере создания темы для WP.

 Интерфейс Artisteer

• Идеи. В этой закладке собраны все автоматические генераторы. Например, цветовой схемы, шрифтов, макета и прочие. Настройки стилей, а также экспорта.
• Цвета и шрифты. Детальная настройка цветовой схемы и шрифтов.
• Макет. Определяет общую компоновку всех блоков сайта, количество и настройку боковых колонок.
• Содержимое. Тут настройки вида собственно самой записи в блоге и всего что к ней относится.
• Фон. Позволяет экспериментировать с фоном сайта. Дополнительно можно регулировать и настраивать фон для заголовка.
• Лист. Настройки общего вида вашего шаблона. Например, позволяет сделать нужного размера закругленные углы или настроить ширину общего листа.
• Верхний колонтитул. Тут все детальные настройки шапки (хеадера) вашего шаблона.
• Меню. Редактирование вертикального меню. Множество настроек внешнего вида кнопок меню и их расположения.
• Блоки. Определяет внешний вид и компоновку ваших будущих виджетов в боковых колонках.
• Вертикальное меню. Позволяет настраивать одну из небольших особенностей программы – собственно — вертикальное меню для боковых колонок.
• Кнопки. Настройка внешнего вида отдельных кнопок, если таковые используются.
• Нижний колонтитул. Здесь все настройки самой нижней части будущего сайта (футер).

Несмотря на все богатство настроек, Artisteer не идеальный инструмент и создать полноценную премиум тему в нем не получится, поскольку возможности все-таки ограничены. Но вот создать качественную альтернативу многочисленным бесплатным темам, можно запросто. И даже немного больше. Например, в любом созданном шаблоне для WP будет присутствовать довольно обширное меню настроек темы, что у бесплатных шаблонов вообще редкость.

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

При всех своих недостатках программа активно развивается, и периодически выходят новые версии.

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

Templateer

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

Галерею готовых тем можно посмотреть тут.

Примеры тем с использованием Templateer вы можете посмотреть или скачать на нашем сайте.

В итоге — тема созданная в программе  Artisteer с использованием такого мощного аддона как Templateer, по возможностям практически тянет уже на премиум класс.

Artisteer 4.0 — релиз новой версии программы