Шаблоны (темы) для WordPress. Скачать русифицированные WordPress темы.
Статьи по WordPress

Статьи по WordPress – здесь публикуются записи о том, как можно улучшить Ваш блог, защитить его, предотвратить появление ошибок. Условно говоря, это аптечка для WordPress. Посмотреть записи этой рубрики

Хитрости WordPress

Хитрости WordPress – здесь публикуются готовые рецепты для сайта на WordPress, с помощью которых за несколько минут можно добавить новые возможности в функционал Вашего блога. Посмотреть записи этой рубрики
Премиум шаблон Secret Garden 2

Популярная премиум тема со множеством интересных опций. Настраивается быстро из консоли. Шаблон сопровождается беспрецедентной техподдержкой. Перейти на страницу шаблона
Премиум WP тема BlogPost

GoodwinPress.ru представляет новый премиум шаблон для WordPress под названием BlogPost. Это настраиваемая тема с резиновым контейнером. Шаблон выполнен в стиле WordPress 3+. Перейти на страницу шаблона

Главная » Хаки WordPress » Еще 3 хака для WordPress: сделай выпадающим все на свете!

Еще 3 хака для WordPress: сделай выпадающим все на свете!

Контент © 2009 wpbot.ru. Сплоги в топку! Если Вы читаете эту статью не на wpbot.ru или planet.mywordpress.ru, значит, Вы читаете ее на сайте какого-то тупого пингвина, транслирующего мой rss фид )))) Шлите его лесом и переходите на сайт оригинала!

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

Поэтому, когда появляется способ убрать лишнее, но, при этом, не потерять индексируемый контент, Вы радуетесь, как дитя. Сегодня я дам Вам повод для такой радости ))) Еще 3 хака для WordPress помогут Вам разобраться с рубриками, архивами и метками, которые обычно занимают много полезного места. Вместо статичных списков мы сделаем их выпадающими (drop down). Именно поэтому сегодня наш девиз – сделай выпадающим все, что только можешь. И что особенно важно – свернутые в дроп даун архивы по-прежнему продолжают индексироваться, так что наш драгоценный контент и перелинковка никуда от нас не денутся. Эти рецепты хороши тем, что все делается за одну минуту и не требует каких-то специальных знаний. Достаточно иметь фтп-клиент, настроенный на работу с сервером, и правильный текстовый редактор для редактирования файлов Вашего wordpress шаблона (если Вы ничего не знаете о вреде Блокнота и не знакомы с нормальными редакторами, загляните в FAQ здесь, на боте).

Как сделать выпадающие рубрики?
Итак, начнем с рубрик, поскольку это наиболее важная часть. Длинную простыню рубрик можно легко уместить в маленькое окошко.

1. Для начала уберем старые рубрики. Два варианта – а) у Вас рубрики выводятся через виджет – просто отключите его в админке; б) у Вас рубрики выводятся через код в сайдбаре. Откройте файл sidebar.php Вашей темы, найдите блок рубрик (wp_list_categories) и удалите его.
2. Теперь вместо удаленного кода вставьте новый:

    <form action="<?php bloginfo('url'); ?>/" method="get" id="cat">
        <?php
       $select = wp_dropdown_categories('show_option_none=Выбрать рубрику&show_count=1&orderby=name&echo=0');
       $select = preg_replace("#<select([^>]*)>#", "<select$1 onchange='return this.form.submit()'>", $select);
        echo $select;
        ?>
        <noscript><input type="submit" value="View" /></noscript>
        </form>


Это все. Надеюсь, у Вас все получилось с первого раза. Идем дальше.

Как сделать выпадающие архивы?
1. Система такая же: если прежде Вы юзали виджет – отрубите его, а если код, то найдите его в сайдбаре и приговорите к ликвидации (wp_get_archives).
2. Вставьте в sidebar.php новый код:

    <select name=\"archive-dropdown\" onChange='document.location.href=this.options[this.selectedIndex].value;' id="arch">
        <option value=\"\"><?php echo attribute_escape('Выбрать месяц'); ?></option>
        <?php wp_get_archives('type=monthly&format=option&show_post_count=1'); ?> </select>


Видите, как это просто?

Теперь немного перекурим и приступаем к третьей задаче – сделаем
выпадающий список меток.

1. Уберите старый виджет или код (wp_tag_cloud).
2. Откройте файл functions.php Вашего шаблона и вставьте туда нижеследующий код (вставить можно в любое свободное место, главное, чтобы не внутрь другого кода и чтобы все поместилось между < ? и ? > ).

    function dropdown_tag_cloud( $args = '' ) {
    $defaults = array(
        'smallest' => 8, 'largest' => 22, 'unit' => 'pt', 'number' => 45,
        'format' => 'flat', 'orderby' => 'name', 'order' => 'ASC',
        'exclude' => '', 'include' => ''
    );
    $args = wp_parse_args( $args, $defaults );

    $tags = get_tags( array_merge($args, array('orderby' => 'count', 'order' => 'DESC')) ); // Always query top tags

    if ( empty($tags) )
        return;

    $return = dropdown_generate_tag_cloud( $tags, $args ); // Here's where those top tags get sorted according to $args
    if ( is_wp_error( $return ) )
        return false;
    else
        echo apply_filters( 'dropdown_tag_cloud', $return, $args );
}

