بسم الله الرحمن الرحيم
شرح لجعل بيانات العضو في المشاركات مثل منتدى هيلبرنت
وهو عبارة عن تبديل قوالب
الشرح :
اولا نبحث عن القالب التالي بالاستايل اللي بتريد التغيير فيه
writer_info
ونستبدله بالكود التالي
ومن ثم نتوجه نحو "تحرير css متقدم"
ونضيف الاكواد التالية
معاينة النتيجة :
بالتوفيق للجميع
والسلام ختام
شرح لجعل بيانات العضو في المشاركات مثل منتدى هيلبرنت
وهو عبارة عن تبديل قوالب
الشرح :
اولا نبحث عن القالب التالي بالاستايل اللي بتريد التغيير فيه
writer_info
ونستبدله بالكود التالي
كود:
<script type="text/javascript">
$(document).ready(function(){
$("#emenu_{$Info['id']}_{$Info['reply_id']}").click(function(){
$(this).next("#menue_{$Info['id']}_{$Info['reply_id']}").slideToggle("slow");
})
$('.text').click(function(){
$("#menue_{$Info['id']}_{$Info['reply_id']}").hide("fast");
$("#menue_{$Info['id']}_{$Info['reply_id']}").css('display', 'none');
})
});
</script>
<!-- table --><div style="width:100%; padding:3px;" class="table writers_info">
<dl>
<dt></dt>
<div style="vertical-align: top;" class="w_photo">
<div class="UserPhoto_large">
{if {$_CONF['info_row']['allow_avatar']} == '1'}
{if {$ReplierInfo['avater_path']} != ''}
<a rel="nofollow" href="index.php?page=profile&show=1&id={$ReplierInfo['id']}">
<img src="{$ReplierInfo['avater_path']}" class="brd0" title="{$lang['Picture']} {$ReplierInfo['username']} {$lang['Personal']}" alt="{$lang['Picture']}{$ReplierInfo['username']}{$lang['Personal']}" />
</a>
{else}
<a rel="nofollow" href="index.php?page=profile&show=1&id={$ReplierInfo['id']}">
<img src="{$image_path}/
{$_CONF['info_row']['default_avatar']}" class="brd0" alt="{$lang['no_photo']}" title="{$lang['no_photo']}" />
</a>
{/if}
{/if}
</div>
</div>
<div class="Triangle"></div>
<dd class="w_name_rate">
<!-- Code switch Menu start -->
<div id="emenu_{$Info['id']}_{$Info['reply_id']}">
{if {$ReplierInfo['username']} !=''}
<b class="bigusername">{$ReplierInfo['username']}</b>
{else}
<b class="bigusername">{$lang['Guest_']}</b>
{/if}
</div>
<div class="border" style="display:none;position: absolute;z-index: 999999;" id="menue_{$Info['id']}_{$Info['reply_id']}">
<div class="thead">
{if {$ReplierInfo['username']} !=''}
<a href="index.php?page=profile&show=1&id={$ReplierInfo['id']}">
{$ReplierInfo['display_username']}</a>
{else}
<b>{$lang['Guest_']}</b>
{/if}
</div>
<div class="row1">
<a rel="nofollow" href="index.php?page=profile&show=1&id={$ReplierInfo['id']}">
{$lang['view_profile']}
</a>
</div>
<div class="row1">
<a href="index.php?page=search&option=3&username={$ReplierInfo['username']}&starteronly=0§ion=all&exactname=1&sort_order=DESC">
{$lang['search_for_all_posts']}
{$ReplierInfo['username']}</a>
</div>
<div class="row1">
<a href="index.php?page=search&option=4&username={$ReplierInfo['username']}&starteronly=0§ion=all&exactname=1&sort_order=DESC">
{$lang['search_for_all_replys']}
{$ReplierInfo['username']}</a>
</div>
{if {$_CONF['member_permission']}}
<div class="row1">
<a href="index.php?page=pm_send&send=1&index=1&username={$ReplierInfo['username']}">
{$lang['send_a_private_message_to']}
{$ReplierInfo['username']} </a>
</div>
{/if}
{if {$_CONF['member_permission']}}
<div class="row1">
<a href="index.php?page=send&member=1&index=1&id={$ReplierInfo['id']}">
{$lang['send_a_message_to_the_mailing']}
{$ReplierInfo['username']} </a>
</div>
{/if}
{if {$mod_edit_member}}
{if {$_CONF['member_permission']}}
<div class="row1">
<a target="_blank" href="{$admincpdir}?page=member&edit=1&main=1&id=
{$ReplierInfo['id']}">
{$lang['edit_member_data']}
{$ReplierInfo['username']} </a>
</div>
{/if}
{/if}
</div>
<!-- Code switch Menu End -->
<!-- action_find_addons_1 -->
{if {$ReplierInfo['username']} !=''}
<div class="smallfont center_text_align">
{if {$GroupInfo['usertitle_change']} == 1}
{if {$Usertitle} != ''}
{$Usertitle}
{else}
{$ReplierInfo['user_title']}
{/if}
{else}
{if !{$ReplierInfo['user_title']}}
{$GroupInfo['user_title']}
{else}
{$ReplierInfo['user_title']}
{/if}
{/if}
</div>
{if {$RatingInfo['posts']} > {$ReplierInfo['posts']}}
{if {$RatingInfo['rating']} != 'look/images/rating/rating_0.gif'}
<div class="center_text_align" style="margin-top:10px">
<img class="brd0" alt="rating" src="{$RatingInfo['rating']}" />
</div>
{/if}
{/if}
{/if}
{if {$_CONF['info_row']['allow_apsent']} == '1'}
{if {$ReplierInfo['away']}}
<div class="w_absent">
<fieldset>
<legend><span class="smallfont">{$lang['user_Absent']}</span></legend>
<span class="smallfont">
{$ReplierInfo['away_msg']}
</span>
</fieldset>
</div>
{/if}
{/if}
<!-- action_find_addons_8 -->
</dd>
<dd class="w_others">
<!-- action_find_addons_7 -->
</dd>
<!-- action_find_addons_5 -->
{if {$Awards_nm} > '0'}
<dd class="w_awards">
<div class="user_awards">
{template}awards{/template}
</div>
</dd>
{/if}
<dd class="center_text_align w_lasts">
<!-- action_find_addons_6 -->
{if !{$Info['reply_id']}}
{if {$_CONF['info_row']['show_list_last_5_posts_member']} == 1}
{template}last_subject_writer{/template}
{/if}
{/if}
</dd>
<dd class="CommUserInfo">
<table style="margin-bottom: 4px; border-bottom: 1px solid rgb(213, 213, 213);" width="100%">
<tbody><tr>
<!-- action_find_addons_2 -->
{get_hook}writer_info_top{/get_hook}
{if {$ReplierInfo['username']} !=''}
<div class="w_toggle" title="{$lang['information_writer']}">
<i class="w_toggle_writer fa fa-toggle-on fa-1x"><span class="w_writer"> {$lang['information_writer']} ▼</span></i>
<td align="center" width="65px"><div style="color:rgb(71, 91, 237)" class="badge1 icov4"></div>
<small style=" font-size: 10px;font-weight: lighter;display: block;white-space: normal;overflow: hidden !important;text-overflow: ellipsis;">{$lang['join_date']} {$ReplierInfo['register_date']}</small></td>
</div>
<div class="writer_info right_text_align">
<td align="center" width="65px"><div style="color:rgb(10, 143, 231)" class="badge1 icov4"></div>
<small style=" font-size: 10px;font-weight: lighter;display: block;white-space: normal;overflow: hidden !important;text-overflow: ellipsis;">{$lang['user_num']} {$ReplierInfo['id']}</small></td>
</div>
<div class="writer_info right_text_align">
<td align="center" width="65px"><div style="color:rgb(255, 10, 10)" class="badge1 icov4"></div>
<small style=" font-size: 10px;font-weight: lighter;display: block;white-space: normal;overflow: hidden !important;text-overflow: ellipsis;">{$lang['posts']} {$ReplierInfo['posts']}</small></td>
</div>
{if {$ReplierInfo['user_country']} != ''}
<div class="writer_info right_text_align">
<td align="center" width="65px"><div style="color:rgb(255, 18, 198)" class="badge1 icov4"></div>
<small style=" font-size: 10px;font-weight: lighter;display: block;white-space: normal;overflow: hidden !important;text-overflow: ellipsis;">{$lang['user_country']} {$ReplierInfo['user_country']}</small></td>
</div>
{/if}
<div class="writer_info right_text_align">
<td align="center" width="65px"><div style="color:rgb(78, 143, 18)" class="badge1 icov4"><i class="fa fa-venus-mars" aria-hidden="true"></i></div>
<small style=" font-size: 10px;font-weight: lighter;display: block;white-space: normal;overflow: hidden !important;text-overflow: ellipsis;">{$lang['user_gender']} {if {$ReplierInfo['user_gender']} == m}
<img title="{$lang['gender_m']}"
alt="{$lang['gender_m']}"
src="{$image_path}/gender_male.gif" />
{else}
<img title="{$lang['gender_f']}"
alt="{$lang['gender_f']}"
src="{$image_path}/gender_female.gif" />
{/if}</small></td>
</div>
{if {$ReplierInfo['bday_year']} != ''}
{if {$ReplierInfo['bday_year']} != '0'}
<div class="writer_info right_text_align">
<td align="center" width="65px"><div style="color:rgb(255, 10, 10)" class="badge1 icov4"><i class="fa fa-birthday-cake" aria-hidden="true"></i></div>
<small style=" font-size: 10px;font-weight: lighter;display: block;white-space: normal;overflow: hidden !important;text-overflow: ellipsis;">{$lang['Birth_date']} {$ReplierInfo['bday_day']}-{$ReplierInfo['bday_month']}-{$ReplierInfo['bday_year']}</small></td>
</div>
{/if}
{/if}
{if {$ReplierInfo['invite_num']} != '0'}
<div class="writer_info right_text_align">
<td align="center" width="65px"><div style="color:rgb(255, 10, 10)" class="badge1 icov4"></div>
<small style=" font-size: 10px;font-weight: lighter;display: block;white-space: normal;overflow: hidden !important;text-overflow: ellipsis;">{$lang['Invites']} {$ReplierInfo['invite_num']}</small></td>
</div>
{/if}
{if {$ReplierInfo['warnings']} > 0}
<div class="writer_info right_text_align">
<td align="center" width="65px"><div style="color:rgb(255, 10, 10)" class="badge1 icov4"></div>
<small style=" font-size: 10px;font-weight: lighter;display: block;white-space: normal;overflow: hidden !important;text-overflow: ellipsis;">{$lang['user_warnings']} {$ReplierInfo['warnings']}</small></td>
</div>
{/if}
{if {$ReplierInfo['reputation']} != ''}
<div class="writer_info right_text_align">
<td align="center" width="65px"><div style="color:#509000" class="badge1 icov4"></div>
<small style=" font-size: 10px;font-weight: lighter;display: block;white-space: normal;overflow: hidden !important;text-overflow: ellipsis;">{$lang['user_reputation']} {$ReplierInfo['reputation']}</small></td>
</div>
</tr>
</tbody></table>
<!-- action_find_addons_3 -->
{/if}
{if !empty({$ReplierInfo['user_website']}) and {$ReplierInfo['user_website']} != 'http://'}
<div class="writer_info right_text_align">
{$lang['UserWebsite']} :
<?php if (strstr($PowerBB->_CONF['template']['ReplierInfo']['user_website'],'http://')) { ?>
<a target="_blank" href="{$ReplierInfo['user_website']}">{$lang['Visit_my_website']}</a>
<?php }else{ ?>
<a target="_blank" href="http://{$ReplierInfo['user_website']}">{$lang['Visit_my_website']}</a>
{/if}
</div>
{/if}
{if is_array({$while['extrafield']})==true }
{Des::while}{extrafield}
<?php if( $PowerBB->_CONF['template']['ReplierInfo'][ $PowerBB->_CONF['template']['while']['extrafield'][$this->x_loop]['name_tag'] ]!='' ){ ?>
<div class="writer_info right_text_align">
{$extrafield['name']} :
<?php $PowerBB->_CONF['template']['ReplierInfo'][ $PowerBB->_CONF['template']['while']['extrafield'][$this->x_loop]['name_tag'] ] = $PowerBB->functions->CleanVariable($PowerBB->_CONF['template']['ReplierInfo'][ $PowerBB->_CONF['template']['while']['extrafield'][$this->x_loop]['name_tag'] ],'html'); ?>
<?php echo $PowerBB->_CONF['template']['ReplierInfo'][ $PowerBB->_CONF['template']['while']['extrafield'][$this->x_loop]['name_tag'] ] ?>
</div>
<?php }else{ ?>
<?php } ?>
{/Des::while}
{/if}
<div class="center_text_align" style="margin-top:10px">
<!-- {$lang['Case']} : -->
<?php
if (strstr($PowerBB->_CONF['template']['status'],"icon_user_online.gif")){
?>
<a class="UserOnline00">متواجد الان<span></span></a>
<?php
}
else
{
?>
<a class="UserOffline00">غير متواجد<span></span></a>
<?php
}
?>
{if !{$admin_mod_toolbar}}
<a title="{$lang['send_warn_to_mem']}
{$ReplierInfo['username']}" href="index.php?page=warn&index=1&id={$ReplierInfo['id']}"><img class="brd0" alt="{$lang['send_warn_to_mem']}"
src="{$image_path}/warn.png" /></a>
{/if}
{if {$_CONF['rows']['group_info']['admincp_allow']}}
{if {$ReplierInfo['member_ip']} != ''}
<img title="{$lang['user_IP']}:
{$ReplierInfo['member_ip']}" alt="User IP" class="brd0" src="{$image_path}/information.png" />
{/if}
{/if}
</div>
<!-- action_find_addons_4 -->
{get_hook}writer_info_down{/get_hook}
</dd>
{/if}
</dl>
</div><!-- /table -->ومن ثم نتوجه نحو "تحرير css متقدم"
ونضيف الاكواد التالية
كود:
.CommUserInfo {
color: #565656;
font-family: "Droid Arabic Kufi","Open Sans",sans-serif;
font-size: 0.6em;
font-weight: lighter;
border: 1px solid #dedede;
border-radius: 5px;
padding: 10px;
width: 500px;
float: left;
margin-left: 8px;
background: #F3F3F3;
}
.CommUserInfo span {
color: #565656;
font-size: 13px;
}
.TmpPost .HeaderPost .CommUserInfo {
color: #565656;
font-family: "Droid Arabic Kufi","Open Sans",sans-serif;
font-size: 0.6em;
font-weight: lighter;
border: 1px solid #dedede;
border-radius: 5px;
padding: 10px;
width: 500px;
float: left;
margin-left: 8px;
background: #F3F3F3;
}
.TmpComments .RightPost .CommUserInfo {
color:#393939;
font-family:"Droid Arabic Kufi","Open Sans",sans-serif;
font-size:0.6em;
font-weight:lighter;
margin-bottom:5px;
padding: 0px;
margin: 2px;
border: 1px solid #D9F5BF;
border-radius: 3px;
background-color: #fff;
}
.TmpComments .RightPost .CommUserInfo span {
color: #D9EBEB;
text-shadow: 0px 0px 2px #35501B;
}
.TmpComments .RightPost .CommUserInfo .Memberpost {
width: 15px;
text-align: center;
padding: 3px;
background-color: #D9EBEB;
font-size: 13px;
}
.TmpComments .RightPost .CommUserInfo {
display: none;
}
.TmpPost .HeaderPost .CommUserInfo {
display: none;
}
.badge {
font-size: 28px;
padding: 5px;
}
.badge1 {
font-size: 30px;
padding: 5px;
}
.badge2 {
font-size: 30px;
padding: 5px;
}معاينة النتيجة :
بالتوفيق للجميع
والسلام ختام