How to hide extra user info in Xenforo

Today we are going to discuss how to hide users extra information sim1in posts. What am I talking about you ask? It looks like this:

So how can we accomplish this you ask? Well we add some CSS to our EXTRA.CSS page in our template modifications section.

So let’s log into our Admin Panel and then navigate to Appearance -> Templates -> Extra.css 

It looks like this:

sim

Click on it and you will see this page:

sim2

So after all of your extra code that you have add the following lines of code:

.messageUserBlock .extraUserInfo
{
    opacity: 0;
    max-height: 0px;
    overflow: hidden;
    transition: all 0.5s ease-in-out;
}

.messageUserInfo:hover .extraUserInfo
{
    opacity: 1;
    max-height: 300px;
}

<xen:if is="@enableResponsive">
@media (max-width:@maxResponsiveWideWidth)
{
    html .messageUserBlock .extraUserInfo
    {
        opacity: 1;
        height: auto;
        transition: none;
    }
    .messageUserInfo:hover .extraUserInfo
    {
        height: auto;
    }
 
}
</xen:if>

 

It will look like this in your box:

sim3

now click Save Changes and it should save for you. Now if you test it go to a thread and mouse over someones card and you will see it drop down. Here is before:

sim4

Here is after mouse over:

sim5

There you have it!

If you have further questions please feel free to ask away!

Looking for quality XenForo hosting? Check out Arvixe Web Solutions

Tags: , , , , , , , | Posted under XenForo | RSS 2.0

Author Spotlight

Keith Pottratz

Hello My Name is Keith Pottratz. I have been working with computers for over a decade. It's my personal hobby something that I love and enjoy doing. I went to school for Computer Science, and have spent many years self teaching my self various things. I have ton's of experience in HTML,CSS, PHPBB,CPanel,CMS software, blogging software and various other systems and enviroments. My favorite thing to do though is backend developing. I find it to be a growing and ever evolving beast and I love learning about it. I look forward to giving as much knowledge as I can and help.

Leave a Reply

Your email address will not be published. Required fields are marked *