Важная информация!
Правила форума
для обязательного прочтения!
Пожалуйста, не регистрируйтесь на этом форуме с электронными адресами mail.ru, bk.ru, inbox.ru, list.ru - вам может не прийти письмо со ссылкой активации!
Вы можете воспользоваться адресами типа yandex.ru, rambler.ru, gmail.com и т.д.
(забыл / потерял пароль)
Общий FAQ по управлению форумом
FAQ: реклама на форуме
Туториалы по разным функциям ваших форумов
Алфавитный указатель
Интересные решения для форумов
Наши видео-туториалы
Условия пользования сервисом
Ссылки на полезные ресурсы
Последние темы
» Помогите, где можно изменить цвет этой менюшкиавтор Vice_Land Вчера в 19:41
» Форум плохо грузится
автор VENEFICA. Вчера в 19:06
» [Общая тема] Что делать, если вы забыли / потеряли пароль
автор LiptonTea Вчера в 10:36
» как настроить автоматическое закрепление первого сообщения в теме?
автор Форум Г. Декабрь 10th 2024, 19:08
» совет админам
автор Форум Г. Декабрь 9th 2024, 12:24
» Не могу поменять местами виджеты форума.
автор Форум Г. Декабрь 9th 2024, 12:19
» Пропала функция редактировать сообщение
автор VENEFICA. Декабрь 6th 2024, 07:12
» Не корректное отображение картинок
автор Luz Декабрь 5th 2024, 19:19
» ВПН
автор Luz Декабрь 5th 2024, 19:17
» Дублируется ссылка на форум в боковом меню
автор Luz Декабрь 5th 2024, 19:14
как таким образом оформить статистику?
Участников: 5
Бесплатный форум: форум поддержки :: Взаимопомощь и Поддержка :: Оформление вашего форума :: [Архив] Оформление форума
Страница 1 из 1
как таким образом оформить статистику?
Добрый день, уважаемые "волшебники"! :cveti:
Может Вы мне поможете? Я увидела на сайте Dana Domirani безумно стильную статистику форума. Очень хочется так оформить и свою(плавный переход от "Кто онлайн" к "Дни рождения", "Статистика" и "Чат") - http://www.poltergeist-legacy.com/forum
И ещё, как туда поместить чат?
Большое спасибо!
Может Вы мне поможете? Я увидела на сайте Dana Domirani безумно стильную статистику форума. Очень хочется так оформить и свою(плавный переход от "Кто онлайн" к "Дни рождения", "Статистика" и "Чат") - http://www.poltergeist-legacy.com/forum
И ещё, как туда поместить чат?
Большое спасибо!
Re: как таким образом оформить статистику?
Можно сделать на BB2 и Pun.
Где находится CSS? Па > Оформление > Цвета > Каскадная таблица стилей CSS Где искать основные шаблоны? ПА > Оформление > Шаблоны > Общие настройки Где находится раздел для подключения скриптов ПА > Модули > Управление кодами Javascript |
Re: как таким образом оформить статистику?
у меня как раз phpBB2. как я могу это оформить?
так ведь у Вас на форуме внизу есть кнопочка "чат" ...
так ведь у Вас на форуме внизу есть кнопочка "чат" ...
Re: как таким образом оформить статистику?
Выглядит шикарно! и очень подходит к моему форуму) будем ждать.
Re: как таким образом оформить статистику?
1. Включите внизу на странице чат: ПА > Модули > ЧАТ - Конфигурация > Показ ЧАТа: на главной стр. внизу
2. Откройте ПА > Оформление > Общие настройки - шаблон index_body (Главная страница) и замените фрагмент
3. Откройте ПА > Модули > Управление кодами Javascript — создать новый Javascript
В поле "Название" вбейте, например, Статистика во вкладках
В поле "Код" скопируйте:
4. В ПА > Оформление > Цвета — Каскадная таблица стилей CSS добавьте настройки для новой статистики:
Ссылка https://i.servimg.com/u/f44/16/54/26/99/snap0011.png — это фоновое изображение всех кнопок:
Замените его на свое.
Фон должен состоять из двух одинаковых по высоте половинок: верхняя — для дезактивированных кнопок, нижняя — для активированных.
2. Откройте ПА > Оформление > Общие настройки - шаблон index_body (Главная страница) и замените фрагмент
- Код:
<!-- BEGIN disable_viewonline -->
<table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0">
<tr>
<td class="catHead" colspan="2" height="28">
<!-- BEGIN switch_viewonline_link -->
<span class="cattitle"><a class="cattitle" href="{U_VIEWONLINE}" rel="nofollow">{L_WHO_IS_ONLINE}</a></span>
<!-- END switch_viewonline_link -->
<!-- BEGIN switch_viewonline_nolink -->
<span class="cattitle">{L_WHO_IS_ONLINE}</span>
<!-- END switch_viewonline_nolink -->
</td>
</tr>
<tr>
<td class="row1" rowspan="6" align="center" valign="middle"><img src="{L_ONLINE_IMG}" id="i_whosonline" alt="{L_WHO_IS_ONLINE}" /></td>
<td class="row1" width="100%"><span class="gensmall">{TOTAL_POSTS}<br />
{TOTAL_USERS}<br />
{NEWEST_USER}</span></td>
</tr>
<tr>
<td class="row1"><span class="gensmall">{TOTAL_USERS_ONLINE}<br />
{RECORD_USERS}<br />
<br />
{LOGGED_IN_USER_LIST}</span></td>
</tr>
{L_CONNECTED_MEMBERS}
{L_WHOSBIRTHDAY_TODAY}
{L_WHOSBIRTHDAY_WEEK}
<tr>
<td class="row1"><span class="gensmall">{LEGEND} : {GROUP_LEGEND}</span></td>
</tr>
<!-- BEGIN switch_chatbox_activate -->
<tr>
<td class="row1">
<span class="gensmall">{TOTAL_CHATTERS_ONLINE} : {CHATTERS_LIST}<br />
<!-- BEGIN switch_chatbox_popup -->
<div id="chatbox_popup"></div>
<script type="text/javascript">
//<![CDATA[
insertChatBoxPopup('{disable_viewonline.switch_chatbox_activate.switch_chatbox_popup.U_FRAME_CHATBOX}', '{L_CLICK_TO_JOIN_CHAT}');
//]]>
</script>
<!-- END switch_chatbox_popup -->
</span>
</td>
</tr>
<!-- END switch_chatbox_activate -->
</table>
<!-- END disable_viewonline -->
{CHATBOX_BOTTOM}
- Код:
<table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0">
<td class="catHead" colspan="2" height="28">
<span class="cattitle"> Статистика нашего форума</span>
</td>
<tr>
<td class="row1" rowspan="6" align="center" valign="middle"><img src="{L_ONLINE_IMG}" id="i_whosonline" alt="{L_WHO_IS_ONLINE}" /></td>
<td>
<div id="page-wrap">
<div id="pw1-button" class="button">Кто онлайн</div>
<div id="pw2-button" class="button">Дни Рождения</div>
<div id="pw3-button" class="button">Статистика</div>
<div id="pw4-button" class="button">Чат</div>
<div class="clear"></div>
<div id="nwcontent">
<div id="pw1" class="list">
<b>Сколько юзеров на форуме?</b>
<hr />
<p>{TOTAL_USERS_ONLINE}</p>
<p>{RECORD_USERS}</p>
<p>{LOGGED_IN_USER_LIST}</p><p>{L_ONLINE_USERS}</p><table>{L_CONNECTED_MEMBERS}</table>
</div>
<div id="pw2" class="list">
<b>Поздравляем с ДР!</b>
<hr />
<table>{L_WHOSBIRTHDAY_TODAY}{L_WHOSBIRTHDAY_WEEK}</table>
</div>
<div id="pw3" class="list">
<b>Статистика</b>
<hr />
<p>{TOTAL_POSTS}</p>
<p>{TOTAL_USERS}</p>
<p>{NEWEST_USER}</p>
<p>{LEGEND} : {GROUP_LEGEND}</p>
</div>
<div id="pw4" class="list">
<b>Общение онлайн</b>
<hr />
{CHATBOX_BOTTOM}
<p>[ <a href="/chatbox/index.forum?" target="_blank">Открыть чат на отдельной странице</a> ]</p>
<p>Если кнопка "Войти в ЧАТ" не видна, авторизируйтесь на форуме ;) </p>
</div>
</div>
</div>
</td>
</tr>
</table>
3. Откройте ПА > Модули > Управление кодами Javascript — создать новый Javascript
В поле "Название" вбейте, например, Статистика во вкладках
В поле "Код" скопируйте:
- Код:
jQuery(document).ready(function(){
$("#pw2-button, #pw3-button, #pw4-button").css("opacity", "0.95").addClass("dez");
$("#pw1-button").addClass("aktv");
$("#page-wrap div.button").click(function(){
$clicked = $(this);
if ($clicked.css("opacity") != "1" && $clicked.is(":not(animated)")) {
$clicked.animate({
opacity: 1}, 60 ).removeClass("dez").addClass("aktv");
var idToLoad = $clicked.attr("id").split('-');
$("#nwcontent").find(".list:visible").fadeOut(60, function(){
$(this).parent().find("#"+idToLoad[0]).fadeIn();
})
}
$clicked.siblings(".button").animate({
opacity: 0.95}, 60 ).removeClass("aktv").addClass("dez");
});
});
4. В ПА > Оформление > Цвета — Каскадная таблица стилей CSS добавьте настройки для новой статистики:
- Код:
#page-wrap td.row1 {
background-color: transparent;
padding: 0;
margin: 0;
}
.button {
float: left;
cursor: pointer;
}
/* оформление всего блока с содержимым */
#nwcontent {
background-color: #F5FFFA;
border: 1px solid #DDF7C6;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
-khtml-border-radius: 5px;
border-radius: 5px;
margin: 0 3px 3px;
padding: 5px;
min-height: 150px !important; /* минимальная высота блока */
}
/* первый активный блок */
#pw1 {
display: block;
}
/* все скрытые блоки после первого */
#pw2, #pw3, #pw4 {
display: none;
}
/* общее оформление всех блоков */
#pw1, #pw2, #pw3, #pw4 {
padding: 3px;
text-align: left;
font-size: 10px;
min-height: 140px !important; /* минимальная высота содержимого блока */
}
#pw1 a:hover, #pw2 a:hover, #pw3 a:hover, #pw4 a:hover {
text-decoration: none !important;
}
/* общее оформление всех кнопок */
#pw1-button, #pw2-button, #pw3-button, #pw4-button {
display: block;
width: 150px;
height: 30px;
margin: 2px 2px 0 0;
text-align: center;
line-height: 30px;
background: transparent url("http://i44.servimg.com/u/f44/16/54/26/99/snap0011.png") no-repeat; /* изображение кнопок */
color: #fff;
text-shadow: 1px 1px #688E23;
font-size: 13px;
font-weight: bolder;
}
/* первая активная кнопка */
#pw1-button {
margin-left: 15px;
}
/* стиль дезактивированной кнопки - показана только верхняя половина ее фона */
.dez {
background-position: 50% 0% !important;
}
/* стиль активированной кнопки - показана только нижняя половина ее фона */
.aktv {
background-position: 50% 100% !important;
}
Ссылка https://i.servimg.com/u/f44/16/54/26/99/snap0011.png — это фоновое изображение всех кнопок:
Замените его на свое.
Фон должен состоять из двух одинаковых по высоте половинок: верхняя — для дезактивированных кнопок, нижняя — для активированных.
Re: как таким образом оформить статистику?
всё заработало! Как я могу Вас отблагодарить? Вы просто чудооо!!!
Re: как таким образом оформить статистику?
Пожалуйста! Рада, что идея понравилась.
Где находится CSS? Па > Оформление > Цвета > Каскадная таблица стилей CSS Где искать основные шаблоны? ПА > Оформление > Шаблоны > Общие настройки Где находится раздел для подключения скриптов ПА > Модули > Управление кодами Javascript |
Re: как таким образом оформить статистику?
Дана а на punBB тоже самое или по другому?
Домовой-
-
Сообщения : 6801
Возраст : 101
Регистрация : 2010-01-30
Благодарности : 3243
Re: как таким образом оформить статистику?
Да, почти то же. Только отсюда
Настройки для
Ну и общую обвертку в таблицу можно убрать, оставить только дивы.
- Код:
<table>{L_WHOSBIRTHDAY_TODAY}{L_WHOSBIRTHDAY_WEEK}</table>
...
<table>{L_CONNECTED_MEMBERS}</table>
Настройки для
- Код:
#page-wrap td.row1 {
background-color: transparent;
padding: 0;
margin: 0;
}
Ну и общую обвертку в таблицу можно убрать, оставить только дивы.
Где находится CSS? Па > Оформление > Цвета > Каскадная таблица стилей CSS Где искать основные шаблоны? ПА > Оформление > Шаблоны > Общие настройки Где находится раздел для подключения скриптов ПА > Модули > Управление кодами Javascript |
Re: как таким образом оформить статистику?
Понял, спасибо, разобрался.
Домовой-
-
Сообщения : 6801
Возраст : 101
Регистрация : 2010-01-30
Благодарности : 3243
Re: как таким образом оформить статистику?
Не за что ;)
Где находится CSS? Па > Оформление > Цвета > Каскадная таблица стилей CSS Где искать основные шаблоны? ПА > Оформление > Шаблоны > Общие настройки Где находится раздел для подключения скриптов ПА > Модули > Управление кодами Javascript |
Похожие темы
» Как таким образом закруглить заголовки ?
» Здравствуйте! Скажите пожалуйста, можно ли обработать вот таким образом цитаты и профиль?
» Как сделать личный профиль пользователей таким?
» Каким образом избавиться от старого форума?
» каким образом можно добиться чтобы надпись "Главный Форум" не так сильно утыкалось в окантовку края форума?
» Здравствуйте! Скажите пожалуйста, можно ли обработать вот таким образом цитаты и профиль?
» Как сделать личный профиль пользователей таким?
» Каким образом избавиться от старого форума?
» каким образом можно добиться чтобы надпись "Главный Форум" не так сильно утыкалось в окантовку края форума?
Бесплатный форум: форум поддержки :: Взаимопомощь и Поддержка :: Оформление вашего форума :: [Архив] Оформление форума
Страница 1 из 1
Права доступа к этому форуму:
Вы не можете отвечать на сообщения