Новый вид профиля на форуме.

[BanZay]

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


Как его осуществить на форуме?

 

[Hope]

Прикольненько смотрится. :) Но как такое осуществить - я не имею понятия. :(

 

[BanZay]

Вот жаль( Зря лепил(
Хотя у меня просят PSD файл. Говорят на ДЛИ установить прощу простого, так как на IPB. А с ксюхой запара([DOUBLEPOST=1371385966][/DOUBLEPOST]А такой вид прям в профиле можно?

 

[OlegT]

визуальную часть осуществить не так сложно средствами CSS, надо только стили правильно прописать, а вот функциональную часть типа -+ карма, это отдельно надо какими-то плагинами добивать.

Посмотрите в свойствах стилей на странице, какими классами и идентификаторами отображаются блоки в профиле, их и раскрашивайте как угодно.

 

[BanZay]

Если честно я не силён в CSS

 

[OlegT]

Вот посмотрите итоговый код на этом сайте.

<div class="extraUserInfo">                                                                                         
  <dl class="pairsInline">                 
    <dt>Сообщения: </dt>                 
    <dd><a href="search/member?user_id=311" class="concealed">104</a></dd>
  </dl>                                                               
  <dl class="pairsInline">                 
    <dt>Симпатии: </dt>                 
    <dd>26</dd>             
  </dl>                                                               
  <dl class="pairsInline">                 
    <dt>Баллы: </dt>                 
    <dd><a href="members/fox-man.311/trophies" class="OverlayTrigger concealed">30</a></dd>             
  </dl>                                                           
  <dl class="pairsInline">                 
    <dt>Пол: </dt>                 
    <dd itemprop="gender">Женский</dd>             
  </dl>                                                                                                 
  <dl class="pairsInline">                 
    <dt>Адрес: </dt>                 
    <dd><a href="misc/location-info?location=Multi-Cheats.com" target="_blank" rel="nofollow" itemprop="address" class="concealed">Multi-Cheats.com</a></dd>              </dl>                                                                                                               
</div>

По сути, осталось применить стили CSS поиграв немного с дочерними элементами, сестринскими и прочими хитрыми свойствами CSS.

У Вас недостаточно прав для просмотра ссылок. Вход или Регистрация

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

Поэкспериментируйте немного, посмотрите разные примеры. Потом можете закинуть графический файл в элементы оформления, а настроенные стили в ekstra.css, и все будет так, как вы нарисовали в фотошопе.