Работает система Orphus

WordPress для каждого на русском языке!

  • RSS

Учебник по WordPress

Полезные советы

Хитрости

Шоукейс

О проекте

Темы WordPress на русском!

Эволюция пользовательского интерфейса WordPress (2003 – 2009)

Четверг, 14 января 2010 - Рекомендуем, Статьи и советы

WordPress каким мы видим его сейчас – это продукт любви, которой наградило его сообщество. Без идей, пожеланий, рекоммендаций и советов пользователей и тяжелой работы команды разработчиков, которая воплощала это всё в жизнь, из него никогда бы не получилось того, что есть сейчас. Сегодня WordPress предстает перед нами мощной полноценной CMS, подходящей почти под любые нужды. [...]

читать дальше

Продвинутые советы по разработке сайтов на WordPress

Понедельник, 27 июля 2009 - Рекомендуем, Статьи и советы

Последние релизы дают понять, что WordPress расширил границы своих возможностей далеко за пределы блоггинга, приобретая все больше качеств серьёзной и мощной системы по управлению контентом. Изначально, WordPress предлагает довольно поверхностный, минимальный функционал. Но простота основы с лихвой компенсируется изобилием плагинов, которые значительно увеличивают потенциал движка.

читать дальше

5 полезных и оригинальных способов использования виджетов в WordPress

Четверг, 16 июля 2009 - Рекомендуем, Статьи и советы

Если вы создали хотя бы несколько сайтов на WordPress, то вы наверняка уже знаете, что WordPress это гораздо больше, чем просто блоггинговый движок. Он может быть также использован как и CMS, а виджеты WordPress – это мощный инструмент в арсенале WP-разработчика.

Многие думают, что WordPress виджеты это всего лишь способ реорганизовать структуру сайдбара вашего блога, не трогая код. Это действительно полезная способность видежтов, но это всего лишь верхушка айсберга всех возможностей, которые они предоставляют.

читать дальше

Урок №7. Контент.

Вторник, 30 июня 2009 - Создание тем

На этом занятии, мы закрепим то, что действительно важно. Как отобразить контент блога? Также, вы добавите еще несколько невидимых блоков или DIVов, чтобы отделить контент от заголовков постов, которыми мы занимались в прошлый раз.

(Примечание: Прошлый урок очень и очень важен. Если вы не до конца разобрались в том, что я рассказывал, вам необходимо перечитать урок и задавать мне вопросы, пока все не станет понятно.)

Чтобы продолжить сегодняшний урок, включите Denwer, откройте папку “Tutorial”, откройте браузер и зайдите на http://wordpress/, а также, откройте файл index.php в редакторе.

Шаг 1:

Напечатайте <?php the_content(); ?> под кодом заголовка поста.

adding-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>

У вас должно получиться следующее:

class-entry

Сохраните все и обновите страницу в браузере. Если вы снова зайдете в 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 достаточно легко запомнить, не правда ли?)

Сейчас у вас должно быть:

class-post

Вот организованная версия:

indent

Я использовал клавишу tab вместо пробелов, чтобы делать отступы в исходнике index.php. Зачем организовывать код? В отличие от моих скриншотов, в ваших кодах нет красных и зеленых подчеркиваний. А вам нужно отслеживать код. С отступами вам будет легче сказать, какой </div> закрывает тот или иной невидимый блок.

Сохраните и обновите окно браузера, чтобы увидеть изменения в исходном коде.

Зачем добавлять еще один DIV, окружающий заголовок поста и сам пост?

Вы добавили DIV class=”entry”, чтобы отделить заголовок поста от собственно записи. Данный тэг существует для разграничения одного от другого.

На этом все. Информации для осмысления довольно много, так что обязательно задавайте вопросы, если вы что-то не понимаете.

Если вы заметили какие-то ошибки или несоответствия в моих уроках, пожалуйста, сообщите мне, чтобы я сразу мог это исправить. Кстати, как вам мои уроки? Какие у вас есть замечания? Может мне стоит быть более детальным? Не слишком ли длинные "занятия"?

Жду ваших комментариев и не забудьте подписаться на RSS.

Перейти к следующему уроку »

