В тази тема ще ви обясня как Magento работи с темите и как да направите ваша:
Как Magento се справя с темите
Това са някой от нещата, които са внедрени в Magento:
- Максимално персонализиране
С Magento можете да обновите външния вид и оформлението на магазина на ниво категория или дори продукт, което ви дава големи маркетингови и промоционални предимства, както и магазин с безкрайно уникален дизайн. Дори представете си представяне на всеки продукт в негов собствена потребителска инфо страница! Magento ви позволява да направя точно това и повече, чрез осигуряване на бърз начин, за да персонализация.
- Множество теми
Magento ви дава възможност да се заредят няколко теми наведнъж, което ще Ви позволи да да преминавате между дизайн по подразбиране и временен/сезонен/. И всичко това – на няколко клика разтояние.
- Непрекъснат работен процес
С Magento, напълно обектно-ориентиран, всички модули са непосредствено достъпни от всеки шаблонен файл. И понеже Magento има голям набор от функции, вие никога няма отново да бъдат зависими от програмист да иззавърши най-простите задачи за вас. А ако имате проблеми, просто посетете форума на magento, където хора от цял свят ще ви помогнат/дори и разработчицете на магенто/.
- Бързо дебъгване
Всеки дизайнер може да си припомни тези ценни часове и минути, загубени в търсенето на незатворени тагове. Валидаторът ви казва какво не е наред, но не и къде се случва това. Magento има шаблонна модулна система, която да минимизира количеството на (X)HTML, което трябва да вие да обработвате наведнъж. По-малко означава по-малко от бъркотията и повече здрав разум за истинските и важни неща в живота.
Наистина, най-добрата част от това, което ви предлага Magento обаче, е приложение, което процъфтява благодарение на гъвкавостта си, оставяйки Ви да се тревожите за изработване на вашите брилянтна планове за следващите „уау“ фронтендове. Небето е лимита за това приложение и се надявам да се забавлявате докато го прилагате към вашия магазин.
Как да Създам Тема
Преди всичко да спомена за следните две директорий. Опитайте се да разберете за какво са:
- 1:
app/design/frontend/default*/default^/ – Тази директория съдържа разпределенията, шаблоните и преводите.
- 2:
skin/frontend/default*/default^/ – Тази директория съдържа изображенията, CSS и Javascript.
Както може би сте забелязали, файловете се разделят на две части: публични(CSS) и непублични. Така Magento ви предлага максимални мерки за сигурност на вашия магазин.
В двата случая, * посочва името на интерфейс, а ^ посочва името на темата. Така че, ако работите по тема, наречена my_theme в интерфейса - my_interface, то app/design/frontend/my_interface/my_theme/ в вашата директория.
Един интерфейс може да има безброй теми, но в за момента Magento можа да се справи само с темата по подразбиране и още една допълнителна. (Капацитет за зареждане на неограничен брой теми ще се появи в някоя от следващите версии.)
Създавана на нова тема по подразбиране
За да създадете нова тема по подразбиране, първо трябва да копирате сегашната си тема по подразбиране за да имате базова тема, от която да започнете. Създайте копие на app/design/frontend/default/default/ и преименувайте новата директория както си искате (името на интерфейс или тема трябва да започва с буква от азбуката [a-z]. Например „My New Theme“ и „02123_my_theme“ е лошо. „my_new_theme“ става). Името на вашата директория е името, с което магенто ще разпознае вашата тема. Сега направете същото за skin/frontend/default/default . Това е всичко! Вече успешно имате нова тема по подразбиране. За да използвате тази тема, прочетете определяне на интерфейс и тема за магазин по-долу.
Създаване на нова тема не по подразбиране
Диаграма 1
Когато създавате нова тема не по подразбиране, не е нужно да копирате стари папки. Ще се наложи да копирате само файловете, по които ще правите промени. Единствено трябва да спазвате подредбата на директорийте според стандарта на Magento. Например, ако новата ви тема ще съдържа промяна по шаблонния файл ‘home.phtml „от модула catalog от app/design/frontend/интерфейс/тема_не_по_подразбиране/ вие ще трябва да създадете директорята „template/catalog„, в която да запазите шаблона. Най-важното е да се спазва структурата от директорий на магенто(Диаграма 1), за да може вашата тема да се зареди правилно.
Определяне на интерфейс и тема за магазин
Сега, след като сте създали своя собствена тема(независимо дали е по подразбиране, или не по подразбиране), ще трябва да я зададете във вашия сайт/магазин, за да може тя да влезе в сила. Отворете Magento админ панела (например http://www.mydomain.com/admin), след това в раздела за конфигурация на дизайна (Система -> Конфигурация -> Дизайн).
Диаграма 2
На горния ъгъл на лявата колона в Диаграма 2, ще видите поле с надпис „Current Configuration Scope“.
- За да управлявате Вашия дизайн на ниво уебсайт, изберете името на вашия сайт от падащото меню, след това се прилагат следните стъпки.
- За да управлявате на ниво изглед на матазин, изберете името на вашия изглед от падащото меню, след това се прилагат следните стъпки.
Стъпка 1
От раздела Проектиране, в сегашните пакет име, въведете името на интерфейса, който в да е по подразбиране. Magento автоматично ще се зареди интерфейса наречен „по подразбиране“/default/, ако това поле се оставя празно.
Стъпка 2
По подразбиране (под заглавието Палитри), въведете името на новата тема, която искате да се зареди на вашия сайт / магазин. Ако оставите това поле празно, Magento автоматично зарежда само темата, наречена „по подразбиране“ (Не забравяйте, че без значение как се конфигурира дизайн раздела, Magento автоматично ще зареди темата наречена „по подразбиране“. Ако присвоите тема в администрация, тази тема ще се заредите високо в йерархията, но ще се заредите с темата „по подразбиране“. Това ще се промени в предстоящите версии). Ако решите да заредите тема отделно в зависимост от тип файл (оформление, шаблони, кожата или превода на файлове), въведете името на темата, от която да се вземат файловете.
Стъпка 3
Когато сте готови, натиснете бутона „Save“ или „Запази“ и презареди своя магазин – Готово! Сега виждате своята нова тема отразена в интерфейса.
Малко кьопаво го разправих но… Сега, когато сме се погрижили за за създаването и управлението на теми, нека преминем към работата на Magento.
Кажи здравей на паралелните теми
Забележка: Капацитет за неогранични теми ще е на разположение в някоя от бъдещите версии. За ще се заредят две теми.
Когато дойде времето на Дядо Коледа или Хелоуин, Magento ви предлага много лесен начин за стилизиране, без да променяте вашата тема поодразбиране – Диаграма 4!
Диаграма 3. Стандартната тема
Диаграма 4. Това е, което ви трябва
Хубавото е, че когато решите да да направите частична промяна за Коледа, единстево трябва да добавите е да добавите файловете за промяна. И естествено да ги промените. Единствената реална разлика между двата дизайни, може да са само няколко CSS файла, картинки и промени в текста на шаблон файлове.
Magento се справя с товаренето на няколко теми, с нещо, наречено йерархия на темите, който е просто един процес на унищожаване на излишни файлове, за да заредите само това, което се намира най-високо в йерархията. И всичко това се променя от админ панела.
Йерархията на темите
Например, ако вашия файла за листинг на продкти „view.phtml“ не е в състояние да бъде намерен в темата, най-високо в йерархията, Магенто ще погледне към следващата тема по-ниско в йерархията за да намери файла. И така докато не намери файла, наречен „view.phtml“. Този метод на изграждане на дизайна се нарича fallbacks, защото заявката „пада“ до следващия възможен източник на файловете, необходими, за изгледа.
Да приемем, че имате три теми, възложени на вашия магазин и всяка една от тези теми, съдържа следните файлове:
Таблица 1
| по подразбиране |
my_theme_1 |
my_theme_2 |
| Всички необходими файлове |
templates/3-col-layout.phtml |
templates/3-col-ayout.phtml |
|
templates / header.phtml |
CSS / base.css |
|
изображения / logo.gif |
|
|
CSS / base.css |
|
|
CSS / boxes.css |
|
Ето я и йерархията:
Таблица 2
| Най-високото |
my_theme_2 |
|
my_theme_1 |
| Най-ниска |
неустойка |
В близко наблюдение, ще видите, че има няколко излишни файлове като templates/3-col-layout.phtml и css/base.css в Таблица 1. Сега нека да ги подредим успоредно.
Таблица 3
| по подразбиране |
my_theme_1 |
my_theme_2 |
| Всички необходими файлове |
|
|
|
templates/3-col-layout.phtml |
templates/3-col-layout.phtml |
|
images/header.phtml |
|
|
images/logo.gif |
|
|
CSS/base.css |
CSS/base.css |
|
CSS/boxes.css |
|
„Добре, чудесно. Но какво означава това?“ Можете да питате.
Е, нека ви напомня, че файловете в Таблица 3 са както ние ги виждаме.
Нека сега погледнеме как Magento вижда същияата структура в Таблица 4.
Таблица 4
| по подразбиране |
my_theme_1 |
my_theme_2 |
| Всички необходими файлове |
|
|
|
|
templates/3-col-layout.phtml |
|
templates/ header.phtml |
|
|
images/logo.gif |
|
|
|
CSS/base.css |
|
CSS/boxes.css |
|
Вие ще забележите как Magento игнорира излишните файлове по-ниско в йерархията и признава само версията най-високо в йерархията.
:: В тази част ви показах как работят темите. В следващата глава пък, ще направим една. И тн. До следващата статия!
