Бесплатный форум: форум поддержки
Добро пожаловать на форум поддержки сервиса Forum2x2 !

Для полноценной работы с форумом,
пожалуйста, войдите на форум под своим логином (если вы уже зарегистрированы) или же зарегистрируйтесь.


С нашей помощью вы можете создать форум,
похожий на этот!
Мы в социальных сетях

Правила форума

для обязательного прочтения!


Внимание! Важная информация для РЕГИСТРАЦИИ на форуме:

Пожалуйста, не регистрируйтесь на этом форуме с электронными адресами mail.ru, bk.ru, inbox.ru, list.ru - вам может не прийти письмо со ссылкой активации!
Вы можете воспользоваться адресами типа yandex.ru, rambler.ru, gmail.com и т.д.
Интересные решения
Быстрый переход к сервисам: j-p-g.net Видео фоторедактор Транслит

Статистика во вкладках

Предыдущая тема Следующая тема Перейти вниз

Статистика во вкладках

Сообщение автор Veneziana в Сб 19 Ноя - 12:56

При таком способе оформления статистики на тестовике попробовала убрать изображение слева (в Управлении картинками заменила прозрачной), но остался небольшой зазор.

Как сделать равномерные отступы, как, например, здесь??

И если вставлять свои кнопки, можно ли изменить их размер??
Еще хотелось бы убрать кнопку Чат, и вместо нее вставить Друзья форума, чтобы поместить в эту вкладку баннеры дружеских сайтов и форумов, но это уж совсем идеальном варианте.

Veneziana
Новичок

Женщина

Сообщения : 29
Регистрация : 2011-08-28
Благодарности : 0

Без предупреждений

http://simsomnia.forum2x2.ru

Вернуться к началу Перейти вниз

Re: Статистика во вкладках

Сообщение автор Dana Domirani в Сб 19 Ноя - 13:09

Есть вариант конкретно под Pun - но без 4-ой вкладки (чата) вообще.

Сейчас сделаю вариант с листом для партнерских баннеров...



Где находится CSS?
Па > Оформление > Цвета > Каскадная таблица стилей CSS


Где искать основные шаблоны?
ПА > Оформление > Шаблоны > Общие настройки


Где находится раздел для подключения скриптов
ПА > Модули > Управление кодами Javascript



Dana Domirani
Администратор
Администратор

Женщина

Сообщения : 22174
Возраст : 32
Регистрация : 2008-04-18
Благодарности : 8910

Без предупреждений

http://poltergeist-legacy.com/

Вернуться к началу Перейти вниз

Re: Статистика во вкладках

Сообщение автор Veneziana в Сб 19 Ноя - 13:14

Dana Domirani, была бы очень признательна!!

Veneziana
Новичок

Женщина

Сообщения : 29
Регистрация : 2011-08-28
Благодарности : 0

Без предупреждений

http://simsomnia.forum2x2.ru

Вернуться к началу Перейти вниз

Re: Статистика во вкладках

Сообщение автор Домовой в Сб 19 Ноя - 13:15

у меня на форуме с баннерами под пун. могу поделиться

Домовой
 

Мужчина

Сообщения : 6797
Возраст : 93
Регистрация : 2010-01-30
Благодарности : 3219

Без предупреждений

Вернуться к началу Перейти вниз

Re: Статистика во вкладках

Сообщение автор Veneziana в Сб 19 Ноя - 13:22

Домовой, давайте)) Так и Dana Domirani меньше работы будет.
И еще вопрос - можно ли сделать все кнопки разными?? То есть в этом варианте, как я поняла, надписи на кнопках сделаны не в графическом редакторе. А если мы сделаем каждую кнопку в фотошопе отдельно - Кто онлайн, Дни рождения, Статистика, Баннеры?? Их можно будет поставить??
И вот еще как убрать изображение отсюда??

Убираю через Управление картинками, но остается зазор.


Последний раз редактировалось: Veneziana (Сб 19 Ноя - 13:28), всего редактировалось 1 раз(а)

Veneziana
Новичок

Женщина

Сообщения : 29
Регистрация : 2011-08-28
Благодарности : 0

