How To Put UserinfoPane Horizontal On IP.Board

How To Put UserinfoPane Horizontal On IP.Board. This is my version of horizontal userinfoPane, please you can follow the tutorial that I will give.



Vertical userinfoPane:


Follow the tutorial below :

• Goto: ACP
• Look And Feel
• Global Template 
• userInfoPane and do the following
  remove all the coding in the userInfoPane and replace with this one

ul.basic_info_horizontal{width: 100%; margin: 3px 0px; display: table;}ul.basic_info_horizontal li{padding: 3px 5px 0; width: 155px;margin-bottom: 3px; margin-right: 5px;}ul.no-border li{ text-align: center;}ul.left-p li{padding-left: 20px; width: 88%;}ul.basic_info_horizontal li:last-child{border: 0px;}

• {parse expression="sprintf($this->lang->words['warn_status'], $author['warn_level'])"}
• lang->words['view_profile']}" class='ipsUserPhotoLink'>

• {parse template="userHoverCard" group="global" params="$author"} {$author['members_display_name']}{$author['member_title']}
  [*] {$author['member_rank_img']}
  

• {$field}

[*]Post:{parse expression="$this->registry->getClass('class_localization')->formatNumber( intval( $author['posts'] ) )"}
[*]Joined: {parse date="$author['joined']" format="joined"}
[*] Member's ID: {$author['member_id']} Reputation: {parse expression="$this->lang->formatNumber( intval( $author['pp_reputation_points'] ) )"}

please make sure to replace, where it says 

http://yoursite.com/public/style_images/yourtheme/rep_up.png

with your site and with your theme and the same with this one as well 

and heres the picture for the rep icon just right click and save it as rep_up to your desktop then upload it to your FTP and in your theme folder

[hr]

Normal userinfoPane:

/* AUTHOR INFO (& RELATED) STYLES */.author_info { width: 155px; float: left; font-size: 12px; text-align: center; padding: 15px 10px;} .author_info .group_title { color: #5a5a5a; margin-top: 5px; } .author_info .member_title { margin-bottom: 5px; word-wrap: break-word; } .author_info .group_icon { margin-bottom: 3px; }

Replace with one:

/* AUTHOR INFO (& RELATED) STYLES */.column_view .post_wrap{ background: #fbfbfb;}.column_view .post_body{ border-left: 1px solid #f0f0f0;}.author_info {width:auto;font-size:12px;padding:10px 10px;line-height:150%;border-bottom:1px solid #CCCCCC;background: #E9EDEE;}.author_info li { list-style-image: none; list-style-type: none; }.author_info a { color: #313131; }.author_info a:hover { color: #5c5c5c; } .author_info .group_title {  font-weight:bold;color:#5a5a5a;margin-top:5px } .author_info .member_title { margin-bottom: 5px; } .author_info .group_icon { margin-bottom: 3px; }.smalltext {color: #666;position: relative;right: 30px;}

Simple and practical, good luck!

It is How To Put UserinfoPane Horizontal On IP.Board, hopefully be useful to you!

Title: How To Put UserinfoPane Horizontal On IP.Board
Posted by:Stuard Van
Published :2013-08-30T10:00:00-07:00
Rating: 5
Reviewer: 5 Reviews
How To Put UserinfoPane Horizontal On IP.Board

Share :

Related articles: