УрокРазворачивающийся тизер при клике на заголовок ноды
Поступила заявка, сделать следующий урок: "Пример: страница с перечнем новостей, но показываются только тайтлы + дата публикации и автор. Нажимаешь на тайтл и под ним разворачивается на js тизер с ссылкой на полную ноду."
Для начала нам нужен будет вот такой код в файле node.tpl.php:
<div id="node-<?php echo $node->nid; ?>" class="node"> <?php if ($title): ?> <h2 class = "title"> <?php echo $title; ?> <!-- Заголовок статьи --> </h2> <?php endif; ?> <?php if ($teaser): ?> <!-- Если это анонс --> <div class = "node_content teaser"> <!-- выводим содержимое анонса --> <?php echo $content; ?> <!-- выводим ссылку на полную ноду --> <?php echo l(t('Read more'), 'node/'. $node->nid); ?> </div> <?php endif; ?> <?php if ($page): ?> <!-- Если это статья --> <div class = "node_content"> <?php echo $content; ?> </div> <?php endif; ?> <div class = "name"> <?php echo $name; ?> <!-- Имя автора статьи --> </div> <div class="postdate"> <?php echo date('j F, Y - G:i',$node->created); ?> <!-- Дата создания статьи --> </div> </div>
Затем в файл в отдельный файл вставляем вот такой скрипт:
$(document).ready(function() { $(".node h2.title").click(function() { $(this).parent().find(".node_content").toggle(); }); });
Сохраняем его под каким-нибудь именем.js и подключаем через info-файл. Да-да, хоть он и маленький, но тем не менее это скрипт :)
Теперь всё будет прекрасно работать. Ещё неплохо было бы в css указать .node_content.teaser { display: none; } , т.к. изначально анонсы будут скрыты. А для h2.title { cursor: pointer; } , чтобы пользователь визуально видел что это ссылка.
- Spleshka
- 11.09.2010
- 10819
Комментарии
Спасибо большое) а что будут видеть те у кого выключена поддержка js?
Просто заголовки кликабельные, без тизеров
тоже самое б через AJAX, доходчиво, только с тизером и фуллбоди, Эх...лети лети лепесток.
дойдём до аякса, без проблем. Только чуть-чуть попозже
замените "ложим" на "кладем"-)
лингвист среди программистов ?))
филолог)
:WALL:
А если нужно сделать тоже самое но для вторых или третьих страниц, а не на главной, то как должен выглядеть код?
Объясните зачем нужен этот кусок кода,
если выводить планировалось только тизер?
сорри, незнаю как корректно изобразить код.
Ну мы тизер-то выводим, но полная нода тоже ведь должна что-то отображать) Если не планируется переходить по ней на полную ноду - то хотя бы для поисковиков, чтобы страницы пустыми не были
Теперь понятно.
А как быть с этим -
если нужно сделать тоже самое но для вторых или третьих страниц, а не на главной, то как должен выглядеть код?
Если на вторых и третьих страницах отображается тизер, то код по-прежнему будет работать. В шаблоне же нет зависимостей от главной страницы
ок, просто меня "$front_page" в коде смутило.
то было ссылка на главную страницу. Кстати, я поменял формирование этой ссылки на более кошерный - через функцию l(). А то не определялся бы урл модуля pathauto, и всегда линковался бы на node/%nid. А теперь всё будет красиво
Извиняюсь за возможно глупый вопрос, т.к. только начал разбираться с Друпалом... И в случае анонса, и в случае статьи выводится одна и та же переменная $content, а значение этой переменной потом меняется в зависимости от того, анонс это или статья?
Да, меняется.
Сорри, с Drupal пока на Вы, поэтому прошу подсказки - во views вывожу тизеры новостей, в предпросмотре темы garland все ок, а в моей собственной теме не выводятся линки на полный материал. Где пнуть, чтобы заработало? Спасибо заранее. PS Drupal 6.25
Упс, искал в сети ответ на вопрос, нашел подходящую тему, чтобы задать вопрос, а ответ как раз и есть в этой теме урока - создал node.tpl.php как у Вас, убрал лишнее для меня (автор, время) - все стало хорошо :)
PS Спасибо, что Вы есть! :)
К view можно как-то это прикрутить? И есть ли путь сделать так что бы тизер появлялся при наведении мышки.
..извиняюсь за возможно глупый для кого-то вопрос, я новичок в друпале, чуть больше полугода :)
Комментировать