function dropdown_generate_tag_cloud( $tags, $args = '' ) {
    global $wp_rewrite;
    $defaults = array(
        'smallest' => 8, 'largest' => 22, 'unit' => 'pt', 'number' => 255,
        'format' => 'flat', 'orderby' => 'name', 'order' => 'ASC'
    );
    $args = wp_parse_args( $args, $defaults );
    extract($args);

    if ( !$tags )
        return;
    $counts = $tag_links = array();
    foreach ( (array) $tags as $tag ) {
        $counts[$tag->name] = $tag->count;
        $tag_links[$tag->name] = get_tag_link( $tag->term_id );
        if ( is_wp_error( $tag_links[$tag->name] ) )
            return $tag_links[$tag->name];
        $tag_ids[$tag->name] = $tag->term_id;
    }

    $min_count = min($counts);
    $spread = max($counts) - $min_count;
    if ( $spread <= 0 )
        $spread = 1;
    $font_spread = $largest - $smallest;
    if ( $font_spread <= 0 )
        $font_spread = 1;
    $font_step = $font_spread / $spread;

    // SQL cannot save you; this is a second (potentially different) sort on a subset of data.
    if ( 'name' == $orderby )
        uksort($counts, 'strnatcasecmp');
    else
        asort($counts);

    if ( 'DESC' == $order )
        $counts = array_reverse( $counts, true );

    $a = array();

    $rel = ( is_object($wp_rewrite) && $wp_rewrite->using_permalinks() ) ? ' rel="tag"' : '';

    foreach ( $counts as $tag => $count ) {
        $tag_id = $tag_ids[$tag];
        $tag_link = clean_url($tag_links[$tag]);
        $tag = str_replace(' ', '&nbsp;', wp_specialchars( $tag ));
        $a[] = "\t<option value='$tag_link'>$tag ($count)</option>";
    }

    switch ( $format ) :
    case 'array' :
        $return =& $a;
        break;
    case 'list' :
        $return = "<ul class='wp-tag-cloud'>\n\t<li>";
        $return .= join("</li>\n\t<li>", $a);
        $return .= "</li>\n</ul>\n";
        break;
    default :
        $return = join("\n", $a);
        break;
    endswitch;

    return apply_filters( 'dropdown_generate_tag_cloud', $return, $tags, $args );
}

3. Таким образом, мы запрограммировали функцию drop down меток, осталось вывести ее в шаблоне. Открываем sidebar.php в Вашем шаблоне и вставляем туда код:

    <select name="tag-dropdown" onchange="document.location.href=this.options[this.selectedIndex].value;" id="tag">
 <option value="#">Выбрать метку</option>
    <?php dropdown_tag_cloud('number=0&order=asc'); ?>
</select>


Первые два пункта я выдернул из шаблона Jai Nischal Verma (blogohblog.com), а третий уже не помню откуда – с тех пор, как впервые этот метод появился на сайте wprecipes.com и перекочевал оттуда в гостевом посте на smashingmagazine.com, он был широко растиражирован по интернету, и отметился даже на некоторых русскоязычных сайтах, якобы как собственная наработка их авторов, что меня безмерно позабавило )))))))))))

Теперь последний штрих на закуску.
Если Вы поставите все эти три блока себе на сайт, то увидите, что все выпадающие списки получились разной ширины. Для того, чтобы привести их в божеский вид, я добавил в код стили, который Вам нужно просто вставить в свой файл style.css:

#arch, #cat, #tag {width:240px; }

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

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

PS Эти хаки я включу в свой новый шаблон Device, который я не так давно рекламировал.

Опубликовал Goodwin 5 ноября 2009.
Размещено в Хаки WordPress.
Метки: , , .

Ранее в этой же рубрике

Об авторе
Меня зовут Алексей (Goodwin), я переводчик шаблонов и WordPress девелопер. Живу в Петербурге, занимаюсь веб-разработками, люблю Depeche Mode, хорошую поэзию, чай с бергамотом. Мои собственные темы для WP Вы найдете на goodwinpress.ru. Загляните ко мне на Twitter.

К записи оставлено 18 коммент.

05 11 2009 | eXweed

Блин! Опять мой коммент первый о_О Я не нарошно, честное слово =)Полезный хак, бо иногда заходишь на сайт и с тоской смотришь на список рубрик уходящий вдаль.

Ответить
05 11 2009 | Goodwin

ДОБАВИЛ ДЕМО ВЫПАДАЮЩИХ РУБРИК, АРХИВОВ И МЕТОК.

