The forum of the forums
Welcome to the Official Support Forum of Forumotion!

To take full advantage of everything offered by our forum, please log in if you are already a member, or join our community if you've not yet.



Create a free forum like this one.

Placing the user's profile information above the post

View previous topic View next topic Go down

Solved Placing the user's profile information above the post

Post by Eman and Kou on February 7th 2013, 4:59 am

Hey guys it's been awhile! So yeah got back into coding and i'm working on a pet project and hit a snag. I want to do something similar to this: http://swordartonline.proboards.com/index.cgi?board=clarkswood&action=display&thread=8085 (Scroll down to see how the user information is displayed) on my forums. Now I'm using Punbb because quite frankly it's the most underrated version of them all and tinkering with it is quite fun, however I hit a proverbial snag with the CSS. I located the tags that manage the profile information however the only way to move it so far has when I changed this:

Code:
.pun .post .user {
   float: right;
   margin-right: -16em;
   margin-top: -1.8em;
   position:relative;
   }

To this:

Code:
.pun .post .user {
   float: top;
   margin-right: -16em;
   margin-top: -1.8em;
   position:fixed;
   }

However when it does move it sits on the forum itself kind like a higher layer instead of being on the forums layer. So if anyone else knows how to do this or tests it out themselves let me know, I'll continue to mess around with it myself to see if any other tags move it and if I do find a solution I'll change the topic to solved.

-Eman and Kou

Eman and Kou
Forumember

Male Posts : 367
Reputation : 6
Language : English, Spanish, Japanese, Female, HTML, CSS (working on it), GFX (Working on it)
Location : Somewhere where santa cant find me

http://ninja-generation.rpg-dynasty.com/index.htm

Back to top Go down

Solved Re: Placing the user's profile information above the post

Post by SLGray on February 7th 2013, 5:26 am

Have you tried this with the templates?


When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.


SLGray
Administrator
Administrator

Male Posts : 36657
Reputation : 2443
Language : English
Location : United States

http://ztwds.forumotion.com/

Back to top Go down

Solved Re: Placing the user's profile information above the post

Post by Eman and Kou on February 7th 2013, 6:05 am

Not yet I haven't I actually thought about doing it next, but it seemed more logical that it would be controlled through the CSS spreadsheet.

EDIT: Okay so I remembered something of an update Forumotion did a year or two back where they placed the profiles positioning in the general section so is there a way to like turn that off completely? That would probably help the process out a little bit since apparently I can still move it from left to right when i'm deciding it's position in the topic, but the background bar won't follow.

EDIT 2: Here's an example of the current look for reference, I have the profiles set to the left in the general tab but in the css I have them floating to the right of the post: http://sao-mcinc.rpg-boards.com/t15-yukinayuki-konahana

Also side note of the edit: Current tinkering with the templates does not change the positioning of the profile in the post.

Eman and Kou
Forumember

Male Posts : 367
Reputation : 6
Language : English, Spanish, Japanese, Female, HTML, CSS (working on it), GFX (Working on it)
Location : Somewhere where santa cant find me

http://ninja-generation.rpg-dynasty.com/index.htm

Back to top Go down

Solved Re: Placing the user's profile information above the post

Post by Eman and Kou on February 8th 2013, 11:08 pm

Bump

Eman and Kou
Forumember

Male Posts : 367
Reputation : 6
Language : English, Spanish, Japanese, Female, HTML, CSS (working on it), GFX (Working on it)
Location : Somewhere where santa cant find me

http://ninja-generation.rpg-dynasty.com/index.htm

Back to top Go down

Solved Re: Placing the user's profile information above the post

Post by Eman and Kou on February 9th 2013, 1:37 am

I inputted the code and i'm looking through it right now but it's giving me an error message that a tag has been closed without being opened or wasn't opened at all: "The tag has been closed before being opened or the tag hasn't been opened."


Eman and Kou
Forumember

Male Posts : 367
Reputation : 6
Language : English, Spanish, Japanese, Female, HTML, CSS (working on it), GFX (Working on it)
Location : Somewhere where santa cant find me

http://ninja-generation.rpg-dynasty.com/index.htm

Back to top Go down

Solved Re: Placing the user's profile information above the post

Post by SLGray on February 9th 2013, 2:01 am

I just tested this on my punBB forum. It still gives this message:

Error:
The tag has been closed before being opened or the tag hasn't been opened.


When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.


SLGray
Administrator
Administrator

Male Posts : 36657
Reputation : 2443
Language : English
Location : United States

http://ztwds.forumotion.com/

Back to top Go down

Solved Re: Placing the user's profile information above the post

Post by Eman and Kou on February 9th 2013, 2:13 am