27 комментариев

  1. Oleg пишет:

    [quote]в этом уроке, вамшлось бы кодить[/quote]
    очепятка вроде?

  2. 10 вещей которые необходимо сделать после установки WordPress | FreshTrend.ru — нос по ветру пишет:

    [...] URL-адреса ваших постов будут выглядеть примерно так wp-config.ru/?p=339. Такая структура URL плохо подготовлена для SEO и она [...]

  3. cekTop7 пишет:

    Когда ждать продолжения? Хотелось бы перейти к работе с файлом style.css

  4. Al пишет:

    Как все страницы разом править в wp ? (как html страницы заменять во всех открытых). Сори не дописал ) старый комент удалите

  5. wp-admin пишет:

    Al, не совсем понял вопрос. Вас интересует как править шаблон отображения страниц?

  6. | Сетевик сделай себе блог! пишет:

    [...] URL-адреса ваших постов будут выглядеть примерно так wp-config.ru/?p=339. Такая структура URL плохо подготовлена для SEO и она [...]

  7. greed пишет:

    Привет, такой вопросец , в произвольной структуре чпу, стоит /%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

    можно ли сделать как у тебя, и как к этому относятся яша, гугли и другие пу
    спасибо

    • wp-admin пишет:

      greed, это легко делается при помощи плагина RusToLat. Насколько мне известно, поисковики к этому относятся крайне положительно.

  8. Best пишет:

    админ скажи как сделать разный заголовок на на странице.
    на движке WordPress

  9. Ученик пишет:

    Поясните пжл, для чего вообще существует ….страница с Исходным кодом? Вроде всё делаем в редакторе.

  10. Денис пишет:

    admin молодец !!! хороший сайт

  11. RodgerFox пишет:

    хм… заинтерисовался вашими уроками ,всегда есть что нового узнать даже закрепить не помешает.
    а не моглибы подсказать как сделать так, есть код к примеру картинка выводиться слева от текста поста, потом внизу линия и след пост наоборок, картинка справа а текст слева, и поочередно так. не знаете как сделать правельно, а не что бы просто работало.

  12. euGene пишет:

    Уроки бесспорно шикарные. Я съедаю уроки взахлеб, не хватает в конце статьи ссылки на следующий урок, приходится либо же держать отдельным окном список уроков, либо же возвращаться (не особо важно, но тем не менее улучшает юзабилити). Пошел на урок №8..

  13. Павел пишет:

    Седьмой урок, полет нормальный! Спасибо:)

  14. Уральский бомж пишет:

    Мне кажется что на месте слова “Почему?” должно быть что-то навроде “Зачем?”. Ведь “тэги class=”entry” DIV появились вокруг каждого вашего поста.” Почему? Потому что участвуют в цикле. А Зачем? 2 причины.
    Хочу поблагодарить за уроки, спасибо!

  15. фото блог пишет:

    Урок пройден, сколько ещё?

  16. Ajax пишет:

    Отзывы только респектабельные!) Тем кто только начинает приобщаться- вообще лафа, множество ошибок из постов с течением времени исправляются, кнопки и юзабилити нарастает.

  17. Виктор пишет:

    Много всяких тонкостей в статье написано, я ничего не меняю, н все равно спасибо, хотя я ничего почти не понял=) Но шаблон блога у вас отличный! Сразу в глаза бросился=) Немного сероват и колонку справа бы добавить, но все равно хороший.

  18. Дмитрий пишет:

    облазил весь инет и не могу найти как сделать так чтобы разместить определенный текст (или код, банер, скрипт и тп) в конце всего контента независимо от того какая страница блога открыта, те в конце поста и тп.? Пример на вашем сайте нужно разместить ниже: сообщить мне о новых комментариях по e-mail. Помогите PLEASE)

  19. Hayk пишет:

    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!

  20. Yasha пишет:

    Здравствуйте, а не могли бы вы подсказать мне. Вставляю цикл и все необходимые функции пхп, но выводится токо один пост, ни при создании новых записей, ни при создании новых страниц больше ничего не выводится! Только одна тема страницы и ее content(), остальных нет, специально создавал и проверял. что может быть не так?

  21. Евгений пишет:

    Админ плиз исправь. the_content() это функция WordPress а не PHP. не путай людей. а так все здорово

    p.s. если я ошибся, объясни в чем))

  22. Madgreg пишет:

    вопрос не совсем в тему что то не пойму что не так, не могу получить значение произвольного поля:

    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(); как положено выводит все произвольные поля
    помогите в чем косячу

  23. Madgreg пишет:

    чет в коменте выше все echo порубило
    короч не могу понять почему не работает
    echo get_post_meta($post->ID, “views”, true);

Ваш комментарий

Этот домен продается здесь: telderi.ru, и еще много других