ReBeL
Злобный старикашка
- Регистрация
- 3 Май 2006
- Сообщения
- 1.535
- Реакции
- 888
- Автор темы
- #1
Думаю многие задавались данным вопросом =)
Итак....... вольный перевод с английского:
Сделать копию понравившейся темы не очень просто, но с другой стороны и не так чтобы очень сложно. В данной статье я попробую научить Вас, как это сделать с помощью Firefox и плагина для него, называющегося Firebug.
Но я боюсь, что моя инструкция позволит вам быть .... ну сами знаете кем, так что имейте в виду, что вы должны рассмотреть вопрос авторского права и уважать труд других людей =)
Надеюсь, что данный материал поможет Вам улучшить свои знания XHTML, CSS и кода wordpress.
Перед началом работы Вы должны иметь установленный Wordpress на локальном компьютере, знание XHTML, CSS и программирования. На Вашем компьютере должен быть установлен Firefox с активированным плагином Firebug.
Итак, давайте начнем. Во-первых, сделать папку темы (название такое, какое Вам нравится) в / wp-content/themes /. Перейдите на блог с которого вы хотите скопировать тему. В данном примере я использую классические темы Wordpress. Копия CSS кодов в CSS вкладке окна Firebug.
/*
Theme Name: Название Вашей темы
Theme URI: урл темы
Description: Описание Вашей темы
Version: 1.1
Author: Ваше имя
Author URI: урл автора
*/
Сохраните файл как style.css в созданной Вами ранее папке с темой в wp-content/themes/.
Папка Firebug HTML содержит тэги заголовков и боди по умолчанию. Создайте index.php в папке с Вашей темой. Напишите в нем:
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml”>
<head profile=”http://gmpg.org/xfn/11″>
</head>
<body>
</body>
</html>
language_attributes() могут быть использованы для добавления своего языка, xml:lang атрибуты dir для использования в тэгах темы. Расположите после атрибутов xmlns нужные тэги.
<html xmlns=”Для просмотра ссылки Войдиили Зарегистрируйся <?php language_attributes(); ?>>
Понимание функций BlogInfo
BlogInfo возвращает информацию которая установлена в профиле пользователя и Общих настройках панели управления Wordpress. Следующие коды содержат необходимую базовую информацию для языка разметки html. Следующие коды должны находится в заголовке между тэгами <head>.
<meta http-equiv=”Content-Type” content=”<?php bloginfo(’html_type’); ?>; charset=<?php bloginfo(’charset’); ?>” />
<meta name=”generator” content=”WordPress <?php bloginfo(’version’); ?>” />
<link rel=”alternate” type=”application/rss+xml” title=”RSS 2.0″ href=”<?php bloginfo(’rss2_url’); ?>” />
<link rel=”alternate” type=”text/xml” title=”RSS .92″ href=”<?php bloginfo(’rss_url’); ?>” />
<link rel=”alternate” type=”application/atom+xml” title=”Atom 0.3″ href=”<?php bloginfo(’atom_url’); ?>” />
<link rel=”pingback” href=”<?php bloginfo(’pingback_url’); ?>” />
<?php wp_get_archives(’type=monthly&format=link’); ?>
<?php wp_head(); ?>
<style type=”text/css” media=”screen”>
@import url( <?php bloginfo(’stylesheet_url’); ?> );
</style>
Для улучшения вывода заголовка можно использовать SEO методы =)
<title><?php wp_title(”); ?> <?php if(is_single() || is_page() || is_category){ _e(’»’);}?><?php bloginfo(’name’); ?></title>
Тэг заголовка должен находится именно в заголовке =)
Ну чтож.... переходим к самому интересному - копированию элементов темы.
Перед началом этого убедитесь, что у Вас достаточно знаний html и понимания кодов wordpress. Идея заключается в том, что мы в первую очередь делаем копию родительского элемента, а затем мы копируем его дочерние элементы. Мы повторяем этот процесс до всех тэгов, которые необходимо скопировать.
В Wordpress есть функция bloginfo которая может генерить базовую информацию о блоге.
<h1><a href=”<?php bloginfo(’url’);?>“><?php bloginfo(’title’);?></a></h1>
<div class=”description”><?php bloginfo(’description’);?></div>
Многие из создателей Wordpress тем используют запрос на вывод сообщений по умолчанию, за исключением одного пользовательского. Некоторые используют query_posts для создания специфических запросов. На самом деле это не имеет особого значения, т.к. все они находятся в цикле.
Понимание основ цикла сообщений
Цикл используется в WP для всех Ваших сообщений. Использование цикла, WordPress процессов каждого из сообщений, которые будут отображаться на странице, а также их форматы по тому, как они соответствуют указанным критериям цикла. Вот так выглядит базовая структура цикла. Внутри цикла обычно всавляется the_title(), the_permalink(), the_content(), итд.
<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
<?php endwhile; else: ?>
<?php _e(’Sorry, no posts matched your criteria.’); ?>
<?php endif; ?>
Если Вы занимаетесь программированием, то легко узнаете, что тут описан цикл =)
Вывод следующих кодов показан выше
<div id=”post-<?php the_ID(); ?>” class=”post”>
</div>
Развернув Div вы увидите следующие подэлементы
Раскроем элемент тэга h2.
the_title и the_permalink
the_title возвращает заголовок, а the_permalink возвращает постоянную ссылку на сообщение. Переписываем PHP код
<h2>
<a title=”Permanet Link to <?php the_title();?>” rel=”bookmark” href=”<?php the_permalink();?>”>
<?php the_title();?></a>
</h2>
the_time или the_date
the_time возвращает полную информацию о дате и времени сообщения. the_date возвращает только дату. Многие предпочитают использовать the_time =)
<small><?php the_time(’F d, Y’);?></small>
Проверьте формат даты и времени на PHP.net
the_content
the_content возвращает содержимое сообщения. Дополнительные параметры используются для показа краткой новости и перехода на полную <!–more–>
<div class=”entry”>
the_content (’Read the rest of this entry’);
</div>
the_tags
the_tags возвращает список тэгов для данного сообщения. Тэги были введены в wordpress с версии 2.3. the_tags(’start’, ’seperate’,’end’);
<p class=”postmetadata”>
the_tags (”Tags:”, “, “, “<br />”);
</p>
Для тем Wordpress использует header.php, index.php, single.php, page.php, category.php, search.php, comments.php, functions.php и footer.php. Однако Вы можете использовать только index.php для Вашей темы. Но если Вы используете разные стили для разных страниц, то Вам придется написать очень много кода в этом файле.
Например, следующий код показывает отрывок поста при просмотре категории, поиск, теги или главной страницы. Он показывает полное содержимое при просмотре ...? одного поста
<?php if (is_category() || is_search() || is_tags() || is_main()) {
the_excerpt();
}else {
the_content();
}
?>
Итак....... вольный перевод с английского:
Сделать копию понравившейся темы не очень просто, но с другой стороны и не так чтобы очень сложно. В данной статье я попробую научить Вас, как это сделать с помощью Firefox и плагина для него, называющегося Firebug.
Но я боюсь, что моя инструкция позволит вам быть .... ну сами знаете кем, так что имейте в виду, что вы должны рассмотреть вопрос авторского права и уважать труд других людей =)
Надеюсь, что данный материал поможет Вам улучшить свои знания XHTML, CSS и кода wordpress.
Перед началом работы Вы должны иметь установленный Wordpress на локальном компьютере, знание XHTML, CSS и программирования. На Вашем компьютере должен быть установлен Firefox с активированным плагином Firebug.
Итак, давайте начнем. Во-первых, сделать папку темы (название такое, какое Вам нравится) в / wp-content/themes /. Перейдите на блог с которого вы хотите скопировать тему. В данном примере я использую классические темы Wordpress. Копия CSS кодов в CSS вкладке окна Firebug.
Выбрать весь CSS код и вставить в текстовый редактор (Notepad). Поместите следующий код в начале CSS кодов, ранее скопированные в блокнот. Следующие коды используются для информации о теме Wordpress.
/*
Theme Name: Название Вашей темы
Theme URI: урл темы
Description: Описание Вашей темы
Version: 1.1
Author: Ваше имя
Author URI: урл автора
*/
Сохраните файл как style.css в созданной Вами ранее папке с темой в wp-content/themes/.
Папка Firebug HTML содержит тэги заголовков и боди по умолчанию. Создайте index.php в папке с Вашей темой. Напишите в нем:
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml”>
<head profile=”http://gmpg.org/xfn/11″>
</head>
<body>
</body>
</html>
language_attributes() могут быть использованы для добавления своего языка, xml:lang атрибуты dir для использования в тэгах темы. Расположите после атрибутов xmlns нужные тэги.
<html xmlns=”Для просмотра ссылки Войди
Понимание функций BlogInfo
BlogInfo возвращает информацию которая установлена в профиле пользователя и Общих настройках панели управления Wordpress. Следующие коды содержат необходимую базовую информацию для языка разметки html. Следующие коды должны находится в заголовке между тэгами <head>.
<meta http-equiv=”Content-Type” content=”<?php bloginfo(’html_type’); ?>; charset=<?php bloginfo(’charset’); ?>” />
<meta name=”generator” content=”WordPress <?php bloginfo(’version’); ?>” />
<link rel=”alternate” type=”application/rss+xml” title=”RSS 2.0″ href=”<?php bloginfo(’rss2_url’); ?>” />
<link rel=”alternate” type=”text/xml” title=”RSS .92″ href=”<?php bloginfo(’rss_url’); ?>” />
<link rel=”alternate” type=”application/atom+xml” title=”Atom 0.3″ href=”<?php bloginfo(’atom_url’); ?>” />
<link rel=”pingback” href=”<?php bloginfo(’pingback_url’); ?>” />
<?php wp_get_archives(’type=monthly&format=link’); ?>
<?php wp_head(); ?>
<style type=”text/css” media=”screen”>
@import url( <?php bloginfo(’stylesheet_url’); ?> );
</style>
Для улучшения вывода заголовка можно использовать SEO методы =)
<title><?php wp_title(”); ?> <?php if(is_single() || is_page() || is_category){ _e(’»’);}?><?php bloginfo(’name’); ?></title>
Тэг заголовка должен находится именно в заголовке =)
Ну чтож.... переходим к самому интересному - копированию элементов темы.
Перед началом этого убедитесь, что у Вас достаточно знаний html и понимания кодов wordpress. Идея заключается в том, что мы в первую очередь делаем копию родительского элемента, а затем мы копируем его дочерние элементы. Мы повторяем этот процесс до всех тэгов, которые необходимо скопировать.
Развернуть каждую метку и попытаться понять, функций, используемые темой
Важно знать, какие функции используются в теме, которую вы собираетесь копировать. Сначала нужно раскрыть тэги и определить, какие функции используются внутри тегов.
Важно знать, какие функции используются в теме, которую вы собираетесь копировать. Сначала нужно раскрыть тэги и определить, какие функции используются внутри тегов.
В Wordpress есть функция bloginfo которая может генерить базовую информацию о блоге.
Сейчас я собираюсь изменить код темы Wordpress. Следующие коды будут генерировать результат показанный выше.
<h1><a href=”<?php bloginfo(’url’);?>“><?php bloginfo(’title’);?></a></h1>
<div class=”description”><?php bloginfo(’description’);?></div>
Многие из создателей Wordpress тем используют запрос на вывод сообщений по умолчанию, за исключением одного пользовательского. Некоторые используют query_posts для создания специфических запросов. На самом деле это не имеет особого значения, т.к. все они находятся в цикле.
Понимание основ цикла сообщений
Цикл используется в WP для всех Ваших сообщений. Использование цикла, WordPress процессов каждого из сообщений, которые будут отображаться на странице, а также их форматы по тому, как они соответствуют указанным критериям цикла. Вот так выглядит базовая структура цикла. Внутри цикла обычно всавляется the_title(), the_permalink(), the_content(), итд.
<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
<?php endwhile; else: ?>
<?php _e(’Sorry, no posts matched your criteria.’); ?>
<?php endif; ?>
Если Вы занимаетесь программированием, то легко узнаете, что тут описан цикл =)
Вывод следующих кодов показан выше
<div id=”post-<?php the_ID(); ?>” class=”post”>
</div>
Развернув Div вы увидите следующие подэлементы
Раскроем элемент тэга h2.
the_title и the_permalink
the_title возвращает заголовок, а the_permalink возвращает постоянную ссылку на сообщение. Переписываем PHP код
<h2>
<a title=”Permanet Link to <?php the_title();?>” rel=”bookmark” href=”<?php the_permalink();?>”>
<?php the_title();?></a>
</h2>
the_time или the_date
the_time возвращает полную информацию о дате и времени сообщения. the_date возвращает только дату. Многие предпочитают использовать the_time =)
<small><?php the_time(’F d, Y’);?></small>
Проверьте формат даты и времени на PHP.net
the_content
the_content возвращает содержимое сообщения. Дополнительные параметры используются для показа краткой новости и перехода на полную <!–more–>
<div class=”entry”>
the_content (’Read the rest of this entry’);
</div>
the_tags
the_tags возвращает список тэгов для данного сообщения. Тэги были введены в wordpress с версии 2.3. the_tags(’start’, ’seperate’,’end’);
<p class=”postmetadata”>
the_tags (”Tags:”, “, “, “<br />”);
</p>
Для тем Wordpress использует header.php, index.php, single.php, page.php, category.php, search.php, comments.php, functions.php и footer.php. Однако Вы можете использовать только index.php для Вашей темы. Но если Вы используете разные стили для разных страниц, то Вам придется написать очень много кода в этом файле.
Например, следующий код показывает отрывок поста при просмотре категории, поиск, теги или главной страницы. Он показывает полное содержимое при просмотре ...? одного поста
<?php if (is_category() || is_search() || is_tags() || is_main()) {
the_excerpt();
}else {
the_content();
}
?>
