Създаване на WordPress тема на базата на статични HTML файлове за създаване на шаблони, CMS и двигатели за сайтове
Изходният файл за изтегляне
В първата част на тази статия серия, аз ви казах как да се подготвят за HTML и CSS файлове за конвертиране в WordPress, как да се определят структурата, правилния код и класове.
В тази статия ще научите как да се разделят файла си index.html към набор от шаблонни файлове за използване в WordPress.
Какво ви трябва:
За този урок ще се нуждаете от основните инструменти за редактиране на HTML и PHP:
Какво е шаблон файлове?
WordPress тема се състои от няколко шаблонни файлове. Най-малко за правилното функциониране на темата трябва да съдържа два файла: index.php и style.css.
Въпреки това, в една добре проектирана съдържание тема файла index.php трябва да бъде разделена на главния файл с шаблони (index.php) и набор от включване на файлове. Това са файлове, които съдържат кода за хедър, лента и страници сутерен.
Някои допълнителни теми включват файлове, използвани от цикъл; Аз ще ви кажа повече за това в четвъртата част на тази серия.
Тези файлове се наричат "включва", защото ще ви постави кода във файла index.php, която разказва WordPress, съдържанието им трябва да бъдат включени в страницата.
Нашата index.html файл ще бъде разделен на четири PHP файл:
В тази серия, можете да добавяте елементи към файловете, в които обектът може да се включат и приспособления, менюта и цикли, както и лечение, за да се използва от плъгини. Можете да добавите и допълнителни шаблонни файлове за показване на различни типове съдържание.
Ако искате повече информация за справка по този въпрос, прочетете раздела WordPress шаблони Йерархия на Кодекса.
Но сега, ние всички трябва да направите, е да се създаде набор от PHP-файлове и да ги разпредели между съдържанието на нашия index.php файл.
Създаване на PHP файл
Уверете се, че всички те са в папка с името на вашата тема - в моя случай аз ще се обадя на папката "wptutsplus-демо-темата". Копиране в тази папка стилове. Ние няма да ги редактирате в този урок, но ще се занимава с това в следващата част от поредицата.
Попълване Header File
След това трябва да копирате горната част на предварително създаден файла index.html във файла header.php.
Копирайте този код и го поставете във файла header.php.
Попълване на страничната лента File
Сега, повторете същите стъпки за файла лента.
Ако вашият файл index.html, подчерта т настрана клас = "лента". и всичко, което се отнася до страничната лента, се съдържа в него.
Копирайте този код в sidebar.php и запишете файла.
Попълване долния файл
Процесът на пълнене е идентичен на файла footer.php.
Копирайте целия код, който е след страничната лента в файла си index.html:
Копирайте този код в досието footer.php.
Може да попитате защо блок .main заключена в мазето файл, а не във файла лента.
Това се дължи на факта, че, ако имате намерение да се създаде страница шаблон файл, който не разполагате с лента, можете просто да изключи от този със странична лента шаблон, и да оставите само най-долната част на страницата, след което устройството .main все още да се затвори правилно.
Попълване индекс файла
И последната стъпка е създаването на index.php файла директно. Ще го направите малко по-трудно, вие ще трябва да добавите някои PHP функции, които WordPress използва, за да се включи с глава, лента и долната част на страницата.
Отворете празен index.php файл и добавете следния код:
Уверете се, че между началото на включени заглавието и включва лявото пространство страничен панел - тук ще добавите съдържанието на файла с индекс, който не е част от нито заглавието или страничната лента или долната част на страницата.
Сега отворете файла index.html отново и изберете целия код между класа на отваряне елемент единица = "главен" и страничния панел:
Копирайте този код и го поставете в файла index.php get_header линии по-долу ().
Спасете index.php файла.
резюмиране
Сега имаме рамка за WordPress теми. Вие се обърна вашия HTML-файл в набор от PHP файлове и да ги настроите да работят заедно.
В следващата част на тази серия, аз ще ви кажа как oredaktirovat стилове да се създаде работна тема и качване на темата в WordPress.
Превод на статията «Създаване на WordPress Тема от статично HTML: Създаване на шаблон Файлове» е изготвен от екип от приятелски Уеб дизайн проект от А до Я.