Cum Schimb Userinfopane?

[+Vlăduț Rădulescu]

Tot mai multe topicuri, aceleași răspunsuri. Ca să fie totul clar, o să vă arăt cum să schimbați detaliile de sub avatar într-un topic.

 

Acele detalii se încadrează în userInfoPane, iar ele pot fi modificate atât din Templates, cât și din CSS.

 

 

1. Intrați în Look & Feel > Tema d-voastră > Global Templates > userInfoPane

2. Ștergeți tot ce aveți acolo și introduceți următorul cod:

<div itemscope itemtype="http://schema.org/Person" class='user_details'>
<span class='hide' itemprop="name">{$author['members_display_name']}</span>
<ul class='basic_info'>
  <if test="membertitle:|:$author['member_title']">
   <p class='desc member_title'>{$author['member_title']}</p>
  </if>
  <if test="avatar:|:$author['member_id']">
   <li class='avatar'>
    <if test="canSeeProfiles:|:$this->memberData['g_is_supmod'] OR ( $this->memberData['g_mem_info'] && ! IPSMember::isInactive( $author ) )">
    <a itemprop="url" href="{parse url="showuser={$author['member_id']}" template="showuser" seotitle="{$author['members_seo_name']}" base="public"}" title="{$this->lang->words['view_profile']}: {$author['members_display_name']}" class='ipsUserPhotoLink'>
    </if>
    <if test="hasVariable:|:$this->settings['member_topic_avatar_max']">
     <img itemprop="image" src='{$author['pp_main_photo']}' class='ipsUserPhoto ipsUserPhoto_variable' />
    <else />
     <img itemprop="image" src='{$author['pp_thumb_photo']}' class='ipsUserPhoto ipsUserPhoto_large' />
    </if>
    <if test="canSeeProfiles2:|:$this->memberData['g_is_supmod'] OR ( $this->memberData['g_mem_info'] && ! IPSMember::isInactive( $author ) )">
    </a>
    </if>
   </li>
  <else />
   <li class='avatar'>
    <img itemprop="image" src='{$author['pp_thumb_photo']}' class='ipsUserPhoto ipsUserPhoto_large' />
   </li>
  </if>
  <li class='group_title'>
   {$author['_group_formatted']}
  </li>
  <if test="rankimage:|:$author['member_rank_img']">
   <li class='group_icon'>
   <if test="rankimageimage:|:$author['member_rank_img_i'] == 'img'">
    <img src='{$author['member_rank_img']}' alt='' />
   <else />
    {$author['member_rank_img']}
   </if>
   </li>
  </if>
<div class="extraUserInfo">
 
        <dl class="pairsJustified">
  <li class='post_count desc lighter'>
<dt>Mesaje:</dt>
   <dd>
   {parse expression="$this->registry->getClass('class_localization')->formatNumber( intval( $author['posts'] ) )"}</dd>
  </li>
        </dl>

<dl class="pairsJustified">
  <li class='post_count desc lighter'>
<dt>ID membru:</dt>
   <dd>
   {$author['member_id']}</dd>
  </li>
        </dl>


<dl class="pairsJustified">
  <li class='post_count desc lighter'>
<dt>Înregistrat</dt>
   <dd>
   {parse date="$author['joined']" format="joined"}</dd>
  </li>
        </dl>

<dl class="pairsJustified">
  <li class='post_count desc lighter'>
<dt>Reputaţie</dt>
   <dd>
   {$author['pp_reputation_points']}</dd>
  </li>
        </dl>


  <if test="authorcfields:|:$author['custom_fields'] != """><ul>
            <foreach loop="customFieldsOuter:$author['custom_fields'] as $group => $data">
                <foreach loop="customFields:$author['custom_fields'][ $group ] as $field">
                    <if test="$field != ''">
                        <li>
                            {$field}
                        </li>
                    </if>
                </foreach>
            </foreach></ul>
    </if>



<if test="authorwarn:|:$author['show_warn']">
            <li>
                <if test="$options['wl_id']">
                    <img src='{$this->settings['img_url']}/warn.png' class='clickable' onclick='warningPopup( this, {$options['wl_id']} )' title='{$this->lang->words['warnings_issued']}' />
                </if>
                <a class='desc lighter blend_links' href='{parse url="app=members&amp;module=profile&amp;section=warnings&amp;member={$author['member_id']}&amp;from_app={$this->request['app']}&amp;from_id1={$contentid}&amp;from_id2={$options['id2']}" base="public"}' id='warn_link_{$contentid}_{$author['member_id']}' title='{$this->lang->words['warn_view_history']}'>{parse expression="sprintf( $this->lang->words['warn_status'], $author['warn_level'] )"}</a>
            </li>
        </if>




</div>


</div>

3. Intrați în CSS > ipb_styles.css și introduceți la sfârșit următorul cod:

.extraUserInfo{
  font-size:11px;
  padding:4px 0px;
}

.pairsJustified {
margin: 2px 0 0;
font-size: 9px;
border-bottom: 1px dashed #000!important;
overflow: hidden;
line-height: 1.5;
}

.pairsJustified dt {
padding-right: 5px;
font-size: 11px!important;
float: left;
text-align: left;
max-width: 100%;
margin-right: 5px;
color: rgb(55, 134, 216);
}

.pairsJustified dd {
float: right;
font-size: 10px!important;
text-align: right;
max-width: 100%;
}

4*. Ca să vă apară și datele din Custom Profile Fields în userInfoPane, duceți-vă în Members > Custom Profile Fields și în Topic View Format introduceți asta:

<dl class="pairsJustified">
  <li class='post_count desc lighter'>
<dt>{title}</dt>
   <dd>{content}</dd>
  </li>

 

 

Nu este un tutorial făcut de mine în totalitate, codurile sunt luate chiar după forum. Acesta este doar un tip de userInfoPane, puteți să vi le personalizați și singuri după.

[REYES]

Foarte bun tutorialul. Ai putea sa faci un tutorial " Cum pui background la userInfoPane? "

[+leonardo23]

La punctul 4 nu prea am inteles,ce modific ,unde cum ... la ce....?

[+alehaNN]

On 5/6/2015 at 11:48 AM, Vlăduț Sandu said:

Tot mai multe topicuri, aceleași răspunsuri. Ca să fie totul clar, o să vă arăt cum să schimbați detaliile de sub avatar într-un topic.

 

Acele detalii se încadrează în userInfoPane, iar ele pot fi modificate atât din Templates, cât și din CSS.

 

 

1. Intrați în Look & Feel > Tema d-voastră > Global Templates > userInfoPane

2. Ștergeți tot ce aveți acolo și introduceți următorul cod:

 

 

Hidden Content

 

3. Intrați în CSS > ipb_styles.css și introduceți la sfârșit următorul cod:

 

 

Hidden Content

 

4*. Ca să vă apară și datele din Custom Profile Fields în userInfoPane, duceți-vă în Members > Custom Profile Fields și în Topic View Format introduceți asta:

 

 

Hidden Content

 

 

 

Nu este un tutorial făcut de mine în totalitate, codurile sunt luate chiar după forum. Acesta este doar un tip de userInfoPane, puteți să vi le personalizați și singuri după.

 

 

Un update la css ? va rog multumesc.