Без предупреждений

http://simsomnia.forum2x2.ru

Вернуться к началу Перейти вниз

Re: Статистика во вкладках

Сообщение автор Домовой в Сб 19 Ноя - 13:26

Вот пока с одинаковыми кнопками

Для [punBB]
Автор туториала Dana Domirani


Идём в ПА - Модули - HTML & JAVASCRIPT - Управление кодами Javascript
Создаём новый Javascript
Название * : Статистика
Расположение : В оглавлении
Код Javascript * :
Код:
$(function(){
              $("#pw2-button, #pw3-button, #pw4-button").css({
            'background-position' : 'center top', 'opacity' : '0.9'
        });
 $("#pw1-button").css({'background-position' : 'center -30px'});
                  $("#page-wrap div.button").click(function(){
                              $clicked = $(this);
                                        if ($clicked.css("opacity") != "1" && $clicked.is(":not(animated)")) {
                                    $clicked.animate({
                    opacity: 1, backgroundPosition: '0 -30px'
                  }, 700 );
                  var idToLoad = $clicked.attr("id").split('-');
                  $("#nwcontent").find(".list:visible").fadeOut(700, function(){
                    $(this).parent().find("#"+idToLoad[0]).fadeIn();
                  })
              }
              $clicked.siblings(".button").animate({
                  opacity: 0.9, backgroundPosition: '0 0'
              }, 700 );
            });
      });
Сохранить.

Далее идём в ПА - Оформление - Шаблоны - Общие настройки
Открываем шаблон index_body (Главная страница)
Находим фрагмент:

Код:
<!-- BEGIN disable_viewonline -->
<div id="pun-info" class="main">
   <div class="main-content">
      <div id="stats">
         <p class="right">{TOTAL_POSTS}</p>
         <p>{TOTAL_USERS}</p>
         <p>{NEWEST_USER}</p>
      </div>
      <div id="onlinelist">
         <img src="{L_ONLINE_IMG}" alt="{L_WHO_IS_ONLINE}" />
         <p class="right">
            <!-- BEGIN switch_viewonline_link -->
            <a href="{U_VIEWONLINE}" rel="nofollow">{L_WHO_IS_ONLINE}</a>
            <!-- END switch_viewonline_link -->
            <!-- BEGIN switch_viewonline_nolink -->
            {L_WHO_IS_ONLINE}
            <!-- END switch_viewonline_nolink -->
         </p>
         <p>{TOTAL_USERS_ONLINE}

         {RECORD_USERS}

         

         {LOGGED_IN_USER_LIST}

         {L_ONLINE_USERS}
         {L_CONNECTED_MEMBERS}

         {L_WHOSBIRTHDAY_TODAY}{L_WHOSBIRTHDAY_WEEK}</p>
         <div class="clear"></div>

         <p>{LEGEND} : {GROUP_LEGEND}</p>

      </div>
      <!-- BEGIN switch_chatbox_activate -->
      <div id="onlinechat">
         <p class="page-bottom">
         {TOTAL_CHATTERS_ONLINE} : 
         {CHATTERS_LIST}

         <!-- BEGIN switch_chatbox_popup -->
            <div id="chatbox_popup"></div>
            <script type="text/javascript">
               insertChatBoxPopup('{disable_viewonline.switch_chatbox_activate.switch_chatbox_popup.U_FRAME_CHATBOX}', '{L_CLICK_TO_JOIN_CHAT}');
            </script>
         <!-- END switch_chatbox_popup -->
         </p>
      </div>
      <!-- END switch_chatbox_activate -->
   </div>
</div>
<!-- END disable_viewonline -->
и заменяем его на следующее:

Код:
<!-- Статистика-->
    <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">
                    <span style="font-size:14px;"><b>Сколько человек на форуме?</b></span>
                    <hr />
                    <p>{TOTAL_USERS_ONLINE}</p>
                  <p>{RECORD_USERS}</p>
                    <p>{LOGGED_IN_USER_LIST}</p><p>{L_ONLINE_USERS}</p>{L_CONNECTED_MEMBERS}
