Створюємо свій шаблон в artisteer 2

Після створення вашого дизайну і розмітки шаблону (створити новий HTML вебсайт компанії) в програмі Artisteer2, потрібно єкспортіровать його як HTML.Создаются такі файли 1-page.html 2-style.css 3-style.ie6.css 4-script.js 5 папка images /
Ми створюємо в директорії templates / свою папку з назвою нашого шаблону mytema /
далі в ній створюємо папки css / і js / .В папку css / кладемо файли експортовані з артиста style.css і style.ie6.css, а в js / кладемо script.js. Пака щоб не морочитися і не переписувати файл style.css - (в ньому за замовчуванням прописані шляхи до графічних елементів так url ​​( 'images / Page-BgTexture.jpg'); - нам бажано переписати всі шляхи так url ​​( 'templates / mutema / images / Page-BgTexture.jpg ') ;. Якщо немає бажання переписувати все шляху до графіку, в файлі style.css то залиште все як є -просто папку images / помістіть в створену вами папку css /, тоді при використанні стилів графіка буде братися з відносного url ( 'images / ****. jpg') ;.
Тепер треба в директорії вашого шаблону створити файл позицій ввода.Создаем текстовий файл positions.txt і завадимо в ньому наші позици:

Позицій user може бути і більше і менше, все залежить від ваших вимог і оформлення сайту.

Залишився найважливіший файл це template.php в ньому міститься вся базавая розмітка сайту.
Можна всять його з будь-якого шаблону і скопіювати в папку свого шаблону для редагування.
Відкриваємо файл template.php і видаляємо все що між тегами і і копіюємо в нього вміст еспортірованного артистом файлу page.html. нас цікавить все що розташоване в ньому між тегами і в page.html.Вот це вміст ми переносимо в наш template.php.
Далі в ньому створюємо важливу частину де прописані шляхи до нашого файлу css скрипту js.Вот код для прикладу:

Ми залишаємо все шляху до скриптів системи инстант (поки залишено query.simplemodal.js і basic.js)
решта

Підключаємо у міру потреби.
Замість / mytema / прописуємо ваше назва шаблону тоесть назви створеної вами директорії де і лежати всі файли вашого нового шаблону.

Власне це і є базова розмітка шаблону, остальнве нюанси по розмітці додатків і модулів инстант треба вже робити в листі стилів css.Пока в нами експортованому артистом аркуші стилів є тільки базові стилі, і немає стилів потрібних припустимо для правильного виведення каталогу та інших пріложеній.Для цього треба
брати з дефолтного листа стилів styles.css потрібні стилі і приводити їх у відповідність з вашим дизайном на основі стилів артіста.Ілі переписувати код стилів в модулях.tpl на ваші стілі.Ну цю тему ми торкнемося трохи згодом, ця тема вимагає більшого і на окрему увагу .
А поки можна подивитися що у нас вийшло.
Це код template.php який підготовлений для прикладу, потрібно вам розставити ваші посилання, в місці де стоїть #

У прикладі вже розставлено теги ІНСТАНТ для виведення контенту

Це ліва позиція для виведення, є еше right, top, bottom, user1-user8
Розставивши ці коду в потрібних вам місцях розмітки таблиць шаблону, ми і отримаємо сам шаблон.На прикладі видно де вони розставлені, ви можете самостійно поміняти на те що вам потрібно.

ПОВНИЙ КОД приклад:

Схожі статті