Олег Власов
logo
Магазин контента WordPress

Коллекция Wordpress

темы и плагины wordpress: установка wordpress, настройка wordpress, использование wordpress, авторский перевод на русский язык шаблонов и плагинов Wordpress

По-моему, вчера в своей очередной публикации я предложил вам рассмотреть моё предложение: стоит или нет мне публиковать статьи, посвященные редактированию шаблонов WordPress? Пока комментариев от вас не поступило, но я решил все же попробовать начать :)

Итак, с чего начать? Я не преподаватель курса php-программирования, и сам его знаю не в совершенстве, также как и HTML-верстку и свойства стилей CSS. Но. Занимаясь переводом и адаптацией шаблонов WordPress, хочешь или нет, а разбираться в этом необходимо. Я не буду переписывать и копипастить чужие статьи на эту тему, их достаточно много в Сети и большинство из них — чужие мысли, так как авторы даже в комментариях ответить не могут правильно на вопросы своих посетителей. Просто тырят друг у друга и публикуют за свои.

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

Вот вам первый пример и первый вариант такой ситуации.

13 января я опубликовал шаблон под названием Beauty Spa. Вот его картинка:

Там в описании особенностей я написал, что изначально на главной странице в анонсах статей не было картинок, и я их туда добавил. Каким образом? Терпение.

Вчера, просматривая свои папки с шаблонами, которые я готовлю к переводу, наткнулся на еще один похожий шаблон этого же автора, на эту же тему. Завтра я его выложу. А сегодня я уже отредактировал файл index.php и добавил картинку в анонсы. Как? Терпение :)

Дело в том, что у автора есть еще шаблон, очень похожий по макетированию, но посвященный другой теме — отдыху и путешествиям. И называется он Beach Evening, что-то типа «вечер на побережье». Я его когда-то переводил и адаптировал для одного своего заказчика. Он лежит у меня в портфолио. Посмотрите на него и вы увидите, что в том шаблоне автор сделал вывод картинок. А в этих двух — нет. Почему — не знаю. Может быть, был в не настроении? :)

Что я увидел. Макеты абсолютно одинаковые. Именно макеты вывода анонсов, так как сайдбары выводятся в этих шаблонах немного иначе. То, что внутри страницы между сайдбарами на главной — это работает файл index.php шаблона. Поэтому, что я сделал сначала: открыл файл index.php из шаблона без картинок и такой же файл — из шаблона с картинками. И стал визуально сравнивать. Давайте попробуем вместе:

Вот вам код из файла index.php без картинок:

