Как можно реализовать такое меню?

22

staskenig

28 августа 2013, 10:49

2310

Добрый день!

Есть вопрос и не могу его решить. ЦМС вордпресс.

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

Например, 10 кулинарных рецептов. Все рецепты располагаются в одной рубрике - рецепты. Этот рецепт плюс ко всему должен быть и в категории "Зима" (рецепты для зимы) и по составу, например, свекла, лук и т.д. Плюс ко всему еще и по сложности. Все это вывести в боковое меню. То есть в основной рубрике располагаются все рецепты, а они в свою очередь каталезированы по вот таким критериям и один и тот же рецепт может быть как в "Зима", так и в "Свекла" и "Сложно".

Все это я реализовал при помощи таксономии при помощи MagicFields2. Вроде как все ок, но теперь стоит задача, которую не могу решить.

В категории "По группам" (свекла, молоко, картошка...) будет добавленно еще около 100 таких таксономий и если их все разместить в боковом меню, то простыня получается еще та.

Нужно реализовать следующее. Показывается, например, 4 категорий:

Молоко

Свекла

Картошка

Лук

Но под ними добавить на скрипте "Больше"

Молоко

Свекла

Картошка

Лук

Больше

...при нажатии на которую раскрывается весь список.

А при раскрытии, меняется на "Меньше", при нажатии на которую, список сворачивается. Все это без перезагрузки страницы.

Для примера, такое реализовано на этом сайте (левое меню по ингредиентам)

101cookbooks(точка)com

Был бы благодарен, если подскажите как решить.

110

pix

28 августа 2013, 11:26

#1

staskenig, смотри в сторону http://codex.wordpress.org/Post_Types

1609

SeVlad

28 августа 2013, 13:47

#2

staskenig:
Был бы благодарен, если подскажите как решить.

Произвольные типы постов и произвольная таксономия выручат отца русской демократии.

Ссылки по теме:

http://dreamhelg.ru/2010/05/intorducing-into-custom-taxonomy-wordpress-3-0/

http://fleek.org/custom-post-type-wordpress-1/

http://oddstyle.ru/wordpress-2/stati-wordpress/polnoe-rukovodstvo-po-proizvolnym-tipam-zapisej.html

http://indysite.ru/manuals/custom-post-types-in-wordpress/

http://indysite.ru/manuals/taxonomies-of-wordpress/

Делаю хорошие сайты хорошим людям. Предпочтение коммерческим направлениям. Связь со мной через http://wp.me/P3YHjQ-3.

S

22

staskenig

29 августа 2013, 06:38

#3

Вопрос в том, что таксономию я уже сделал (см. пост). Мне нужно реализовать развертывание как на том сайте, который я указал. Подозреваю, что это сделано на аяксе

536

melkozaur

29 августа 2013, 06:55

#4

staskenig:
Мне нужно реализовать развертывание как на том сайте, который я указал

Лень писать вручную адрес сайта, увы.

1

S

22

staskenig

29 августа 2013, 14:27

#5

melkozaur:
Лень писать вручную адрес сайта, увы.

В смысле? Я указал сайт. Только поставил (точка), чтобы на индексацию не ушел

197

outtime

29 августа 2013, 14:42

#6

Покопайте в сторону toggle на javascript

Предлагаю воспользоваться моими услугами корректора. Проверю и уберу все ошибки, поправлю грамматику и склонения, сделаю текст лучше и читабельнее. Высокая скорость работы, цена 20 р за 1000 символов.

119

vlad00777

29 августа 2013, 18:09

#7

staskenig:
Подозреваю, что это сделано на аяксе

Какой аякс?

Просто тупо задают высоту для 4-ч пунктов и оверфлов, что б скрывалось, далее просто увеличивают высоту, а под ней еще пункты. Профит!

Да и смотрите как сказали в сторону toggle например.

Или еще проще, выводить все, потом скрывать все кроме первых 4-ех. Как и сделано на примере, в код посмотрите там подгружаются все пункты сразу.

Верстка. Качественно! Адаптивная, резиновая, с параллаксом и прочими плюшками. В ЛС.

ссылочный вес падает, а Закрытие внешних ссылок Подгрузка товаров по мере

T

29

turen

30 августа 2013, 03:59

#8

staskenig:
Показывается, например, 4 категорий:

Молоко
Свекла
Картошка
Лук

Но под ними добавить на скрипте "Больше"

Молоко
Свекла
Картошка
Лук
Больше

...при нажатии на которую раскрывается весь список.

А при раскрытии, меняется на "Меньше", при нажатии на которую, список сворачивается. Все это без перезагрузки страницы.

Упрощенный пример одного из вариантов реализации:


<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

<script language="javascript">

$(document).ready(function(){

    $("#allother").hide();

    $("#moreless").click(function(e) {

        var allother = $("#allother");

        $(this).text(allother.is(":visible") ? "» больше" : "« меньше");

        allother.slideToggle();

        e.stopImmediatePropagation();

        return false;

    });

});

</script>

</head>

<body>

    <div id="first4">

        <p>Первый</p>

        <p>Второй</p>

        <p>Третий</p>

        <p>Четвертый</p>

    </div>

    <div id="allother">

        <p>Пятый</p>

        <p>Шестой</p>

        <p>Седьмой</p>

        <p>Восьмой</p>

    </div> 

    <a href="#" id="moreless">» больше</a><br />

</body>

</html>

Пример живой тут.

1

S

22

staskenig

30 августа 2013, 07:08

#9

turen:
Упрощенный пример одного из вариантов реализации:

Огромное спасибо! То, что нужно. Буду разбираться

S

22

staskenig

30 августа 2013, 09:12

#10

turen:
Упрощенный пример одного из вариантов реализации:

Все получилось, но есть вопрос. Можно как-то избавиться от дергатни при раскрытии и сворачивании?

Что делать, если ваша email-рассылка попала в спам

Курс биткоина превысил $50 тысяч