Edit the avatar and profile fields

Code:

              <div class="user">
                    <div class="user-ident">
                        <h4 class="username">{postrow.displayed.POSTER_NAME}</h4>
                        <div class="user-basic-info">
                          {postrow.displayed.POSTER_AVATAR}<br />
                          {postrow.displayed.POSTER_RANK_NEW}{postrow.displayed.RANK_IMAGE}
                        </div>
                    </div>
                    <div class="user-info">
                        {postrow.displayed.ONLINE_IMG}
                        <!-- BEGIN profile_field -->
                        {postrow.displayed.profile_field.LABEL}{postrow.displayed.profile_field.CONTENT}{postrow.displayed.profile_field.SEPARATOR}
                        <!-- END profile_field -->
                        {postrow.displayed.POSTER_RPG}
                    </div>
                  </div>

Code:

                  <div class="user">
                                                  <table width="100%" class="userpost_head"><tr>
                    <td>
                                                    <div class="user-ident">
                                                      <table width="100%"><tr><td class="post_author_baisc" width="70">
                                                        {postrow.displayed.POSTER_AVATAR}<br /></td>
                        <td><h4 class="username">{postrow.displayed.POSTER_NAME}</h4>
                        <div class="user-basic-info">
                          {postrow.displayed.POSTER_RANK_NEW}{postrow.displayed.RANK_IMAGE}
                        </div>
                                                        </td></tr></table>
                    </div>
                                                    </td>
                                                    <td class="post_author_info">
                    <div class="user-info">
                        {postrow.displayed.ONLINE_IMG}
                        <!-- BEGIN profile_field -->
                        {postrow.displayed.profile_field.LABEL}{postrow.displayed.profile_field.CONTENT}{postrow.displayed.profile_field.SEPARATOR}
                        <!-- END profile_field -->
                        {postrow.displayed.POSTER_RPG}
                    </div>
                                                    </td>
                                                  </tr></table>
                  </div>

Code:

. Place. Postmain {
  margin-left: 0px;
  background-color: # FBFBFB;
} . place. postbody table.userpost_head {  background: WhiteSmoke,  border-bottom: 1px solid # ddd; } . place. user. user-info {  float: right;  margin-right: 100px,  margin-top: 20px;  margin-bottom: 10px;  line-height: 10px; } . place. station. user {  float: none;  margin-left: 0px;  margin-top: 0px;  positions: initial; } . place. user. user-ident {  margin-left: 20px; } . place. User-ident. username {  position: initial; } . postfoot. user-contact. postfoot. post options {  height: 20px! important; } . place. user. user-ident. post_author_basic a img {  max-width: 100px! important,  max-height: 75px! important; }

Sir Chivas wrote:There's only a tutorial, but it's only related to the followed version: phpBB2. I cannot remember where I had seen this tutorial?   

If I find it I will post it here.



Found it in the RSF.

go to ACP >> Display >> Templates >> General >>  viewtopic_body. Select next snippet of code

Code:

               <div class="user">
                     <div class="user-ident">
                        <h4 class="username">{postrow.displayed.POSTER_NAME}</h4>
                        <div class="user-basic-info">
                           {postrow.displayed.POSTER_AVATAR}<br />
                           {postrow.displayed.POSTER_RANK_NEW}{postrow.displayed.RANK_IMAGE}
                        </div>
                     </div>
                     <div class="user-info">
                        {postrow.displayed.ONLINE_IMG}
                        <!-- BEGIN profile_field -->
                        {postrow.displayed.profile_field.LABEL}{postrow.displayed.profile_field.CONTENT}{postrow.displayed.profile_field.SEPARATOR}
                        <!-- END profile_field -->
                        {postrow.displayed.POSTER_RPG}
                     </div>
                  </div>

Replace it with:

Code:

                  <div class="user">
                                                  <table width="100%" class="userpost_head"><tr>
                     <td>
                                                    <div class="user-ident">
                                                      <table width="100%"><tr><td class="post_author_baisc" width="70">
                                                        {postrow.displayed.POSTER_AVATAR}<br /></td>
                        <td><h4 class="username">{postrow.displayed.POSTER_NAME}</h4>
                        <div class="user-basic-info">
                           {postrow.displayed.POSTER_RANK_NEW}{postrow.displayed.RANK_IMAGE}
                        </div>
                                                        </td></tr></table>
                     </div>
                                                    </td>
                                                    <td class="post_author_info">
                     <div class="user-info">
                        {postrow.displayed.ONLINE_IMG}
                        <!-- BEGIN profile_field -->
                        {postrow.displayed.profile_field.LABEL}{postrow.displayed.profile_field.CONTENT}{postrow.displayed.profile_field.SEPARATOR}
                        <!-- END profile_field -->
                        {postrow.displayed.POSTER_RPG}
                     </div>
                                                    </td>
                                                  </tr></table>
                  </div>

After submitting it, make sure that it's saved and published! By clicking this:   


Then add this into your CSS:

Code:

. Place. Postmain {
  margin-left: 0px;
  background-color: # FBFBFB;
} . place. postbody table.userpost_head {   background: WhiteSmoke,   border-bottom: 1px solid # ddd; } . place. user. user-info {   float: right;   margin-right: 100px,   margin-top: 20px;   margin-bottom: 10px;   line-height: 10px; } . place. station. user {   float: none;   margin-left: 0px;   margin-top: 0px;   positions: initial; } . place. user. user-ident {   margin-left: 20px; } . place. User-ident. username {   position: initial; } . postfoot. user-contact. postfoot. post options {   height: 20px! important; } . place. user. user-ident. post_author_basic a img {   max-width: 100px! important,   max-height: 75px! important; }

Sir Chivas™ wrote:Are you sure you made the correct changes? I'll test it out today in my test forum and report back to you.

Sir Chivas™ wrote:Can you please provide your forum URL ? Thank you.

[SS] Illuminati wrote:

Sir Chivas wrote:Can you please provide your forum URL ? Thank you.

Http://www.maliciousgaming.forumotion.com

Xnomejx wrote:Could you also use the codes above for PHPBB2?

Sir Chivas wrote:

[SS] Illuminati wrote:

Sir Chivas wrote:Can you please provide your forum URL ? Thank you.

Http://www.maliciousgaming.forumotion.com

You've removed the codes, correct? I wanted to view how it looked afterwards.

Xnomejx wrote:Could you also use the codes above for PHPBB2?

Nope they can't, I can provide the codes for your forum version, but you'll need to create your own thread.

Xnomejx wrote:So why not try it again then take a screenshot of the messed up topic?

Sir Chivas wrote:It's all right, take your time, mate. I'll test out the codes myself. I'll post or edit my post to give the correct codes or solution.

Hi,

I've barely noticed that the codes are quite old, so there will be some modification done to them. Once I am done with both versions: phpBB2 and punBB I will provided them here.