<hr />
<p><a href="{U_VIEWONLINE}" rel="nofollow">{L_WHO_IS_ONLINE}</a></p>
              </div>

              <div id="pw2" class="list">
                  <span style="font-size:14px;"><b>Поздравляем с Днём Рождения!</b></span>
                  <hr />
                  {L_WHOSBIRTHDAY_TODAY}{L_WHOSBIRTHDAY_WEEK}
              </div>

              <div id="pw3" class="list">
                    <span style="font-size:14px;"><b>Статистика</b></span>
                    <hr />
                    <p>{TOTAL_POSTS}</p>
                    <p>{TOTAL_USERS}</p>
                    <p>{NEWEST_USER}</p>
                    <p>{LEGEND} : {GROUP_LEGEND}</p>
              </div>

              <div id="pw4" class="list">
                  <span style="font-size:14px;"><b>Баннеры друзей</b></span>
                  <hr />
<br/>
<center>
ЗДЕСЬ РАЗМЕЩАЕМ КОДЫ БАННЕРОВ
</center>

                    </div>
          </div>
</div>
<!-- Окончание статистики-->
Сохраняем и опубликовываем шаблон

Далее идём в ПА - Оформление - Картинки и цвета - Цвета - Каскадная таблица стилей CSS
и ставим код:

Код:
/*Статистика */
.button {
float: left;
cursor: pointer;
}

/* оформление всего блока с содержимым */
#nwcontent {
background-color: #FFFFF2; /* фон блока */
border: 1px solid #B38000; /* размер, стиль и цвет рамки блока */
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
-khtml-border-radius: 5px;
border-radius: 5px;
margin: 0 3px 3px;
padding: 5px;
min-height: 165px; /* минимальная высота блока. */
}

/* первый активный блок */
#pw1 {
display: block;
}

/* все скрытые блоки после первого */
#pw2, #pw3, #pw4 {
display: none;
}

/* общее оформление всех блоков */
#pw1, #pw2, #pw3, #pw4 {
padding: 3px;
text-align: left;
font-size: 12px; /* размер шрифта в поле статистики */
line-height: 19px;
}

#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://r28.imgfast.net/users/2814/33/31/58/album/ddn_nn11.png") center top no-repeat;
color: #210505; /* цвет шрифта на кнопках */
text-shadow: 1px 1px #8B4513; /* тень шрифта на кнопках */
font-size: 13px; /* размер шрифта на кнопках */
}

/* первая активная кнопка */
#pw1-button {
background: transparent url("http://r28.imgfast.net/users/2814/33/31/58/album/ddn_nn11.png") center -40px no-repeat;
margin-left: 15px;
}
Сохранить.

Попробую с разными кнопками.
Но только они будут не анимированными

Домовой
 

Мужчина

Сообщения : 6797
Возраст : 93
Регистрация : 2010-01-30
Благодарности : 3219

Без предупреждений

Вернуться к началу Перейти вниз

Re: Статистика во вкладках

Сообщение автор Veneziana в Сб 19 Ноя - 13:30

Попробую с разными кнопками.
Но только они будут не анимированными
Спасибо.
Анимация не обязательна, главное, чтобы можно было на каждый блок поставить свою кнопочку, и по возможности - размер кнопок можно было увеличить немного.

Veneziana
Новичок

Женщина

Сообщения : 29
Регистрация : 2011-08-28
Благодарности : 0

Без предупреждений

http://simsomnia.forum2x2.ru

Вернуться к началу Перейти вниз

Re: Статистика во вкладках

Сообщение автор Домовой в Сб 19 Ноя - 13:41

Вот вариант
http://test-063.forum777.com/

Там отдельными кнопками, текст написан прямо на кнопках.
Это пример, кнопки можно поставить свои, разные

Домовой
 

Мужчина

Сообщения : 6797
Возраст : 93
Регистрация : 2010-01-30
Благодарности : 3219

Без предупреждений

Вернуться к началу Перейти вниз

Re: Статистика во вкладках

Сообщение автор Veneziana в Сб 19 Ноя - 14:13