Ответить
05 11 2009 | Валерий Матвеев

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

Ответить
05 11 2009 | тут

а смысл ? в вордпресе в виджетах есть такая функция по умолчанию… только для меток нет… так что смысла нет

Ответить
06 11 2009 | elektrod

Чуть не в тему, а можно узнать как интегрировать поиск от гугла в блог wordpress?

Ответить
06 11 2009 | Goodwin

elektrod,а что тут сложного? получаешь в своем аккаунте код поисковой формы и заменяешь им дефолтный поиск в шаболоне. часто он вынесен в темах в отдельный файл searchform.php либо прописан в шапке или сайдбаре как

 <form id="searchform" method="get" action="<?php echo $_SERVER['PHP_SELF']; ?>">
        <input type="text" value="запрос+enter..." name="s" id="s" onfocus="if (this.value == 'запрос+enter...') {this.value = '';}" onblur="if (this.value == '') {this.value = 'запрос+enter...';}" />
    </form>
Ответить
06 11 2009 | Goodwin

к комментарию 4

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

Ответить
07 11 2009 | RodgerFox

честно не нравится мне такие выпадающие меню, лутше сделать как облако тегов, либо прокручивать. ну к примеру создать таблицу и 2 кнопки (туда) (суда) и в маленьком пронстранстве крутить, если мало ещё и оглавление где то размеров в 4-8 xD

Ответить
21 12 2009 | mixxael

А можно как-то группировать метки и выводить двумя выпадающими списками каждую группу меток, чтобы можно было фильтровать по двум параметрам?

Ответить
22 12 2009 | Goodwin

mixxael,Ваш вопрос поставил меня в тупик. буду думать, однако.

Ответить
22 12 2009 | mixxael

И еще вопрос: можно ли убрать скобки вместе с количеством постов с данной меткой?

Ответить
22 12 2009 | mixxael

Последний вопрос снимается..
я уже в коде сам нашел)))

Ответить
26 12 2009 | Alex

Hi Goodwin,С Наступающим!

Спасибо за пост,отличные коды,очень пригодились!

Есть такой вопрос,как сделать что бы выпадали записи только одной рубрики?

То есть вывод рубрики поменять на вывод постов одной рубрики.

Если не затруднит,подскажи пожалуйста.

Ответить
02 01 2010 | Загадочный

Брожу брожу по интернету и никак не найду. Часто в Вам на блог перебрасывает и каждый раз я забываю за чем пришел и читаю на что попадаю :-) Но этот раз я настроен серьезно, так как такую простую вещь не могу сделать и никто о ней не пишет. Проблема в том, что хочу понять как выводятся теги определенного материала. Вот у вас в теме это реализовано, можете код выложить? Я имею ввиду как метки выводятся. И ещё вопрос насчет тегов: можно ли сделать, чтобы пользователь мог выбрать 2 метки примеру и увидеть записи, где стоят эти 2 метки? У меня сайт о загадках, а как Вы понимаете их много :-) Это облегчило бы поиск нужных загадок. Очень жду вашего ответа!

Ответить
06 01 2010 | eavasi™

Леша, спасибо за статейку. Хорошо, что собрано все вместе. Полезно. Сейчас все это себе на “Белую Шляпу” установлю. Хоть недостатком места и не страдаю (все в переключающихся вкладках на jquery), но все равно, выпадающие списки лучше, чем крутить длинные портянки вниз-вверх.
Благодарю, Леша.
Евгений Васильев aka eavasi (”Белая Шляпа” eavasi.ru)

Ответить
18 02 2010 | seventh

Спасибо за подсказку. Пригодилось

Ответить
20 02 2010 | Карп

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

Ответить
07 04 2010 | berserk

здравствуйте, спасибо. :) ))

Ответить


Оставить комментарий или два

Пожалуйста, перед комментированием прочтите это.

Комментирование старых записей отключено.
Я ценю то, что Вы потратили время, чтобы написать здесь комментарий. Вместе с тем, прошу Вас иметь в виду:
Придерживайтесь темы, старайтесь быть адекватным и вежливым. Не забывайте про "здравствуйте" и "спасибо". Будут удалены: троллинг, флейм, бессмысленные посты, спам. Перед отправкой комментария впечатайте ответ на антиспам-вопрос. Я стараюсь отвечать почти на каждый комментарий. Если Вы не получили ответа так быстро, как хотели бы, извините меня и помните о том, что Вас много, а я один, и у меня есть свои дела и право на крепкий здоровый сон.
Все комментарии модерируются. Модерация комментария может задержать его публикацию, нет нужды комментить повторно.

Если Вы хотите вставить код, то используйте специальные теги для корректного отображения:

[cc lang ="html"]
ваш код здесь
[/cc]

Отслеживать комментарии по RSS

2008-2010 © Goodwin · Вход · Наверх