Same error message, I think it's because were removing a tag or two hold on let me test this.

EDIT: It was us removing a tag, you forgot to put the
Code:
 <!-- END first_post_br -->

tag back into the code.

Eman and Kou
Forumember

Male Posts : 367
Reputation : 6
Language : English, Spanish, Japanese, Female, HTML, CSS (working on it), GFX (Working on it)
Location : Somewhere where santa cant find me

http://ninja-generation.rpg-dynasty.com/index.htm

Back to top Go down

Solved Re: Placing the user's profile information above the post

Post by SLGray on February 9th 2013, 2:15 am

I am still getting the error message.


When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.


SLGray
Administrator
Administrator

Male Posts : 36657
Reputation : 2443
Language : English
Location : United States

http://ztwds.forumotion.com/

Back to top Go down

Solved Re: Placing the user's profile information above the post

Post by SLGray on February 9th 2013, 2:28 am

It did not for me.


When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.


SLGray
Administrator
Administrator

Male Posts : 36657
Reputation : 2443
Language : English
Location : United States

http://ztwds.forumotion.com/

Back to top Go down

Solved Re: Placing the user's profile information above the post

Post by SLGray on February 9th 2013, 2:32 am

Code:
                      <div class="main-content topic">
    <!-- END first_post_br -->
    <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 class="post post--{postrow.displayed.U_POST_ID}"{postrow.displayed.THANK_BGCOLOR} style="{postrow.displayed.DISPLAYABLE_STATE}">
                <a name="{postrow.displayed.U_POST_ID}"></a>
                <div class="postmain"{postrow.displayed.THANK_BGCOLOR}>
                  <div id="p{postrow.displayed.U_POST_ID}" class="posthead"{postrow.displayed.THANK_BGCOLOR}>
                      <h2>
                        <strong>{postrow.displayed.COUNT_POSTS}</strong>
                        {postrow.displayed.ICON} <a href="{postrow.displayed.POST_URL}">{postrow.displayed.POST_SUBJECT}</a> {postrow.displayed.POST_DATE_NEW}
                      </h2>
                  </div>

                  <div class="postbody"{postrow.displayed.THANK_BGCOLOR}>
                      <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>


When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.


SLGray
Administrator
Administrator

Male Posts : 36657
Reputation : 2443
Language : English
Location : United States

http://ztwds.forumotion.com/

Back to top Go down

Solved Re: Placing the user's profile information above the post

Post by Eman and Kou on February 9th 2013, 2:39 am

Code:
<hr id="first-post-br" />
                        <!-- END first_post_br -->
        <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 class="post post--{postrow.displayed.U_POST_ID}"{postrow.displayed.THANK_BGCOLOR} style="{postrow.displayed.DISPLAYABLE_STATE}">
            <a name="{postrow.displayed.U_POST_ID}"></a>
            <div class="postmain"{postrow.displayed.THANK_BGCOLOR}>
              <div id="p{postrow.displayed.U_POST_ID}" class="posthead"{postrow.displayed.THANK_BGCOLOR}>
                  <h2>
                    <strong>{postrow.displayed.COUNT_POSTS}</strong>
                    {postrow.displayed.ICON} <a href="{postrow.displayed.POST_URL}">{postrow.displayed.POST_SUBJECT}</a> {postrow.displayed.POST_DATE_NEW}
                  </h2>
              </div>

              <div class="postbody"{postrow.displayed.THANK_BGCOLOR}>
                  <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>

It placed the profile information at the top of the post however everything else is still on the left side.

http://sao-mcinc.rpg-boards.com/t12-feedback-template?tt=1 (Example, don't know if you guys need to be admins to see it I hadn't saved the changes to the template yet.)

Eman and Kou
Forumember

Male Posts : 367
Reputation : 6
Language : English, Spanish, Japanese, Female, HTML, CSS (working on it), GFX (Working on it)
Location : Somewhere where santa cant find me

http://ninja-generation.rpg-dynasty.com/index.htm

Back to top Go down

Solved Re: Placing the user's profile information above the post

Post by Eman and Kou on February 9th 2013, 2:41 am

Ah, so now I can just move it around in the CSS spreadsheet? Also what about the default profile bar because that's still there.

Eman and Kou
Forumember

Male Posts : 367
Reputation : 6
Language : English, Spanish, Japanese, Female, HTML, CSS (working on it), GFX (Working on it)
Location : Somewhere where santa cant find me

http://ninja-generation.rpg-dynasty.com/index.htm

Back to top Go down

Solved Re: Placing the user's profile information above the post

Post by Eman and Kou on February 9th 2013, 2:46 am

Ah I think I noticed it. If I moved this part of the 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>

Back above the profile information would it move it back down or would it basically put me back to square 1?

