قالب معلومات العضو مميز xenforo

f 35

:: عضو جديد ::
إنضم
8 مايو 2013
الرسائل
44
الإعجابات
10
العمر
33
#1
السلام عليكم ورحمة الله وبركاتة

مرحبا بالجميع , واتمنى ان الكل بخير وصحة وعافية

اليوم لدي قالب مميز لمعلومات العضو وحبيت ان اشارك به الجميع وهو للاخ احمد حصلت علية وحبيت ان اطرحه للجميع للفائدة ...وعسى الله ان يكتب اجره للاخ احمد .........


message_user_info
HTML:
<xen:require css="message_user_info.css" />

<div class="messageUserInfo" itemscope="itemscope" itemtype="http://data-vocabulary.org/Person">  
<div class="messageUserBlock">
    <xen:hook name="message_user_info_avatar" params="{xen:array 'user={$user}', 'isQuickReply={$isQuickReply}'}">
        <div class="avatarHolder">
            <span class="helper"></span>
            <xen:avatar user="$user" size="l" img="true" />
            <!-- slot: message_user_info_avatar -->
        </div>
    </xen:hook>

<xen:if is="!{$isQuickReply}">
    <xen:hook name="message_user_info_text" params="{xen:array 'user={$user}', 'isQuickReply={$isQuickReply}'}">
        <h3 class="userText">
            <xen:username user="$user" itemprop="name" rich="true" />
            <xen:if hascontent="true"><em class="userTitle" itemprop="title"><xen:contentcheck>{xen:helper userTitle, $user, 1, 1}</xen:contentcheck></em></xen:if>
            {xen:helper userBanner, $user, 'wrapped'}
            <!-- slot: message_user_info_text -->
        </h3>
    </xen:hook>
      
    <xen:if hascontent="true">
        <div class="extraUserInfo">
            <xen:contentcheck>
            <xen:hook name="message_user_info_extra" params="{xen:array 'user={$user}', 'isQuickReply={$isQuickReply}'}">
                <xen:if is="@messageShowRegisterDate AND {$user.user_id}">
                    <dl class="pairsJustified">
                        <dt>{xen:phrase joined}:</dt>
                        <dd>{xen:date $user.register_date}</dd>
                    </dl>
                </xen:if>
              
                <xen:if is="@messageShowMessageCount AND {$user.user_id}">
                    <dl class="pairsJustified">
                        <dt>{xen:phrase messages}:</dt>
                        <dd><a href="{xen:link search/member, '', 'user_id={$user.user_id}'}" class="concealed" rel="nofollow">{xen:number $user.message_count}</a></dd>
                    </dl>
                </xen:if>
              
                <xen:if is="@messageShowTotalLikes AND {$user.user_id}">
                    <dl class="pairsJustified">
                        <dt>{xen:phrase likes_received}:</dt>
                        <dd>{xen:number $user.like_count}</dd>
                    </dl>
                </xen:if>
              
                <xen:if is="@messageShowTrophyPoints AND {$user.user_id}">
                    <dl class="pairsJustified">
                        <dt>{xen:phrase trophy_points}:</dt>
                        <dd><a href="{xen:link 'members/trophies', $user}" class="OverlayTrigger concealed">{xen:number $user.trophy_points}</a></dd>
                    </dl>
                </xen:if>
          
                <xen:if is="@messageShowGender AND {$user.gender}">
                    <dl class="pairsJustified">
                        <dt>{xen:phrase gender}:</dt>
                        <dd itemprop="gender"><xen:if is="{$user.gender} == 'male'">{xen:phrase male}<xen:else />{xen:phrase female}</xen:if></dd>
                    </dl>
                </xen:if>
              
                <xen:if is="@messageShowOccupation AND {$user.occupation}">
                    <dl class="pairsJustified">
                        <dt>{xen:phrase occupation}:</dt>
                        <dd itemprop="role">{xen:string censor, $user.occupation}</dd>
                    </dl>
                </xen:if>
              
                <xen:if is="@messageShowLocation AND {$user.location}">
                    <dl class="pairsJustified">
                        <dt>{xen:phrase location}:</dt>
                        <dd><a href="{xen:link 'misc/location-info', '', 'location={xen:string censor, $user.location, '-'}'}" target="_blank" rel="nofollow" itemprop="address" class="concealed">{xen:string censor, $user.location}</a></dd>
                    </dl>
                </xen:if>
          
                <xen:if is="@messageShowHomepage AND {$user.homepage}">
                    <dl class="pairsJustified">
                        <dt>{xen:phrase home_page}:</dt>
                        <dd><a href="{xen:string censor, $user.homepage, '-'}" rel="nofollow" target="_blank" itemprop="url">{xen:string censor, $user.homepage}</a></dd>
                    </dl>
                </xen:if>
                          
            </xen:hook>          
            <xen:if is="@messageShowCustomFields AND {$user.customFields}">
            <xen:hook name="message_user_info_custom_fields" params="{xen:array 'user={$user}', 'isQuickReply={$isQuickReply}'}">
          
                <xen:foreach loop="$userFieldsInfo" key="$fieldId" value="$fieldInfo">
                    <xen:if is="{$fieldInfo.viewable_message}">
                        <xen:if hascontent="true">
                            <dl class="pairsJustified userField_{$fieldId}">
                                <dt>{xen:helper userFieldTitle, $fieldId}:</dt>
                                <dd><xen:contentcheck>{xen:helper userFieldValue, $fieldInfo, $user, {$user.customFields.{$fieldId}}}</xen:contentcheck></dd>
                            </dl>
                        </xen:if>
                    </xen:if>
                </xen:foreach>
              
            </xen:hook>
            </xen:if>
            </xen:contentcheck>
            <dl class="pairsJustified">
                <xen:include template="bdmedal_message_medals" />
            </dl>
        </div>
    </xen:if>
      
