[Фича] Закладки информации по блокам

[kphp]

Данный модуль очень редкий сейчас такого не найти в сети автора я хз ище из тем 7588 кто помнит конечно 

Приступим к установке:

1)Заходим в profile.tpl и в самый вверх вставляем

Спойлер

<script>
$(document).ready(function() {
        $("#content_profile div").hide(); // Скрываем содержание
        $("#tabs li:first").attr("id","current"); // Активируем первую закладку
        $("#content_profile div:first").fadeIn(); // Выводим содержание
    
    $('#tabs a').click(function(e) {
        e.preventDefault();        
        $("#content_profile div").hide(); //Скрыть все сожержание
        $("#tabs li").attr("id",""); //Сброс ID
        $(this).parent().attr("id","current"); // Активируем закладку
        $('#' + $(this).attr('title')).fadeIn(); // Выводим содержание текущей закладки
    });
})();
</script>

 

2)Далее находим

Спойлер

[not-all-country]<div class="flpodtext">Страна:</div> <div class="flpodinfo" style="color:#808080"><a href="/?go=search&country={country-id}" onClick="Page.Go(this.href); return false">{country}</a></div>[/not-all-country]
[not-all-city]<div class="flpodtext">Город:</div> <div class="flpodinfo" style="color:#808080"><a href="/?go=search&country={country-id}&city={city-id}" onClick="Page.Go(this.href); return false">{city}</a></div>[/not-all-city]
[blacklist][not-all-birthday]<div class="flpodtext">Дата рождения:</div> <div class="flpodinfo" style="color:#808080">{birth-day}</div>[/not-all-birthday]
[privacy-info][sp]<div class="flpodtext">Семейное положение:</div> <div class="flpodinfo" style="color:#808080">{sp}</div>[/sp][/privacy-info]

<div class="clear"></div>
<div class="flpodtext"></div>

<div class="cursor_pointer" onClick="Profile.MoreInfo(); return false" id="moreInfoLnk"><div style="margin-top:1px;" class="public_wall_all_comm profile_hide_opne" id="moreInfoText">Показать подробную информацию</div></div>

<div id="moreInfo" class="no_display">
[privacy-info][not-block-contact]<div class="fieldset"><div class="w2_a" [owner]style="width:230px;"[/owner]>Контактная информация [owner]<span><a href="/editmypage/contact" onClick="Page.Go(this.href); return false;">редактировать</a></span>[/owner]</div></div>
[not-contact-phone]<div class="flpodtext">Моб. телефон:</div> <div class="flpodinfo" style="color:#808080">{phone}</div>[/not-contact-phone]
[not-contact-vk]<div class="flpodtext">ВКонтакте:</div> <div class="flpodinfo">{vk}</div>[/not-contact-vk]
[not-contact-od]<div class="flpodtext">Одноклассники:</div> <div class="flpodinfo">{od}</div>[/not-contact-od]
[not-contact-fb]<div class="flpodtext">FaceBook:</div> <div class="flpodinfo">{fb}</div>[/not-contact-fb]
[not-contact-skype]<div class="flpodtext">Skype:</div> <div class="flpodinfo"><a href="skype:{skype}">{skype}</a></div>[/not-contact-skype]
[not-contact-icq]<div class="flpodtext">ICQ:</div> <div class="flpodinfo">{icq}</div>[/not-contact-icq]
[not-contact-site]<div class="flpodtext">Веб-сайт:</div> <div class="flpodinfo">{site}</div>[/not-contact-site][/not-block-contact]
<div class="fieldset"><div class="w2_b" [owner]style="width:200px;"[/owner]>Личная информация [owner]<span><a href="/editmypage/interests" onClick="Page.Go(this.href); return false;">редактировать</a></span>[/owner]</div></div>{not-block-info}
[not-info-activity]<div class="flpodtext">Деятельность:</div> <div class="flpodinfo">{activity}</div>[/not-info-activity]
[not-info-interests]<div class="flpodtext">Интересы:</div> <div class="flpodinfo">{interests}</div>[/not-info-interests]
[not-info-music]<div class="flpodtext">Любимая музыка:</div> <div class="flpodinfo">{music}</div>[/not-info-music]
[not-info-kino]<div class="flpodtext">Любимые фильмы:</div> <div class="flpodinfo">{kino}</div>[/not-info-kino]
[not-info-books]<div class="flpodtext">Любимые книги:</div> <div class="flpodinfo">{books}</div>[/not-info-books]
[not-info-games]<div class="flpodtext">Любимые игры:</div> <div class="flpodinfo">{games}</div>[/not-info-games]
[not-info-quote]<div class="flpodtext">Любимые цитаты:</div> <div class="flpodinfo">{quote}</div>[/not-info-quote]
[not-info-myinfo]<div class="flpodtext">О себе:</div> <div class="flpodinfo">{myinfo}</div>[/not-info-myinfo][/privacy-info]

 

3)И заменяем на

Спойлер

<ul id="tabs">
    <li><a href="#" title="tab1">Основное</a></li>
    <li><a href="#" title="tab2" >Контакты</a></li>
    <li><a href="#" title="tab3">Личная информация</a></li>
</ul>

