Виджеты SEO форума MaulTalk.com

Коды для вставки на сайт

Сейчас есть два вида кодов для вставки на свои сайты: свежие посты и новые темы.

В экспортируемых виджетах есть возможность полностью изменить внешний вид виджета под свой сайт/блог. У вас есть возможность настраивать:
1. Число выводимых записей.
2. Изменять размер виджета.
3. Изменять длину текста у ссылок.
4. Включать/отключать отображение времени.
5. Подключать свой файл с CSS.

Благодаря этим возможностям Вы можете встроить эти виджеты практически в любой сайт и вписать его в любой дизайн, отредактировав CSS и настроив параметры вывода.

Стандартные коды виджетов

Новые темы:

//Дополнительные настройки
var maultalk_posts_widget_max_len=0; //Если текст больше указанной длины, то он обрезается до этой длины, а вместо остаточного текста пишется многоточие. При maultalk_posts_widget_max_len=0 тексты не обрезаются.
var maultalk_posts_widget_hidetime=0; //Отображение времени. Когда значение равно 0 - время показывается, 1 - время не показывается.
</script>
<script language="JavaScript">
var maultalk_posts_widget_data_url='http://widgets.maultalk.com/topics_export.php?style='+maultalk_posts_widget_style_url+'&count='+maultalk_posts_widget_count+'&max_len='+maultalk_posts_widget_max_len+'&hidetime='+maultalk_posts_widget_hidetime+'&referer='+escape(location.href);

document.write('<if'+'rame src="'+maultalk_posts_widget_data_url+'" width="'+maultalk_posts_widget_size_X+'" height="'+maultalk_posts_widget_size_Y+'" scrolling="no" frameborder="no"></ifr'+'ame>');
</script>

Свежие посты:

//Дополнительные настройки
var maultalk_posts_widget_max_len=0; //Если текст больше указанной длины, то он обрезается до этой длины, а вместо остаточного текста пишется многоточие. При maultalk_posts_widget_max_len=0 тексты не обрезаются.
var maultalk_posts_widget_hidetime=0; //Отображение времени. Когда значение равно 0 - время показывается, 1 - время не показывается.
</script>
<script language="JavaScript">
var maultalk_posts_widget_data_url='http://widgets.maultalk.com/posts_export.php?style='+maultalk_posts_widget_style_url+'&count='+maultalk_posts_widget_count+'&max_len='+maultalk_posts_widget_max_len+'&hidetime='+maultalk_posts_widget_hidetime+'&referer='+escape(location.href);

Пожалуй, нет необходимости подробно расписывать, что делает тот или иной параметр, но все же следует сказать о некоторых важных моментах. Вывод виджета осуществляется через iframe. Это сделано для того, чтобы данные в виджете могли обновлятся автоматически, т.е. без необходимости вручную обновлять страницу. В связи с тем, что используется iframe, есть один недостаток: статические размеры виджета вне зависимости от количества данных. Если Вы, например, указали вывод 25 постов и высоту виджета ограничили 250 пикселями, то у Вас все посты просто не уместятся в виджете, и часть останется невидимой пользователю. В связи с этим необходимо увеличить высоту виджета, вручную подобрав нужный размер.

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

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

CSS по умолчанию, который используется в виджетах:

Иходный код виджета во фрейме:

<html>
<head>
	<title></title>
		<style type="text/css">/*Стили, указнные выше*/</style>
		<script language="JavaScript" src="http://widgets.maultalk.com/jquery.min.js"></script>
		<script language="JavaScript">
		function show_posts()   
        {   
            $.ajax({   
                url: "/posts_export.php?style=&count=15&type=ajax_out&max_len=0",   
                cache: false,   
                success: function(html){   
                    $("#mw_container").html(html);   
                }   
            });   
        }   
       
        $(document).ready(function(){
            setInterval('show_posts()',30000);   
        });
		</script>
</head>
<body>
<b class="mw_header"><a href="http://widgets.maultalk.com/">MaulTalk.com</a> - Свежие посты</b>

<div class="mw_container" id="mw_container">
	<b class="update_field">Обновлено 2012-02-07 19:10:50 мск</b><p></p>
		<li class="mw_item_link">19:10 → <a href="http://www.maultalk.com/topic115335.html?view=getnewpost" target="_blank">Монетизация домена в зоне org.ua</a></li>
		<li class="mw_item_link">19:10 → <a href="http://www.maultalk.com/topic115319.html?view=getnewpost" target="_blank">Продам/Тиц10/Pr2/2000 страниц в индексе</a></li>
		<li class="mw_item_link">19:09 → <a href="http://www.maultalk.com/topic115344.html?view=getnewpost" target="_blank">Продам домен</a></li>
		<li class="mw_item_link">19:07 → <a href="http://www.maultalk.com/topic96668.html?view=getnewpost" target="_blank">Увеличу ваш доход в Sape.ru</a></li>
		<li class="mw_item_link">19:07 → <a href="http://www.maultalk.com/topic113679.html?view=getnewpost" target="_blank">Накрутка вконтакте(паблик, группы, лайки, опросы)</a></li>
	</div>
</body>
</html>

Эти коды приведены для тех, кто хочет кастомизировать виджеты и подстроить их под свой дизайн. Для тех, кто хоть немного знает HTML+CSS, это не будет проблемой. Благодаря подключению своего файла стилей Вы сможете значительно расширить возможности вывода данных и сделать виджеты удобными для ваших пользователей. После создания файла со стилями Вам необходимо поместить его на свой хост, а в код виджета (в параметр maultalk_posts_widget_style_url) вписать свой путь к файлу с расширением .css.

Примеры блогов с установленными виджетами Вы можете посмотреть в этом топике.