Домовой, отлично!!
Вы потом мне, как особо одаренной, подскажете еще, куда вставлять коды баннеров, чтобы они отображались в этой вкладке??

Veneziana
Новичок

Женщина

Сообщения : 29
Регистрация : 2011-08-28
Благодарности : 0

Без предупреждений

http://simsomnia.forum2x2.ru

Вернуться к началу Перейти вниз

Re: Статистика во вкладках

Сообщение автор Домовой в Сб 19 Ноя - 17:06

С разными кнопками

Идём в ПА - Модули - HTML & JAVASCRIPT - Управление кодами Javascript
Создаём новый Javascript
Название * : Статистика
Расположение : В оглавлении
Код Javascript * :
Код:
$(function(){
              $("#pw2-button, #pw3-button, #pw4-button").css({
            'background-position' : 'center top', 'opacity' : '0.9'
        });
 $("#pw1-button").css({'background-position' : 'center -30px'});
                  $("#page-wrap div.button").click(function(){
                              $clicked = $(this);
                                        if ($clicked.css("opacity") != "1" && $clicked.is(":not(animated)")) {
                                    $clicked.animate({
                    opacity: 1, backgroundPosition: '0 -30px'
                  }, 700 );
                  var idToLoad = $clicked.attr("id").split('-');
                  $("#nwcontent").find(".list:visible").fadeOut(700, function(){
                    $(this).parent().find("#"+idToLoad[0]).fadeIn();
                  })
              }
              $clicked.siblings(".button").animate({
                  opacity: 0.9, backgroundPosition: '0 0'
              }, 700 );
            });
      });
Сохранить.

Далее идём в ПА - Оформление - Шаблоны - Общие настройки
Открываем шаблон index_body (Главная страница)
Находим фрагмент:

Код:
<!-- BEGIN disable_viewonline -->
<div id="pun-info" class="main">
   <div class="main-content">
      <div id="stats">
         <p class="right">{TOTAL_POSTS}</p>
         <p>{TOTAL_USERS}</p>
         <p>{NEWEST_USER}</p>
      </div>
      <div id="onlinelist">
         <img src="{L_ONLINE_IMG}" alt="{L_WHO_IS_ONLINE}" />
         <p class="right">
            <!-- BEGIN switch_viewonline_link -->
            <a href="{U_VIEWONLINE}" rel="nofollow">{L_WHO_IS_ONLINE}</a>
            <!-- END switch_viewonline_link -->
            <!-- BEGIN switch_viewonline_nolink -->
            {L_WHO_IS_ONLINE}
            <!-- END switch_viewonline_nolink -->
         </p>
         <p>{TOTAL_USERS_ONLINE}

         {RECORD_USERS}

         

         {LOGGED_IN_USER_LIST}

         {L_ONLINE_USERS}
         {L_CONNECTED_MEMBERS}

         {L_WHOSBIRTHDAY_TODAY}{L_WHOSBIRTHDAY_WEEK}</p>
         <div class="clear"></div>

         <p>{LEGEND} : {GROUP_LEGEND}</p>

      </div>
      <!-- BEGIN switch_chatbox_activate -->
      <div id="onlinechat">
         <p class="page-bottom">
         {TOTAL_CHATTERS_ONLINE} : 
         {CHATTERS_LIST}

         <!-- BEGIN switch_chatbox_popup -->
            <div id="chatbox_popup"></div>
            <script type="text/javascript">
               insertChatBoxPopup('{disable_viewonline.switch_chatbox_activate.switch_chatbox_popup.U_FRAME_CHATBOX}', '{L_CLICK_TO_JOIN_CHAT}');
            </script>
         <!-- END switch_chatbox_popup -->
         </p>
      </div>
      <!-- END switch_chatbox_activate -->
   </div>
</div>
<!-- END disable_viewonline -->
и заменяем его на следующее:

Код:
<!-- Статистика-->
    <div id="page-wrap">
