8Dle
Авторизация

Компактный вид комментариев на сайте

Компактный вид комментариев на сайте

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

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

Для реализации задуманного, понадобится: плагин jQuery Cookie, установив который, мы получим удобный инструмент, чтобы легко и быстро управлять куками, а еще понадобится немного вашего терпение.

Автор: Пафнутый


Для остальных изложу суть.

Для чего это нужно?


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

Как сделать?


Всё очень просто!
1. Потребуются:
- Плагин jquery.cookie.js (для лёгкой и непринуждённой работы с куками)
- Прямые руки.

2. Код javascript, он приведен ниже::
$(".comment").addClass($.cookie("small_comments"));
 
	$(".compact-mode").click(function () {  
		$.cookie("small_comments", "small"); 
		$(".comment").removeClass("normal").removeClass("small").addClass($.cookie("small_comments"));
		return false;
	});

	$(".normal-mode").click(function () { 
		//comCook.text="";					 
		$.cookie("small_comments", "normal"); 
		$(".comment").removeClass("normal").removeClass("small").addClass($.cookie("small_comments"));
		return false;
	});


Теперь разберем код, чтобы было понятно что, зачем и куда.
$.cookie("small_comments") - это переменная, в нее будет считываться и сохранятся куки пользователя. А затем на основе данных из этой переменной, будут выводится комментарии на страницы.
Если пользователь впервые открыл страницу сайта, переменная остается пустой. Если же пользователь после открытия страницы, кликну по одной из ссылок позволяющих переключить режим вывода комментариев, в куки записывается определенный параметр. Так, одна из ссылок обрабатывается классом compact-mode и при клики по ней, в куки пользователя сохраняется параметр "small". За вторую ссылку отвечает класс normal-mode и в том случаи, если кликнули по второй ссылки, в куки передастся параметр "normal". Параметр сохраненый в куках, теперь при последующих обновлениях страницы, считывается и записывается для всех блоков comment.

3. Осталось подточить немного стили.
Теперь осталось самое простое, открыть стили в текстовом редакторе и немного их подправить. В качестве примера, ниже приведен сокращенный вариант стилей.

Код стилей:
.comment {...}
	.comment.small {...}
	.inner {...}
		.small .inner {...}

Как видно в приведенном примере, нужно лишь вписать параметр "small", в качестве имени класса, это изменит отображения комментариев при их выводе на страницы.

Автор текста: Cajka

Скачать:
kompaktnyy-rezhim-dlya-kommentariev.zip [99,08 Kb] (cкачиваний: 759)

Жмите на Кнопу ниже, или подписывайтесь!


Читайте также
Информация
Посетители, находящиеся в группе Гости, не могут оставлять комментарии к данной публикации.


Dle это движок который изначально проектировался для создания новостных сайтов, но по мере своего развития движка значительно расширил свою функциональность и стал универсальным средством разработки и сопровождения сайтов и блогов различной направленности и тематики. По сравнению с другими бесплатными (и некоторыми платными) CMS системами движок dle обладает довольно обширными возможности.

Авторизация