</xen:if>

    <span class="arrow"><span></span></span>
</div>
</div>

قالب
message_user_info.css


HTML:
.messageUserInfo
{
    @property "messageUserInfo";
    padding-right: 50px;
    padding-left: -5px;
    float: left;
    width: 220px;
    @property "/messageUserInfo";
}

    .messageUserBlock
    {
        @property "messageUserBlock";
        background-color: rgb(251, 251, 251);
        border: 1px solid rgb(219, 219, 219);
        @property "/messageUserBlock";
      
        position: relative;
    }
      
        .messageUserBlock div.avatarHolder
        {
            @property "messageAvatarHolder";
            background-color: rgb(251, 251, 251);
            padding: 10px;
            @property "/messageAvatarHolder";  
        }
      
            .messageUserBlock div.avatarHolder .avatar
            {
                display: block;
                font-size: 0;
            }
          
        .messageUserBlock h3.userText
        {
            @property "messageUserText";
            font-size: 13px;
            font-family: Tahoma,'Open Sans', sans-serif;
            padding: 8px 0 8px 8px;
            border-top: 1px solid rgb(241, 241, 241);
;
            @property "/messageUserText";
        }
      
        .messageUserBlock .userBanner
        {
            display: block;
            margin-bottom: 5px;
            margin-left: -{xen:calc '@messageUserText.padding-left + 6'}px;
            margin-right: -{xen:calc '@messageUserText.padding-right + 6'}px;
        }
      
        .messageUserBlock .userBanner:last-child
        {
            margin-bottom: 0;
        }
  
        .messageUserBlock a.username
        {
            @property "messageUsername";
            font-weight: bold;
            margin-left: -8px;
            display: block;
            overflow: hidden;
            line-height: 20px;
            text-align: center;
            @property "/messageUsername";
          
        }
      
        .messageUserBlock .userTitle
        {
            @property "messageUserTitle";
            font-size: 11px;
            padding-bottom: 4px;
            margin-left: -8px;
            display: block;
            text-align: center;
            @property "/messageUserTitle";
        }
      
        .messageUserBlock .extraUserInfo
        {
            @property "messageExtraUserInfo";
            font-size: 11px;
            background-color: rgb(251, 251, 251);
            padding: 4px 6px;
            @property "/messageExtraUserInfo";
        }
      
            .messageUserBlock .extraUserInfo dl
            {
                margin: 2px 0 5px;
                border: 1px dotted rgb(255, 78, 0);
                padding: 0 4px;
            }
                          
            .messageUserBlock .extraUserInfo img
            {
                max-width: 100%;
            }
      
        .messageUserBlock .arrow
        {
            position: absolute;
            top: 10px;
            right: -10px;
          
            display: block;
            width: 0px;
            height: 0px;
            line-height: 0px;
          
            border: 10px solid transparent;
            border-left-color: @messageUserBlock.border-color;
            -moz-border-left-colors: @messageUserBlock.border-color;
            border-right: none;
          
            /* Hide from IE6 */
            _display: none;
        }
      
            .messageUserBlock .arrow span
            {
                position: absolute;
                top: -10px;
                left: -11px;
              
                display: block;
                width: 0px;
                height: 0px;
                line-height: 0px;
              
                border: 10px solid transparent;
                border-left-color: @messageAvatarHolder.background-color;
                -moz-border-left-colors: @messageAvatarHolder.background-color;
                border-right: none;
            }

<xen:if is="@enableResponsive">
@media (max-width:@maxResponsiveNarrowWidth)
{
    .Responsive .messageUserInfo
    {
        float: none;
        width: auto;
    }

    .Responsive .messageUserBlock
    {
        overflow: hidden;
        margin-bottom: 5px;
        position: relative;
    }

    .Responsive .messageUserBlock div.avatarHolder
    {
        float: left;
        padding: 5px;
    }

        .Responsive .messageUserBlock div.avatarHolder .avatar img
        {
            width: 48px;
            height: 48px;
        }

    .Responsive .messageUserBlock h3.userText
    {
        margin-left: 64px;
    }
  
    .Responsive .messageUserBlock .userBanner
    {
        max-width: 150px;
        margin-left: 0;
        margin-right: 0;
        border-top-left-radius: 3px;
        border-top-right-radius: 3px;
        position: static;
        display: inline-block;
    }
  
        .Responsive .messageUserBlock .userBanner span
        {
            display: none;
        }

    .Responsive .messageUserBlock .extraUserInfo
    {
        display: none;
    }

    .Responsive .messageUserBlock .arrow
    {
        display: none;
    }
}
</xen:if>


مثال مباشر

[مطلوب] - مترجمين للنسخه السادسة من النظام | منتديات ميوي العربي


تحياتي للجميع
 
إنضم
31 مايو 2014
الرسائل
326
الإعجابات
198
#2
السلام عليكم ... مشكور اخي على المجهود و لكن للأسف يظهر لي خطا عند التعديل في القالب message_user_info.css

و بالذات في السطر 6 .

لو سمحت ممكن كود منظم و مختصر و جزاك الله خيرا