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 обзор программы
К основным новшествам Artisteer 4.0 хочу отнести следующие:
- Обновлено и расширено редактирование содержимого.
- Поддержка HTML5 и CSS3.
- Шрифты Google.
- Доступ к коллекции изображений Flickr.
- Персональный альбом изображений
- Усовершенствованное создание шапки сайта при помощи визуального редактирования.
- Новый инструмент выделения.
- Создание коллажей.
- Маска для текстур.
- Текстовые блоки.
- Стиль всплывающего окна Lightbox.
- Слайд шоу.
- Добавлено больше источников изображений.
- Эффект тени для текста.
- Новые опции скругления для столбцов и рядов.
- Границы для заголовков блоков и меню.
При старте программы перед нами открывается окно (рисунок ниже) с возможностью выбора готового шаблона с сайта производителя.
Сейчас (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-й была одна «стандартная статья» для любого шаблона. Приходилось устанавливать шаблон в «пустую» 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, метками (тегами) и так далее. Эти элементы можно отключать (рисунок ниже)
Свойства страницы (рисунок ниже) разделены на три части
В Общие Вы сможете задать имя страницы и её заголовок. В PageTgs расположены поля для ввода описания, ключевых слов и мета тегов. Show in Menu позволит Вам указать в каких меню (горизонтальном иили вертикальном) необходимо отображать ссылку на данную страницу.
Некоторые из вышеперечисленных инструментов были доступны и в версиях 3, но, повторюсь, только при создании шаблона тип Сайт или блог.
Продолжим рассмотрение новых и обновлённых возможностей 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.3. Совместимость с Joomla 3.4
- Обзор Artisteer 4.3. Конструктор шаблонов сайта
- Готовые шаблоны Artisteer 4
- Обзор Artisteer 4.3
- Обновление Artisteer 4.2 для Joomla 3.3, WordPress 3.9, Drupal
- Обзор Artisteer 4.2. Шаблоны Joomla 2.5 – 3.0
- Обзор Artisteer 4.1. Шаблоны Joomla 2.5 – 3.0
Примерно с 2008 года и по сегодняшний день создаю сайты «под ключ» на Joomla и WebSite X5. Также занимаюсь их доработкой, SEO-продвижением, контекстной рекламой, защитой от взлома и оптимизацией скорости загрузки сайта.
Кандидат технических наук по специальности «Информационные технологии».
На этом сайте есть контакты и информация обо мне. На нём Вы найдёте примеры моих работ, а также перечень и цены предоставляемых услуг.
Полезные ссылки:
Источник: aleksius.com
Как создать тему для WordPress в программе Artisteer 4.0.
Абсолютно любой блоггер подтвердит, что довольно сложно найти уникальную тему для своего сайта на WordPress. Все темы, которые можно скачать в Интернете, давно уже растасканы по различным сайтам. Выход один – создать шаблон самому, однако, если не знаешь языка программирования PHP, то задача становится невыполнимой. Неужели все так безнадежно?
Общие характеристики программы Artisteer 4.0
Оказывается, что нет, если воспользоваться специальной программой Artisteer. Приложение не является бесплатным, но его пробную версию (на русском языке) можно скачать по этой ссылке. Используя Artisteer, вы сможете сами делать шаблоны для различных CMS: WordPress, Joomla, Drupal, свободной платформы Blogger и т.д. Программа сама умеет генерировать код шаблона, а дело пользователя – подстроить этот код «под себя».
Краткая инструкция по созданию шаблона
Запускаем Artisteer – она предложит вам набор готовых шаблонов, которые вы затем сможете экспортировать на любую поддерживаемую платформу, в том числе и на WordPress.
Выберем, к примеру, шаблон для сайта деловой тематики:
Что делать с этим шаблоном? Для начала перейдите на вкладку «Начало» и нажмите на кнопку «Предложить дизайн». Возле курсора мышки появится желтая лампочка, а сам шаблон изменится:
Однако, если вы хотите конструировать свой шаблон осознанно, придется повозиться чуть дольше, а не просто щелкать мышкой. Откройте вкладку «Верхний колонтитул» и немного поэкспериментируйте с выпадающим списком с фоновыми изображениями для колонтитула. Попробуйте вставить свое изображение, нажав кнопку «Из файла». Сделайте верхний колонтитул динамичным при помощи кнопки “Flash”. С помощью вкладки «Элементы управления» вы можете вставить название вашего сайта и девиз.
На вкладке «Фон» в выпадающем списке вы можете выбрать подходящую текстуру или изображение, а также настроить их эффекты. Если вам ничего не приглянулось, можете использовать в качестве фона любую другую картинку. Для этого нужно нажать на кнопку «Из файла», расположенную в блоке «Текстура или изображение». Мы выбрали рисунок природы в голубых тонах.
Artisteer имеет гораздо больше настроек, чем можно написать в такой короткой статье. Например, вы можете экспериментировать с цветами и шрифтами, макетом страницы, менять число колонок на странице, менять вид различных блоков и т.д.
Закончив редактирование темы, ее нужно еще сохранить как новую тему Вордпресс.
Для этого нужно нажать «Файл» – «Экспорт» – «Тема WordPress»:
Пишем имя новой темы, указываем, куда программе нужно сохранить файл. Поставьте галочку напротив слова «Архив» — именно в виде архива тема будет установлена на блог. Если вы планируете поработать с этим шаблоном на каком-то другом компьютере, нужно поставить галочку напротив «Включить ARTX проект».
Публикация темы на сайте
Теперь вам нужно опубликовать свою тему на сайте. Зайдите в админку своего блога на Вордпресс, перейдите на вкладку «Внешний вид», нажмите «Темы» — «Установить темы». Кликните по ссылке «Загрузить» и укажите на архив со вновь созданной темой. Жмем кнопку «Установить», а после установки – «Активировать».
Администрация сайта CADELTA.RU выражает благодарность за статью автору katyafedorova35 .
Если у Вас остались вопросы, задайте их на нашем форуме.
Источник: cadelta.ru
Как быстро и просто создать классный шаблон для сайта, а затем его продать?
Каждый, кто делает себе сайт или блог, мечтает для него о хорошем дизайне.
Кому не хочется, чтобы его проект выглядел хорошо?
Так или иначе, нарисовать и сверстать классный индивидуальный шаблон – задача непростая и явно требующая определенных умений.
Конечно, можно обратиться к услугам специалистов, которые сделают все по высшему разряду. Только вот стоят такие услуги весьма недешево и многим они просто не по карману.
В этом случае приходится обходиться уже готовыми шаблонами и по возможности менять в них что-то под себя.
Благо, шаблонов сейчас огромное множество, так что есть из чего выбирать.
Кстати, здесь вы можете ознакомиться с моим списком сайтов, предлагающих скачать хорошие шаблоны бесплатно.
Тем не менее, найти из всех шаблонов тот, который будет вас полностью устраивать, оказывается не всегда просто.
Помню, когда я создавал этот блог, для меня выбор подходящего шаблона был самой настоящей проблемой, над решением которой я бился не одну неделю.
К счастью, в один прекрасный день мне все-таки повезло, и я отыскал то, что хотел.
В этом посте я хочу рассказать вам об одной замечательной программе, с помощью которой вы можете очень быстро и без каких-либо технических умений создать простой, но вполне презентабельный на вид шаблон для своего проекта.
Причем создать на разных платформах: WordPress , Joomla , Blogger , Drupal и даже HTML .
Думаю, многие из вас догадались, что речь пойдет о программе под названием Artisteer .
Если вы хотите увидеть интерфейс Артистера, а также познакомиться с процессом создания в нем шаблона, предлагаю вам посмотреть мой видеоурок.
Программа очень хорошая и достойна внимания. В ней столько всевозможных опций и настроек, что вы запросто можете нарисовать хороший шаблон для любых нужд.
Чего стоит только одна опция подбора фона. Благодаря сотням готовых эскизов, совсем не трудно сделать реально очень классный бэкграунд.
Артистер был мне хорошим помощником в те смутные времена, когда я создавал сайты на заказ.
Поскольку в дизайне я всегда был чайником, а деньги зарабатывать как-то надо было, шаблоны для некоторых сайтов я рисовал именно в Артистере.
Знаю, что по поводу Артистера существует острая полемика, мол, программа создает шаблоны с корявым кодом, из-за чего сайты потом долго грузятся и плохо индексируются в поисковиках.
Возможно, пару лет назад в этом и была доля правда, но не сейчас…
Я слишком хорошо знаком с Артистером и могу сказать, что все это не так. По крайней мере, это мое мнение.
Я бы даже не побоялся нарисовать в нем шаблон для этого блога, если бы не нуждался в двойном меню.
Безусловно, Артистер генерирует не самый чистый код. Тем не менее, сайты от этого медленней не становятся.
Тут уже гораздо больше зависит от хостинга, количества плагинов, оптимизации изображений и других вещей.
А по поводу индексации… сейчас поисковики в основном обращают внимание на всякие поведенческие факторы, нежели на код шаблона.
Все сайты, которые я делал с помощью Артистера, индексируются и работают абсолютно нормально. Более того, я неоднократно замечал Артистеровские сайты в топе поисковиков.
Особенно в Гугле и особенно в Буржунете. Там вообще сейчас мода на простые шаблоны, которые легко можно создать в Артистере.
Артистер – программа не из дешевых. Но поскольку Рунет славится щедрой душой, я думаю, отыскать рабочую пиратскую версию не составит труда.
Кроме этого далеко не все знают, что у Артистера есть отдельные дополнения, расширяющие круг его возможностей. Одно из самых известных это Templateer .
Дополнение также платное, оно разработано третьей стороной, то есть не самим Артистером, но позволяет добавлять множество разных изысков в стандартные шаблоны Артистера.
Благодаря Артистеру в купе с Темплатером можно создать действительно очень мощный дизайн, который не стыдно потом и продать за хорошие деньги.
Где вообще можно продать шаблон, сгенерированный Артистером?
Если честно, то шаблонов я никогда не продавал и опыта у меня в этом деле с гулькин нос, но исходя из того, что я сейчас наблюдаю, попытаюсь давать вам для размышления несколько вариантов.
Естественно, с акцентом на Буржунет, потому как в Рунете я понятия не имею, кто вообще покупает какие-либо шаблоны, если все кругом бесплатно.
В Буржунете же покупают активно, поэтому о нем и поговорим.
– услуги на fiverr.com
Не раз замечал, что многие на сайте fiverr предлагают создать простые шаблоны. Стоит это 5 долларов, из которых ваши – 4 доллара.
Но, с другой стороны, эти услуги пользуются спросом, а, учитывая тот факт, что шаблон на Артистере можно создать за несколько минут, то цена вполне справедливая.
Естественно, речь о больших деньгах не идет, но если говорить о небольшой подработке, то почему бы и нет?
– продажа на сайте фриланса freelancer.com
На этом сайте есть отдельный каталог, куда дизайнеры выставляют свои шаблоны на продажу. Многие из этих шаблонов успешно покупаются.
В принципе, насколько я помню примерно такой каталог, есть у некоторых наших сайтов фриланса, таких как freelance.ru
– создание собственного отдельного сайта-каталога
Это, пожалуй, самый лучший вариант, потому как вы можете наштамповать много шаблонов и продавать их по самым разным ценам.
Многие дизайнеры-одиночки а Буржунете так и делают. Единственная трудность – это привлечь трафик.
То есть понадобятся вложения и время на раскрутку вашего проекта.
Но если трафик попрет, то пойдут и продажи, потому как покупают в Буржунете такие вещи очень хорошо.
Вот три наиболее удачных варианта, которые пришли мне в голову.
На этом собственно все. Если у вас есть вопросы по Артистеру или свои идеи, где бы можно было попытаться продать Артистеровские шаблоны, буду рад вас послушать.
С уважением, Константин Руднев
Источник: www.rudblog.com