Resource icon

XF 2 Tip Postbit Background Custom Fields

huseynalieff

Member
Registered
Joined
Jul 15, 2019
Messages
21
Points
13

Reputation:

@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

GamerzHacking
Registered
Joined
Feb 3, 2019
Messages
28
Points
23

Reputation:

Extra.less

CSS:
.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;
}
 

Xcoderzx

Advance Analysis
Registered
Joined
May 3, 2020
Messages
43
Points
18

Reputation:

I already followed but nothing happen
 

Xcoderzx

Advance Analysis
Registered
Joined
May 3, 2020
Messages
43
Points
18

Reputation:

IMG_20200505_011502.jpg




IMG_20200505_011513.jpg
 

dark_night

Well-known member
Registered
Joined
Jul 28, 2020
Messages
149
Points
53

Reputation:

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

Moderator
Staff member
Moderator
+Lifetime VIP+
V.I.P Member
Collaborate
Registered
Joined
Nov 20, 2019
Messages
361
Points
103

Reputation:

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

Member
Registered
Joined
Jul 17, 2020
Messages
18
Points
3

Reputation:

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.
 

dark_night

Well-known member
Registered
Joined
Jul 28, 2020
Messages
149
Points
53

Reputation:

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

Member
Registered
Joined
Jul 17, 2020
Messages
18
Points
3

Reputation:

@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

Collaborate
Collaborate
Registered
Joined
Aug 9, 2020
Messages
169
Points
73

Reputation:

@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

Well-known member
Registered
Joined
Jul 28, 2020
Messages
149
Points
53

Reputation:

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

Jace

Collaborate
Collaborate
Registered
Joined
Aug 9, 2020
Messages
169
Points
73

Reputation:

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

dark_night

Well-known member
Registered
Joined
Jul 28, 2020
Messages
149
Points
53

Reputation:

@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

New member
Registered
Joined
Sep 23, 2020
Messages
1
Points
13

Reputation:

Is there a way to auto resize the image linked?
 

valid

+Lifetime VIP+
+Lifetime VIP+
V.I.P Member
Registered
Joined
Apr 3, 2020
Messages
188
Points
53

Reputation:

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>
 
Top