<div id="content_profile">
    <div id="tab1">
[not-all-country]<p class="flpodtext">Страна:</p> <p class="flpodinfo" style="color:#808080"><a href="/?go=search&country={country-id}" onClick="Page.Go(this.href); return false">{country}</a></p>[/not-all-country]
[not-all-city]<p class="flpodtext">Город:</p> <p class="flpodinfo" style="color:#808080"><a href="/?go=search&country={country-id}&city={city-id}" onClick="Page.Go(this.href); return false">{city}</a></p>[/not-all-city]
[blacklist][not-all-birthday]<p class="flpodtext">Дата рождения:</p> <p class="flpodinfo" style="color:#808080">{birth-day}</p>[/not-all-birthday]
[privacy-info][sp]<p class="flpodtext">Семейное положение:</p> <p class="flpodinfo" style="color:#808080">{sp}</p>[/sp][/privacy-info]
</div>
<div id="tab2">
[not-contact-phone]<p class="flpodtext">Моб. телефон:</p> <p class="flpodinfo" style="color:#808080">{phone}</p>[/not-contact-phone]
[not-contact-vk]<p class="flpodtext">ВКонтакте:</p> <p class="flpodinfo">{vk}</p>[/not-contact-vk]
[not-contact-od]<p class="flpodtext">Одноклассники:</p> <p class="flpodinfo">{od}</p>[/not-contact-od]
[not-contact-fb]<p class="flpodtext">FaceBook:</p> <p class="flpodinfo">{fb}</p>[/not-contact-fb]
[not-contact-skype]<p class="flpodtext">Skype:</p> <p class="flpodinfo"><a href="skype:{skype}">{skype}</a></p>[/not-contact-skype]
[not-contact-icq]<p class="flpodtext">ICQ:</p> <p class="flpodinfo">{icq}</p>[/not-contact-icq]
[not-contact-site]<p class="flpodtext">Веб-сайт:</p> <p class="flpodinfo">{site}</p>[/not-contact-site]
</div>
<div id="tab3">
[not-info-activity]<p class="flpodtext">Деятельность:</p> <p class="flpodinfo">{activity}</p>[/not-info-activity]
[not-info-interests]<p class="flpodtext">Интересы:</p> <p class="flpodinfo">{interests}</p>[/not-info-interests]
[not-info-music]<p class="flpodtext">Любимая музыка:</p> <p class="flpodinfo">{music}</p>[/not-info-music]
[not-info-kino]<p class="flpodtext">Любимые фильмы:</p> <p class="flpodinfo">{kino}</p>[/not-info-kino]
[not-info-books]<p class="flpodtext">Любимые книги:</p> <p class="flpodinfo">{books}</p>[/not-info-books]
[not-info-games]<p class="flpodtext">Любимые игры:</p> <p class="flpodinfo">{games}</p>[/not-info-games]
[not-info-quote]<p class="flpodtext">Любимые цитаты:</p> <p class="flpodinfo">{quote}</p>[/not-info-quote]
</div></div>

 

4)(обязательно)В style.css вставляем

Спойлер

#tabs{
  overflow: hidden;
  width: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
}

#tabs li{
  float: left;
  margin: 0 .5em 0 0;
}

#tabs a{
  position: relative;
  background: #ddd;
  background-image: linear-gradient(to bottom, #fff, #ddd);
  padding: .7em 3.5em;
  float: left;
  text-decoration: none;
  color: #444;
  text-shadow: 0 1px 0 rgba(255,255,255,.8);
  border-radius: 5px 5px 0 0;
  box-shadow: 0 2px 2px rgba(0,0,0,.4);
}

#tabs a:hover,
#tabs a:hover::after,
#tabs a:focus,
#tabs a:focus::after{
  background: #f6f7f8;
}

#tabs a:focus{
  outline: 0;
}



#tabs #current a,
#tabs #current a::after{
  background: #f6f7f8;
  z-index: 3;border:1px solid #dfdfdf;
}

#content_profile
{
    background: #fff;
    padding: 10px;
    height: 100%;
    position: relative;
   border:1px solid #dfdfdf;
    border-radius: 0 5px 5px 5px;
    box-shadow: 0 -2px 3px -2px rgba(0, 0, 0, .5);
}

 

Но при этом придется пожертвовать ссылкой на профиль, то есть при входе на старницу профиля страница будет обновляться,а не работать на аяксе. Для этого заходим в main.tpl и находим

5)<a href="{my-page-link}" onmouseover="shows();" onmouseout="hides();" onclick="Page.Go(this.href);hides(); return false;" id="myhome">

И удаляем

6)onmouseout="hides();"

7)Вот и все. Ничего страшного в том что одна страница будет грузиться без аякса.

😎 Стили подгоняйте под себя.

 

Закладки информации по блокам.zip

 

Изменено 18 февраля, 2022 пользователем kphp

[NaFanyA]

А скриншоты есть какие-то?

[kphp]

Только что, NaFanyA сказал:

А скриншоты есть какие-то?

нету я сам его не ставил

[kphp]

11 минут назад, NaFanyA сказал:

А скриншоты есть какие-то?

подправлю тему сейчас

Изменено 18 февраля, 2022 пользователем kphp