<div id="content">
<?php include (TEMPLATEPATH . '/side_ad_block.php'); ?> /* подключение файла
<?php if (have_posts()) : ?> /* начало цикла вывода записей
<?php while (have_posts()) : the_post(); ?>
<div id="post-<?php the_ID(); ?>"> /* определение записи по ID
<div>
<div>
<div>
<div>
<?php the_category(', ') ?> /* название рубрики
</div>
<div>
<?php the_time('F jS, Y') ?> /* вывод даты публикации
</div>
<div></div>
<div>
<a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>"><?php the_title(); ?></a> /* заголовок записи
</div>
<?php if(function_exists('the_content_limit')) the_content_limit(800, ""); ?> /* анонс с ограничением символов
</div>
<div>
<div><?php comments_popup_link('No Comments', '1 Comment', '% Comments'); ?></div> /* вывод количества комментариев к записи
<div>
<a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>"> /* ссылка на "читать далее"
<img height="26" width="110" align="absmiddle" src="<? bloginfo('template_directory'); ?>/images/more.gif" /></a> /* картинка где "читать далее"
</div>
</div>
</div></div></div>
<?php endwhile; ?>
<?php endif; ?> /* конец цикла вывода записей на главной
<?php if ($prev_link || $next_link): ?>

Я вам написал пояснения почти в каждой строке кода, для того, чтобы вам более понятно было. как работает php-файл под названием index.php. Как видите, нет ни одного кусочка кода, отвечающего за вывод картинки. Почему? Я его там действительно нет.

Теперь открываем файл index.php шаблона с картинкой в анонсе. Не буду повторять вам весь код. Он такой же. за исключением: между описанными выше двумя частями кода файла index.php есть вот такой код:

<div>
<?php the_time('M jS, Y') ?>
</div>
<?php $Img = get_post_meta($post->ID, "post_thumb", true); if ($Img != '') { ?>    /* Вот это как раз и вывод картинки с помощью Произвольного поля 'post_thumb'
<div style="height:100px;float:left; padding:1px">
<a href="<?php the_permalink() ?>" rel="bookmark" title="<?php printf(__('Permanent Link to %s', ''), the_title_attribute('echo=0')); ?>">
<img src="<?php echo $Img; ?>" alt="<?php the_title_attribute(); ?>" style="padding:0;margin:0;height:100px;width:250px; border:1px solid #999999" />
</a>
</div>
<?php $num=500; } else {
$num=850;
}?>
<div></div>
<div>
<a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>"><?php the_title(); ?></a>
</div>
<?php if(function_exists('the_content_limit')) the_content_limit($num, ""); ?>
</div>
<div>
<div><?php comments_popup_link('No Comments', '1 Comment', '% Comments'); ?></div>
<div>
<a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>">Keep Reading...</a></div>
</div>
</div></div></div>
<?php endwhile; ?>
<?php endif; ?>
<?php if ($prev_link || $next_link): ?>

Как видите, код очень короткий, а сколько хорошего может вам дать? :) Берем и с использованием научного метода — копировать-тире-вставить, переносим нужный фрагмент в наш файл index.php который без картинки. Не забываем сохранить, и не забываем, что простым блокнотом это делать не надо. Используйте специальные редакторы для работы с PHP-файлами.

Вот в принципе и все. Благодарю. что дочитали до конца. Если понравилось, а возможно, что и не понравилось — напишите в комментариях — надо публиковать такие статьи или ну их к лешему!

Конечно, править надо не на сайте, а на локальном сервере, редактировать файлы в специальном редакторе с поддержкой отключения сигнатуры BOM. И желательно код вывода картинки «одеть» каким-нибудь дивом, в который заложить определенные свойства форматирования.

Вот в принципе и все. Благодарю. что дочитали до конца. Если понравилось, а возможно, что и не понравилось — напишите в комментариях — надо публиковать такие статьи или ну их к лешему!


Олег ШаблоныШпаргалки

По-моему, вчера в своей очередной публикации я предложил вам рассмотреть моё предложение: стоит или нет мне публиковать статьи, посвященные редактированию шаблонов WordPress? Пока комментариев от вас не поступило, но я решил все же попробовать начать :)

Итак, с чего начать? Я не преподаватель курса php-программирования, и сам его знаю не в совершенстве, также как и HTML-верстку и свойства стилей CSS. Но. Занимаясь переводом и адаптацией шаблонов WordPress, хочешь или нет, а разбираться в этом необходимо. Я не буду переписывать и копипастить чужие статьи на эту тему, их достаточно много в Сети и большинство из них — чужие мысли, так как авторы даже в комментариях ответить не могут правильно на вопросы своих посетителей. Просто тырят друг у друга и публикуют за свои.

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

Вот вам первый пример и первый вариант такой ситуации.

13 января я опубликовал шаблон под названием Beauty Spa. Вот его картинка:

Там в описании особенностей я написал, что изначально на главной странице в анонсах статей не было картинок, и я их туда добавил. Каким образом? Терпение.

Вчера, просматривая свои папки с шаблонами, которые я готовлю к переводу, наткнулся на еще один похожий шаблон этого же автора, на эту же тему. Завтра я его выложу. А сегодня я уже отредактировал файл index.php и добавил картинку в анонсы. Как? Терпение :)

Дело в том, что у автора есть еще шаблон, очень похожий по макетированию, но посвященный другой теме — отдыху и путешествиям. И называется он Beach Evening, что-то типа «вечер на побережье». Я его когда-то переводил и адаптировал для одного своего заказчика. Он лежит у меня в портфолио. Посмотрите на него и вы увидите, что в том шаблоне автор сделал вывод картинок. А в этих двух — нет. Почему — не знаю. Может быть, был в не настроении? :)

Что я увидел. Макеты абсолютно одинаковые. Именно макеты вывода анонсов, так как сайдбары выводятся в этих шаблонах немного иначе. То, что внутри страницы между сайдбарами на главной — это работает файл index.php шаблона. Поэтому, что я сделал сначала: открыл файл index.php из шаблона без картинок и такой же файл — из шаблона с картинками. И стал визуально сравнивать. Давайте попробуем вместе:

Вот вам код из файла index.php без картинок:

<div id="content">
<?php include (TEMPLATEPATH . '/side_ad_block.php'); ?> /* подключение файла
<?php if (have_posts()) : ?> /* начало цикла вывода записей
<?php while (have_posts()) : the_post(); ?>
<div id="post-<?php the_ID(); ?>"> /* определение записи по ID
<div>
<div>
<div>
<div>
<?php the_category(', ') ?> /* название рубрики
</div>
<div>
<?php the_time('F jS, Y') ?> /* вывод даты публикации
</div>
<div></div>
<div>
<a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>"><?php the_title(); ?></a> /* заголовок записи
</div>
<?php if(function_exists('the_content_limit')) the_content_limit(800, ""); ?> /* анонс с ограничением символов
</div>
<div>
<div><?php comments_popup_link('No Comments', '1 Comment', '% Comments'); ?></div> /* вывод количества комментариев к записи
<div>
<a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>"> /* ссылка на "читать далее"
<img height="26" width="110" align="absmiddle" src="<? bloginfo('template_directory'); ?>/images/more.gif" /></a> /* картинка где "читать далее"
</div>
</div>
</div></div></div>
<?php endwhile; ?>
<?php endif; ?> /* конец цикла вывода записей на главной
<?php if ($prev_link || $next_link): ?>

Я вам написал пояснения почти в каждой строке кода, для того, чтобы вам более понятно было. как работает php-файл под названием index.php. Как видите, нет ни одного кусочка кода, отвечающего за вывод картинки. Почему? Я его там действительно нет.

Теперь открываем файл index.php шаблона с картинкой в анонсе. Не буду повторять вам весь код. Он такой же. за исключением: между описанными выше двумя частями кода файла index.php есть вот такой код:

<div>
<?php the_time('M jS, Y') ?>
</div>
<?php $Img = get_post_meta($post->ID, "post_thumb", true); if ($Img != '') { ?>    /* Вот это как раз и вывод картинки с помощью Произвольного поля 'post_thumb'
<div style="height:100px;float:left; padding:1px">
<a href="<?php the_permalink() ?>" rel="bookmark" title="<?php printf(__('Permanent Link to %s', ''), the_title_attribute('echo=0')); ?>">
<img src="<?php echo $Img; ?>" alt="<?php the_title_attribute(); ?>" style="padding:0;margin:0;height:100px;width:250px; border:1px solid #999999" />
</a>
</div>
<?php $num=500; } else {
$num=850;
}?>
<div></div>
<div>
<a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>"><?php the_title(); ?></a>
</div>
<?php if(function_exists('the_content_limit')) the_content_limit($num, ""); ?>
</div>
<div>
<div><?php comments_popup_link('No Comments', '1 Comment', '% Comments'); ?></div>
<div>
<a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>">Keep Reading...</a></div>
</div>
</div></div></div>
<?php endwhile; ?>
<?php endif; ?>
<?php if ($prev_link || $next_link): ?>

Как видите, код очень короткий, а сколько хорошего может вам дать? :) Берем и с использованием научного метода — копировать-тире-вставить, переносим нужный фрагмент в наш файл index.php который без картинки. Не забываем сохранить, и не забываем, что простым блокнотом это делать не надо. Используйте специальные редакторы для работы с PHP-файлами.

Вот в принципе и все. Благодарю. что дочитали до конца. Если понравилось, а возможно, что и не понравилось — напишите в комментариях — надо публиковать такие статьи или ну их к лешему!

Конечно, править надо не на сайте, а на локальном сервере, редактировать файлы в специальном редакторе с поддержкой отключения сигнатуры BOM. И желательно код вывода картинки «одеть» каким-нибудь дивом, в который заложить определенные свойства форматирования.

Вот в принципе и все. Благодарю. что дочитали до конца. Если понравилось, а возможно, что и не понравилось — напишите в комментариях — надо публиковать такие статьи или ну их к лешему!

Понравилась статья? Поделись с друзьями!

Что еще читают:

Внимание!

Прежде, чем задавать свой вопрос - пожалуйста, прочитайте F.A.Q.

10 коммент. пока.

  1. Leonard:

    Добрый день. Просьба подсказать, как можно сделать, чтобы на сайте в анонсах статей выводились первые изображения из статей одинакового размера? Спасибо.

  2. admin:

    У вас шаблон стоит, который сделан в программе Artisteer, там есть особенности формирования кода.
    Прочтите похожую статью об этом, только в моем другом блоге — https://www.bestwordpress.org.ua/archives/15536
    Возможно, что этот вариант вам поможет.
    Удачи.

  3. Может, конечно, у меня руки кривые и я мало чего смыслю в этом, но у меня не получилось. Может это работает не во всех темах?

  4. Alitejutkit:

    Регистрируюсь на форуме.

  5. k0tello:

    Сорри, похоже вчера какие-то глюки были — весь код отображался неформатированным текстом — сегодня уже норм… возможно это мой FF виноват… Еще раз прошу прощения :)

  6. k0tello:

    Статья хорошая, но позвою себе один совет — чтобы хорошо отображался рнр-код, используйте плагин wp-syntax. Удачи!

    • admin:

      я бы с удовольствием его использовал, но он не хочет работать на моем блоге, поэтому и использую codecolorer :)

  7. Я типа сознательный ))) пишу коммент ))
    Нормальная статья, попытаюсь реализовать у себя на сайте.

Добавить комментарий


Если вы хотите добавить код HTML, PHP или CSS, воспользуйтесь коротким кодом: [php]здесь код[/php]





Искать на сайте

icon
Подняться наверхПодняться наверх