XF 2 Tip Postbit Background Custom Fields

[prvtzone]

@huseynalieff btw what values did you used in margin-right and margin-left?

 

[huseynalieff]

@prvtzone Yes of course.
.post-stat {
flex: 0 1 50%;
margin-left: 16px;
}
and
.justify-content-center {
justify-content: center;
margin-right: 38px;
padding-left: 47px;
}
however, the numbers become irregular when they are such a single digit. No more than waiting for the code owner's comment

 

[nelson ortiz]

Extra.less

.post-stat {
    flex: 0 1 50%;
}

.post-stats .post-stat:first-child {
    flex: 0 1 49%;
    border-right: 1px solid #333;
}

.justify-content-center {
    justify-content: center;
}

.align-items-center {
    align-items: center;
}
.d-flex {
    display: flex;
}
.post-stats {
    padding-top: 15px;
}
.flex-wrap {
    flex-wrap: wrap;
}
.d-flex {
    position: relative;
    display: flex !important;
}

 

[PCScrub]

Verss submitted a new resource:

Postbit Background Custom Fields - template modification



Read more about this resource...

Verss

good tut many thanks!

 

[Xcoderzx]

I already followed but nothing happen

 

[Xcoderzx]

 

[DarKangeL133]

Thanks for this bro

 

[dark_night]

Anyone know if this still is working? I attempted it but looks like the background goes above the users avatar. Im not sure if it needs updating or if its a little outdated.

 

[Pr0fesseur]

I suggest you test it with the default xenforo style first and determine if its your style that is interfering or some setting that you need to play with.. this should work as intended

 

[TurtleDoveWubby]

It works, however like @Pr0fesseur said, custom styles override the custom user field settings and postbit CSS. It still works, but it needed a few tweaks and some extra code.

Default works fine though.

 

[Jace]

Its work fine, you just need extra code to make it suits to ur theme

 

[dark_night]

yeah, seems as if so. not sure what is wrong with iO dark and compatibility with the code, but i've tried a ton of new edits and still couldn't find a way to adjust the width/height, send it to the back of the avatar/username, and the message cell avatar and username becomes unclickable due to the background in the way.

did u have any problems with any of the things i mentioned and u were able to find a way around it? appreciate it bro

 

[TurtleDoveWubby]

@popwoo Try inspect element and find the code responsible for messing up the postbit background. Change it and make note of the changes. Download your .xml and have a search through it, chances are, it'll be in there.

 

[Jace]

@popwoo thats because the position of the div element isnt set yet, add the css for the avatar and name with position: relative;

 

[dark_night]

@Kei worked prefectly. thank you

 

[dark_night]

@Kei is there a way to limit the image size? i can imagine users spamming 5000x5000 backgrounds. wouldnt that be a issue?

 

[Jace]

@popwoo if the height and width already set by css shouldnt be a problem, the problem is loading the image

 

[dark_night]

@Kei yeah, this question is more about loading times than height and width as its set perfectly now with ur suggestion and a few other background properties.

 

[michi]

Is there a way to auto resize the image linked?

 

[valid]

The code from the original poster is wrong. That's why I couldn't get the background image shown as expected.

<div class="postbit_background" style="background-image: url({$user.Profile.custom_fields.YourFieldID});"></div>

should be changed to:

<div class="postbit_background" style="background-image: url({$xf.visitor.Profile.custom_fields.YourFieldID});"></div>