Eman and Kou
Forumember

Male Posts : 367
Reputation : 6
Language : English, Spanish, Japanese, Female, HTML, CSS (working on it), GFX (Working on it)
Location : Somewhere where santa cant find me

http://ninja-generation.rpg-dynasty.com/index.htm

Back to top Go down

Solved Re: Placing the user's profile information above the post

Post by SLGray on February 9th 2013, 2:47 am

I am still getting the error message when I try to replace the code. If it helps, I have not modified any templates until now.


When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.


SLGray
Administrator
Administrator

Male Posts : 36657
Reputation : 2443
Language : English
Location : United States

http://ztwds.forumotion.com/

Back to top Go down

Solved Re: Placing the user's profile information above the post

Post by Eman and Kou on February 9th 2013, 2:50 am

Use the code I posted SL. Also make sure you don't remove this part of the code:

Code:
<div class="main-content topic">
      <!-- BEGIN postrow -->
         <!-- BEGIN hidden -->
            <p class="p-hidden">{postrow.hidden.MESSAGE}</p>
         <!-- END hidden -->
         
         <!-- BEGIN displayed -->
         <!-- BEGIN first_post_br -->
      </div>

Just this part:

Rideem3 wrote:Go to Admin Panel -> Display -> General -> Viewtopic_body -> find:
Code:
<div class="main-content topic">
         <!-- END first_post_br -->
         <div class="post post--{postrow.displayed.U_POST_ID}"{postrow.displayed.THANK_BGCOLOR} style="{postrow.displayed.DISPLAYABLE_STATE}">
            <a name="{postrow.displayed.U_POST_ID}"></a>
            <div class="postmain"{postrow.displayed.THANK_BGCOLOR}>
               <div id="p{postrow.displayed.U_POST_ID}" class="posthead"{postrow.displayed.THANK_BGCOLOR}>
                  <h2>
                     <strong>{postrow.displayed.COUNT_POSTS}</strong>
                     {postrow.displayed.ICON} <a href="{postrow.displayed.POST_URL}">{postrow.displayed.POST_SUBJECT}</a> {postrow.displayed.POST_DATE_NEW}
                  </h2>
               </div>

               <div class="postbody"{postrow.displayed.THANK_BGCOLOR}>
                  <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>

Eman and Kou
Forumember

Male Posts : 367
Reputation : 6
Language : English, Spanish, Japanese, Female, HTML, CSS (working on it), GFX (Working on it)
Location : Somewhere where santa cant find me

http://ninja-generation.rpg-dynasty.com/index.htm

Back to top Go down

Solved Re: Placing the user's profile information above the post

Post by SLGray on February 9th 2013, 3:01 am

Thanks, Eman and Kou.


When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.


SLGray
Administrator
Administrator

Male Posts : 36657
Reputation : 2443
Language : English
Location : United States

http://ztwds.forumotion.com/

Back to top Go down

Solved Re: Placing the user's profile information above the post

Post by Eman and Kou on February 9th 2013, 3:31 am

@Eman and Kou wrote:Ah I think I noticed it. If I moved this part of the 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>

Back above the profile information would it move it back down or would it basically put me back to square 1?

If you could answer this post Rideem that would be nice.

Eman and Kou
Forumember

Male Posts : 367
Reputation : 6
Language : English, Spanish, Japanese, Female, HTML, CSS (working on it), GFX (Working on it)
Location : Somewhere where santa cant find me

http://ninja-generation.rpg-dynasty.com/index.htm

Back to top Go down

Solved Re: Placing the user's profile information above the post

Post by Eman and Kou on February 10th 2013, 12:27 am

Bump

Eman and Kou
Forumember

Male Posts : 367
Reputation : 6
Language : English, Spanish, Japanese, Female, HTML, CSS (working on it), GFX (Working on it)
Location : Somewhere where santa cant find me

http://ninja-generation.rpg-dynasty.com/index.htm

Back to top Go down

Solved Re: Placing the user's profile information above the post

Post by Eman and Kou on February 10th 2013, 10:38 pm

Blah, so how would i be able to move both above the post without fubaring it? Like i'm thinking that if I could get rid of the default profile information placement I would be able to do it, but it seems to be hard coded into the forum so I can't change the placement. And tips or tricks or insight into that or should I just be happy with what I got now?

Eman and Kou
Forumember

Male Posts : 367
Reputation : 6
Language : English, Spanish, Japanese, Female, HTML, CSS (working on it), GFX (Working on it)
Location : Somewhere where santa cant find me

http://ninja-generation.rpg-dynasty.com/index.htm

Back to top Go down

Solved Re: Placing the user's profile information above the post

Post by Eman and Kou on February 10th 2013, 10:44 pm

