На этом занятии, мы закрепим то, что действительно важно. Как отобразить контент блога? Также, вы добавите еще несколько невидимых блоков или DIVов, чтобы отделить контент от заголовков постов, которыми мы занимались в прошлый раз.
(Примечание: Прошлый урок очень и очень важен. Если вы не до конца разобрались в том, что я рассказывал, вам необходимо перечитать урок и задавать мне вопросы, пока все не станет понятно.)
Чтобы продолжить сегодняшний урок, включите Denwer, откройте папку “Tutorial”, откройте браузер и зайдите на http://wordpress/, а также, откройте файл index.php в редакторе.
Шаг 1:
Напечатайте <?php the_content(); ?> под кодом заголовка поста.
Сохраните текстовый файл и обновите окно браузера, вы должны увидеть некоторый текст под заголовками постов.
Что сейчас произошло и почему все выглядит именно так?
Мы использовали WordPress функцию the_content(), чтобы вызвать записи блога (контент). Сейчас ваш контент выглядит как одна сплошная линия текста, идущая вправо до конца области окна. Это так, потому что вы еще не отформатировали текст. Помните файл style.css? позже мы используем этот файл, чтобы управлять тем, как все выглядит.
В прошлый раз я просил вас сделать несколько пробных постов, чтобы вы увидели, как выглядит список из нескольких записей. Если вы этого еще не сделали, сделайте сейчас, а потом возвращайтесь на первую странцу. Вы должны увидеть несколько записей друг под другом.
Получилось? Тогда двигаемся дальше…
Вернитесь в браузер, кликните на View и выберете Page Source или Source. Откроется окно с исходным кодом.
Заметили разницу между файлом index.php и исходным кодом? Весь текст, картинки и прочее, все в этом окне вызывается функцией the_content(). Полезно, да? Без специального обеспечения для создания блогов, в частности, шаблонной системы WordPress в этом уроке, пришлось бы кодить все эти тексты и картинки самим.
Также, обратите внимание на xhtml открывающие и закрывающие тэги P, которые я обвел красным. Их нет в вашем файле index.php, но они присутствуют в окне или блокноте исходных кодов, которые вы только что открыли.
Тэги Р – как и зачем?
Зачем – когда вы печатаете ваши записи, каждый раз когда вы пропускаете линию – это абзац. Вам нужно это как-то показать, так ведь? Каждый абзац находится внутри набора тэгов Р. С их помощью, вы отделяете абзацы друг от друга.
Как – просто! Система шаблонов WordPress создает Р тэги для вас.
Шаг 2:
Поместите невидимый блок (DIV) вокруг the_content() и присвойте ему class="entry", вот так:
<div class="entry">
</div>
У вас должно получиться следующее:
Сохраните все и обновите страницу в браузере. Если вы снова зайдете в View > Page Source, вы увидите, что тэги class=”entry” DIV появились вокруг каждого вашего поста.
Почему?
Первая причина: сейчас вы можете сказать, где заканчиваются заголовки постов и начинаются собственно записи.
Вторая причина: это сделано для стилизации с помощью файла style.css. Если вы захотите, вы сможете стилизовать запись, не влияя ни на что другое.
Какая разница между id и class?
До этого момента, чтобы назвать невидимый блок DIV, вы использовали id. Помните id=”header”? Так какая же разница? ID уникален, а class нет! Если вы посмотрите на исходный код, вы увидите, что есть только один id=”header” и один id=”container”, но есть несколько class=”entry”.
Могут ли хедер и контейнер быть классами, а не id? Конечно.
Помните: ID НЕ должны повторяться на странице. Например, у вас не может быть двух id=”header” на одной странице. Когда вы хотите использовать что-то снова и снова, как например записи блога, используйте class.
Шаг 3:
Поместите DIV вокруг заголовков постов и самих записей. Назовите его class=”post”
<div class="post">
</div>
(Имена для классов и id могут быть любыми. Например, вы можете назвать DIV в честь любимой еды, но post и entry достаточно легко запомнить, не правда ли?)
Сейчас у вас должно быть:
Вот организованная версия:
Я использовал клавишу tab вместо пробелов, чтобы делать отступы в исходнике index.php. Зачем организовывать код? В отличие от моих скриншотов, в ваших кодах нет красных и зеленых подчеркиваний. А вам нужно отслеживать код. С отступами вам будет легче сказать, какой </div> закрывает тот или иной невидимый блок.
Сохраните и обновите окно браузера, чтобы увидеть изменения в исходном коде.
Зачем добавлять еще один DIV, окружающий заголовок поста и сам пост?
Вы добавили DIV class=”entry”, чтобы отделить заголовок поста от собственно записи. Данный тэг существует для разграничения одного от другого.
На этом все. Информации для осмысления довольно много, так что обязательно задавайте вопросы, если вы что-то не понимаете.
Если вы заметили какие-то ошибки или несоответствия в моих уроках, пожалуйста, сообщите мне, чтобы я сразу мог это исправить. Кстати, как вам мои уроки? Какие у вас есть замечания? Может мне стоит быть более детальным? Не слишком ли длинные "занятия"?
Жду ваших комментариев и не забудьте подписаться на RSS.
[quote]в этом уроке, вамшлось бы кодить[/quote]
очепятка вроде?
спасибо!
[...] URL-адреса ваших постов будут выглядеть примерно так wp-config.ru/?p=339. Такая структура URL плохо подготовлена для SEO и она [...]
Когда ждать продолжения? Хотелось бы перейти к работе с файлом style.css
Как все страницы разом править в wp ? (как html страницы заменять во всех открытых). Сори не дописал ) старый комент удалите
Al, не совсем понял вопрос. Вас интересует как править шаблон отображения страниц?
[...] URL-адреса ваших постов будут выглядеть примерно так wp-config.ru/?p=339. Такая структура URL плохо подготовлена для SEO и она [...]
Привет, такой вопросец , в произвольной структуре чпу, стоит /%category%/%postname% , и ссылки на блоге преобразовались в
http://мойсайт.ru/domains_hostings/%d0%b1%d0%b5%d1%81%d0%bf%d0%bb%d0%b0%d1%82%d0%bd%d1%8b%d0%b9-%d1%85%d0%be%d1%81%d1%82%d0%b8%d0%bd%d0%b3-%d0%bf%d0%be%d0%b4-%d0%b4%d0%be%d1%80%d1%8b
можно ли сделать как у тебя, и как к этому относятся яша, гугли и другие пу
спасибо
greed, это легко делается при помощи плагина RusToLat. Насколько мне известно, поисковики к этому относятся крайне положительно.
админ скажи как сделать разный заголовок на на странице.
на движке WordPress
Поясните пжл, для чего вообще существует ….страница с Исходным кодом? Вроде всё делаем в редакторе.
admin молодец !!! хороший сайт
хм… заинтерисовался вашими уроками ,всегда есть что нового узнать даже закрепить не помешает.
а не моглибы подсказать как сделать так, есть код к примеру картинка выводиться слева от текста поста, потом внизу линия и след пост наоборок, картинка справа а текст слева, и поочередно так. не знаете как сделать правельно, а не что бы просто работало.
Уроки бесспорно шикарные. Я съедаю уроки взахлеб, не хватает в конце статьи ссылки на следующий урок, приходится либо же держать отдельным окном список уроков, либо же возвращаться (не особо важно, но тем не менее улучшает юзабилити). Пошел на урок №8..
euGene, спасибо. Думал об этом, но до реализации не добрался. Запишу в туду и обязательно сделаю.
Седьмой урок, полет нормальный! Спасибо:)
Мне кажется что на месте слова “Почему?” должно быть что-то навроде “Зачем?”. Ведь “тэги class=”entry” DIV появились вокруг каждого вашего поста.” Почему? Потому что участвуют в цикле. А Зачем? 2 причины.
Хочу поблагодарить за уроки, спасибо!
Урок пройден, сколько ещё?
Отзывы только респектабельные!) Тем кто только начинает приобщаться- вообще лафа, множество ошибок из постов с течением времени исправляются, кнопки и юзабилити нарастает.
Много всяких тонкостей в статье написано, я ничего не меняю, н все равно спасибо, хотя я ничего почти не понял=) Но шаблон блога у вас отличный! Сразу в глаза бросился=) Немного сероват и колонку справа бы добавить, но все равно хороший.
облазил весь инет и не могу найти как сделать так чтобы разместить определенный текст (или код, банер, скрипт и тп) в конце всего контента независимо от того какая страница блога открыта, те в конце поста и тп.? Пример на вашем сайте нужно разместить ниже: сообщить мне о новых комментариях по e-mail. Помогите PLEASE)
admin, NE zrya Zanimayeshsa etim Delam, ochen pomagayet mnetvoy sayt, ruskayazichnie iskal ne malo materyalov, no ti gavarish a tom a chyom kakraz mne xochetsa slushat i uznat. I ya ne jeleyu svayo vremya tebe ab etom napisat!
Здравствуйте, а не могли бы вы подсказать мне. Вставляю цикл и все необходимые функции пхп, но выводится токо один пост, ни при создании новых записей, ни при создании новых страниц больше ничего не выводится! Только одна тема страницы и ее content(), остальных нет, специально создавал и проверял. что может быть не так?
Админ плиз исправь. the_content() это функция WordPress а не PHP. не путай людей. а так все здорово
p.s. если я ошибся, объясни в чем))
Поправил, спасибо.
вопрос не совсем в тему что то не пойму что не так, не могу получить значение произвольного поля:
function widget_main_post ()
{
if(have_posts()) : while(have_posts()) : the_post();
echo ”;
the_title();
echo”;
if ( has_post_thumbnail() ) {
the_post_thumbnail();
}
echo’ ‘.
”;
echo get_post_meta($post->ID, “views”, true);
//get_post_meta почему то не срабатывает
echo’ ‘;
echo”;
the_time(‘d.m.Y’); echo’ | ‘;if ( $post->post_date != $post->post_modified) { echo’ | обновлено:’; the_modified_time(‘d.m.Y’); }
comments_popup_link(’0 Комментариев’, ’1 комментарий ‘, ‘% комментариев’);
echo’ | ‘;
if(function_exists(‘the_views’)) { the_views(); }
echo”;
edit_post_link(‘Редактировать’, ‘ | ‘, ”);
echo’Читать…‘;
echo”;
endwhile;
endif;
}
get_post_meta почему то не срабатывает
хотя the_meta(); как положено выводит все произвольные поля
помогите в чем косячу
чет в коменте выше все echo порубило
короч не могу понять почему не работает
echo get_post_meta($post->ID, “views”, true);