<div id="ttt">
          <div id="pw1-button"  class="button" title= "Кто на форуме"><img src="http://www.snapsnap.ru/i/2rrr.png"></div>
          <div id="pw2-button" class="button" title= "Кто отмечает день рождения"><img src="http://www.snapsnap.ru/i/2bjb.png"></div>
          <div id="pw3-button" class="button" title= "Статистика форума"><img src="http://www.snapsnap.ru/i/2zrz.png"></div>
          <div id="pw4-button" class="button" title= "Баннеры наших друзей"><img src="http://www.snapsnap.ru/i/2fvf.png"></div>
            </div>
          <div class="clear"></div>

          <div id="nwcontent">

              <div id="pw1" class="list">
                    <span style="font-size:14px;"><b>Сколько человек на форуме?</b></span>
                    <hr />
                    <p>{TOTAL_USERS_ONLINE}</p>
                  <p>{RECORD_USERS}</p>
                    <p>{LOGGED_IN_USER_LIST}</p><p>{L_ONLINE_USERS}</p>{L_CONNECTED_MEMBERS}
<hr />
<p><a href="{U_VIEWONLINE}" rel="nofollow">{L_WHO_IS_ONLINE}</a></p>
              </div>

              <div id="pw2" class="list">
                  <span style="font-size:14px;"><b>Поздравляем с Днём Рождения!</b></span>
                  <hr />
                  {L_WHOSBIRTHDAY_TODAY}{L_WHOSBIRTHDAY_WEEK}
              </div>

              <div id="pw3" class="list">
                    <span style="font-size:14px;"><b>Статистика</b></span>
                    <hr />
                    <p>{TOTAL_POSTS}</p>
                    <p>{TOTAL_USERS}</p>
                    <p>{NEWEST_USER}</p>
                    <p>{LEGEND} : {GROUP_LEGEND}</p>
              </div>

              <div id="pw4" class="list">
                  <span style="font-size:14px;"><b>Баннеры друзей</b></span>
                  <hr />
<br/>
<center>
ЗДЕСЬ РАЗМЕЩАЕМ КОДЫ БАННЕРОВ
</center>

                    </div>
          </div>
</div>
<!-- Окончание статистики-->
Сохраняем и опубликовываем шаблон

Далее идём в ПА - Оформление - Картинки и цвета - Цвета - Каскадная таблица стилей CSS
и ставим код:

Код:
/*Статистика */
.button {
float:left;
cursor:pointer;
}

#ttt{
margin-left:10px !important;
}

/* оформление всего блока с содержимым */
#nwcontent {
background-color:#FFFFF2;
border:1px solid #B38000;
-moz-border-radius:5px;
-webkit-border-radius:5px;
-khtml-border-radius:5px;
border-radius:5px;
min-height:165px;
margin:0 3px 3px;
padding:5px;
}

/* первый активный блок */
#pw1 {
display:block;
}

/* все скрытые блоки после первого */
#pw2,#pw3,#pw4 {
display:none;
}

/* общее оформление всех блоков */
#pw1,#pw2,#pw3,#pw4 {
text-align:left;
font-size:12px;
line-height:19px;
padding:3px;
}

#pw1-button, #pw2-button, #pw3-button, #pw4-button{
display:block;
width:150px;
height:30px;
margin:2px 2px 0 0;
}
Сохранить.
А коды баннеров ставятся в фрагмент
<center>
ЗДЕСЬ РАЗМЕЩАЕМ КОДЫ БАННЕРОВ
</center>
который находится в коде который ставится в шаблон.
Коды ставить вместо выделенного текста

Домовой
 

Мужчина

Сообщения : 6797
Возраст : 93
Регистрация : 2010-01-30
Благодарности : 3219

Без предупреждений

Вернуться к началу Перейти вниз

Re: Статистика во вкладках

Сообщение автор Veneziana в Сб 19 Ноя - 22:24

Домовой, огромное спасибо, все именно так, как нужно!!
Оформление замечательное, кнопки - чудо!!

Veneziana
Новичок

Женщина

Сообщения : 29
Регистрация : 2011-08-28
Благодарности : 0

Без предупреждений

http://simsomnia.forum2x2.ru

Вернуться к началу Перейти вниз

Предыдущая тема Следующая тема Вернуться к началу


 
Права доступа к этому форуму:
Вы не можете отвечать на сообщения