Alright so if I put the profile picture/rank tags within that div tag set it would be above the post? Or would I have to put it above it?

Eman and Kou
Forumember

Male Posts : 367
Reputation : 6
Language : English, Spanish, Japanese, Female, HTML, CSS (working on it), GFX (Working on it)
Location : Somewhere where santa cant find me

http://ninja-generation.rpg-dynasty.com/index.htm

Back to top Go down

Solved Re: Placing the user's profile information above the post

Post by Eman and Kou on February 10th 2013, 11:05 pm

Nice, alright so that worked, however the forumotion one is still there.

http://sao-mcinc.rpg-boards.com/t13-vanto-wip

So how would we go about removing the one on the left so instead of having 2 profile bars, it would just be the on the top and then you'd have the post right below it.

Eman and Kou
Forumember

Male Posts : 367
Reputation : 6
Language : English, Spanish, Japanese, Female, HTML, CSS (working on it), GFX (Working on it)
Location : Somewhere where santa cant find me

http://ninja-generation.rpg-dynasty.com/index.htm

Back to top Go down

Solved Re: Placing the user's profile information above the post

Post by Eman and Kou on February 10th 2013, 11:24 pm

Alright got everything moved, one last problem then this is solved, the black bar is still there. Like I have everything moved atm but it's still there so i'm guessing one of the placeholder styles in the tags is what's keeping there. So which one of them is it?

Eman and Kou
Forumember

Male Posts : 367
Reputation : 6
Language : English, Spanish, Japanese, Female, HTML, CSS (working on it), GFX (Working on it)
Location : Somewhere where santa cant find me

http://ninja-generation.rpg-dynasty.com/index.htm

Back to top Go down

Solved Re: Placing the user's profile information above the post

Post by Eman and Kou on February 10th 2013, 11:41 pm

Here you go:

Eman and Kou
Forumember

Male Posts : 367
Reputation : 6
Language : English, Spanish, Japanese, Female, HTML, CSS (working on it), GFX (Working on it)
Location : Somewhere where santa cant find me

http://ninja-generation.rpg-dynasty.com/index.htm

Back to top Go down

Solved Re: Placing the user's profile information above the post

Post by Eman and Kou on February 10th 2013, 11:44 pm

Done

Eman and Kou
Forumember

Male Posts : 367
Reputation : 6
Language : English, Spanish, Japanese, Female, HTML, CSS (working on it), GFX (Working on it)
Location : Somewhere where santa cant find me

http://ninja-generation.rpg-dynasty.com/index.htm

Back to top Go down

Solved Re: Placing the user's profile information above the post

Post by Eman and Kou on February 11th 2013, 4:42 am

Wait what do you mean I didn't remove them? I got rid of the original stuff awhile back when I edited the code, and wouldn't that thing that you posted only work on phpbb2? They don't seem to have a punbb code.

Eman and Kou
Forumember

Male Posts : 367
Reputation : 6
Language : English, Spanish, Japanese, Female, HTML, CSS (working on it), GFX (Working on it)
Location : Somewhere where santa cant find me

http://ninja-generation.rpg-dynasty.com/index.htm

Back to top Go down

Solved Re: Placing the user's profile information above the post

Post by Eman and Kou on February 11th 2013, 4:50 pm

Oh right forgot to save the template changes so it shows up to normal users, look now.

Eman and Kou
Forumember

Male Posts : 367
Reputation : 6
Language : English, Spanish, Japanese, Female, HTML, CSS (working on it), GFX (Working on it)
Location : Somewhere where santa cant find me

http://ninja-generation.rpg-dynasty.com/index.htm

Back to top Go down

Solved Re: Placing the user's profile information above the post

Post by Eman and Kou on February 12th 2013, 8:50 pm

Bump

Eman and Kou
Forumember

Male Posts : 367
Reputation : 6
Language : English, Spanish, Japanese, Female, HTML, CSS (working on it), GFX (Working on it)
Location : Somewhere where santa cant find me

http://ninja-generation.rpg-dynasty.com/index.htm

Back to top Go down

Solved Re: Placing the user's profile information above the post

Post by Eman and Kou on February 12th 2013, 11:28 pm

Yes! Thanks man that's perfect, solved!

Topic Solved

Always wanted to do that Very Happy Razz

Eman and Kou
Forumember

Male Posts : 367
Reputation : 6
Language : English, Spanish, Japanese, Female, HTML, CSS (working on it), GFX (Working on it)
Location : Somewhere where santa cant find me

http://ninja-generation.rpg-dynasty.com/index.htm

Back to top Go down

View previous topic View next topic Back to top


 
Permissions in this forum:
You cannot reply to topics in this forum