View Full Version : Profile Enhancements - Profile Page Banner
blind-eddie
03-20-2014, 11:00 PM
Changeable Member Profile Page Banner
Description: Your members can add a banner above their Profile page.
================================================== ===
Demo: http://nacc.club/member.php?u=1
The demo is a 3.8 test site but it will look the same in 4.2
Music will play in profile, please adjust volume before clicking.
================================================== ===
Step One:
You will need to make a new User Profile Field.
Admincp/User Profile Fields/Add New User Profile Field
Single-Line Text Box
Title: Add a banner above your profile
Description: Please add your Image URL
(Example: http://nacc.club/imagehosting/14f7bd890a86c3.jpg)
Field Required: No
Field Editable by User: Yes
Display Page: Edit Profile
Save it Remember the field ID number, you will need it later.
================================================== ===
Step Two:
You will need to edit your MEMBERINO template.
(MAKE A BACKUP OF ANY TEMPLATE YOU EDIT BEFORE YOU EDIT IT, YOU MAY NEED IT IF YOU MAKE A MISTAKE.)
Find:
{vb:raw navbar}
Add below:
<div align=center><vb:if condition="$userinfo['fieldxx']"><td class="vbmenu_option"><img src="{vb:raw userinfo.fieldxx}" width="600" height="150"></td></tr> </vb:if></div>
Note: Change the xx in fieldxx to the profile field you created.
================================================== ===
As you see, I set the default Image size allowed to 600 x 150.
Any image a member adds will show image at that size.
Adjust these numbers to suit your needs or remove "width="600" height="150" to allow your members to add any size image.
https://vborg.vbsupport.ru/external/2014/03/25.png
================================================== ===
Step Four: Inform your Members...Enjoy
================================================== ===
================================================== ==
ADDON: Added wired1's extra profile pages addon ( marked reusable) to show the banner profile field to its own page and added <vb:else /> if conditionals to only show the page contents to select usergroups by adding usergroup id's to the top of the new pbanner template (info included in zip)
To Upgrade:
Click Install & download the zip file.
Import the product-be1_pbpfp.xml
Edit the admincp/profilefield.php file
Edit the USERCP_SHELL template
Edit the pbanner template to add usergroup id's to wat to allow access to the page
After you do the addon steps, go into your profile field manager, click edit to the right of Profile Banner. Scroll to the bottom of that page to the Display Page, click the dropdown and select, Option: Profile Banner Options... Done
https://vborg.vbsupport.ru/external/2014/03/26.png
https://vborg.vbsupport.ru/external/2014/03/27.png
================================================== ==
Happy Editing!!
Added 3rd party Image Upload and Resize script.
fleshy66
03-21-2014, 01:32 PM
On the demo site,
Sorry. The administrator has banned your IP address. To contact the administrator click here
blind-eddie
03-21-2014, 01:35 PM
Try again please.
faisaly.com
03-21-2014, 08:04 PM
If this is a banner why would it play music? never mind I see now that the profile link worked... It was your youtube player!
blind-eddie
03-21-2014, 10:53 PM
Via pm, I am ask how to only allow select usergroups access to use this.
vbulletin does not have an option to set permissions on profile fields that I am aware of.
The only way to allow this to be used by select usergroups is....
ACP/User Profile Fields/Profile banner, click edit.
Look for Private Field, select yes. Save.
Now, ACP/Usergroups/Usergroup Manager.
In all your active Usergroups , Select Edit Usergroup.
Scroll to the General Permissions section
.
Check No for all usergroups you do not want to see private profile fields.
They will see the banner image on the profile page of those allowed to see private profile fields.
Bowlsworld
03-23-2014, 02:05 PM
IP banned also mate, looks very interesting, would it clash with vBSocial Profile mods?
blind-eddie
03-23-2014, 02:19 PM
All banned ips are now removed, sorry.
Try again please.
I do not use vBSocial Profile mods but, I do not think it will effect it.
Alibass
03-23-2014, 04:31 PM
Via pm, I am ask how to only allow select usergroups access to use this.
vbulletin does not have an option to set permissions on profile fields that I am aware of.
The only way to allow this to be used by select usergroups is....
ACP/User Profile Fields/Profile banner, click edit.
Look for Private Field, select yes. Save.
Now, ACP/Usergroups/Usergroup Manager.
In all your active Usergroups , Select Edit Usergroup.
Scroll to the General Permissions section
.
Check No for all usergroups you do not want to see private profile fields.
They will see the banner image on the profile page of those allowed to see private profile fields.
I've tried this but it still shows in usercp/settings/edit profile for the usergroup I want to deny this privileged to.
blind-eddie
03-23-2014, 05:25 PM
I can add a plugin to add the profile banner profile field to its own page with if conditionals to hide the page to add the image link for the banner but still allow the members to see each other Profile page banners.
Would this work for you?
Alibass
03-23-2014, 05:33 PM
Yes, that would be great. :D:up:
blind-eddie
03-23-2014, 08:08 PM
Added, click Installed to receive update.
Alibass
03-23-2014, 08:23 PM
@blind-eddie
Your zip folder shows to be empty after download.
blind-eddie
03-23-2014, 08:45 PM
Shows it has what it needs to have in it when I download
Alibass
03-23-2014, 08:51 PM
I've downloaded it 3 times now......... it's empty........ look at your download counter it still shows 0 downloads.
blind-eddie
03-23-2014, 09:01 PM
The counter does not update immediately. I checked the zip file & it had what I put in it.
I re-uploaded it again and it still has what I put in it.
Please try again.
Edit: I downloaded it in 3 different browsers, each download contained the items I added to it.
Alibass
03-23-2014, 09:38 PM
Mate I have downloaded it with FF, Chrome and IE and I still get the same error message when I try to unzip the file. See attach
ozzy47
03-23-2014, 09:46 PM
What zipping program are you using, I just unzipped it with no issues.
Alibass
03-23-2014, 10:02 PM
Zip program is whatever came with Windows 7 Pro. I've even tried 7_zip
nothing works. In my usercp it doesn't even show I've downloaded the file. I've downloaded files here since 07 and for the last 1.5 years using this same zip program I'm using now and I have never had a issues with any file from vB.org before. I just tried a download from another mod and it unzips fine.
The problem is not on my end.....
ozzy47
03-23-2014, 10:04 PM
That is strange, try this one, I rezipped it.
Edit: Removed the zip.
Alibass
03-23-2014, 10:07 PM
That is strange, try this one, I rezipped it.
That works just fine....... thank you :)
ozzy47
03-23-2014, 10:09 PM
Excellent, I am going to remove it now. :)
Mr_Running
03-23-2014, 11:25 PM
What zipping program are you using, I just unzipped it with no issues.
Not Un-zipping with Winzip for me...
Cannot open file pbanner.zip It does not appear to be a valid archive.
blind-eddie
03-23-2014, 11:26 PM
hmmm... one sec
blind-eddie
03-24-2014, 12:03 AM
Ok. Try again please. Not sure why/how my rar file was switched to a zip file... I think that was the issue.
I used my zip program instead & re-added the file.
Alibass
03-24-2014, 12:48 AM
Works now for me...........
blind-eddie
03-24-2014, 12:50 AM
Cool, good to hear.
Mr_Running
03-24-2014, 01:10 AM
Okay, perhaps I missed something but I can't seem to find the pbanner template.
blind-eddie
03-24-2014, 01:29 AM
it was created during the product install.
Mr_Running
03-24-2014, 02:00 AM
Re-installed... now can view it :) Thanks!
Alibass
03-24-2014, 04:47 AM
Installed... and thanks Blind-Eddie
Nice mod, I recommend it to all, works as advertised. :):up:
DemOnstar
03-24-2014, 05:44 AM
Good idea blind eddie, this will provide instant, satisfying feedback to any user.
Always good to see development on 4.2.1.
mohammad6006
03-24-2014, 01:18 PM
how can i change banner size like facebook cover?
blind-eddie
03-24-2014, 01:47 PM
Facebook cover?
As stated in first post:
As you see, I set the default Image size allowed to 600 x 150.
Any image a member adds will show image at that size.
Adjust these numbers to suit your needs or remove "width="600" height="150" to allow your members to add any size image.
<div align=center><vb:if condition="$userinfo['fieldxx']"><td class="vbmenu_option"><img src="{vb:raw userinfo.fieldxx}" width="600" height="150"></td></tr> </vb:if></div>
Mr_Running
03-24-2014, 04:26 PM
Again I just want to say thanks blind-eddie :)
@ mohammad6006
facebook cover is ...851 pixels wide and 315 pixels tall. If you upload an image that's smaller than these dimensions, it will be stretched to this larger size.
<div align=center><vb:if condition="$userinfo['fieldxx']"><td class="vbmenu_option"><img src="{vb:raw userinfo.fieldxx}" width="851" height="315"></td></tr> </vb:if></div>
I did 950 pixels wide and 150 pixels tall...but then again I'm still sorting out how I would like it!
<div align=center><vb:if condition="$userinfo['fieldxx']"><td class="vbmenu_option"><img src="{vb:raw userinfo.fieldxx}" width="950" height="150"></td></tr> </vb:if></div>
If you upload an image that's smaller than these dimensions, it will be stretched to this larger size.
mohammad6006
03-24-2014, 04:56 PM
Again I just want to say thanks blind-eddie :)
@ mohammad6006
facebook cover is ...851 pixels wide and 315 pixels tall. If you upload an image that's smaller than these dimensions, it will be stretched to this larger size.
<div align=center><vb:if condition="$userinfo['fieldxx']"><td class="vbmenu_option"><img src="{vb:raw userinfo.fieldxx}" width="851" height="315"></td></tr> </vb:if></div>
I did 950 pixels wide and 150 pixels tall...but then again I'm still sorting out how I would like it!
<div align=center><vb:if condition="$userinfo['fieldxx']"><td class="vbmenu_option"><img src="{vb:raw userinfo.fieldxx}" width="950" height="150"></td></tr> </vb:if></div>
If you upload an image that's smaller than these dimensions, it will be stretched to this larger size.
thank you very much
i add style
style="max-height: 350px; max-width: 75%;"
blind-eddie
03-24-2014, 05:39 PM
You could use, width="75%" height="auto" which shows same results as your edit on my test board.
The only issue I see having with any of the edits is the size of the image.
Example random banner image from the net:
http://shipritestore.com/wp-content/uploads/2010/11/Signs-Banners.jpg
This image is 1664 x 312 and 1941264 bytes (HUGE)
Using style="max-height: 350px; max-width: 75% or width="75%" height="auto will drop the image to 1165 x 218 (Fluid Style)but it will still remain 1941264 bytes (HUGE)
I could add image guidelines & add image resizer link on the profile field page so members will know what size their image needs to be.
Mr_Running
03-24-2014, 05:54 PM
FYI
My image guidelines when filling out the User Profile Field Description
Please add your Image URL ...for best results Banner photos are xxx pixels wide and xxx pixels tall. If image is smaller than these dimensions, it will be stretched to this larger size...sometimes this will give you a cool image.
blind-eddie
03-26-2014, 04:49 PM
I added image resizing to specific dimension's and image upload on the pbanner page.
https://vborg.vbsupport.ru/
I will share my edit later tonight.
Mr_Running
03-29-2014, 02:44 AM
Cool! :)
Upload-Resize Host
Image on post #43
Notes:
neider ...I think it should read...neither ;)
Upload-Resize Host ...will that be hosted on our own servers?
coolhula
06-20-2014, 11:34 AM
nvm this
LuisUrquilla
09-02-2014, 05:08 PM
I added image resizing to specific dimension's and image upload on the pbanner page.
http://blind-eddie.com/forum/imagehosting/153350072c13f4.png
I will share my edit later tonight.
I was looking at this mod and wishing "if members could just upload the image file instead of placing an html link.." then decided to check out the latest post and BOOM!! Will be adding this mod to a paid modification I'm working on to give my profile pages a feel similar to FB.
Thanks Blind Eddie!!
LuisUrquilla
09-14-2014, 07:19 PM
Why am I not seeing the upload option when I installed this mod?
blind-eddie
09-18-2014, 01:35 PM
I had to reinstall my 4.2.2 site this morning and added this modification as well as the image upload... I will upload it here later today.
LuisUrquilla
09-27-2014, 05:18 PM
I will upload it here later today. Hi Eddie, can you please upload the latest update? I imagine with the re-installation of your site you must be it would be greatly appreciate it if you could just take a few moments to update your download file.
Thank you!!
LuisUrquilla
10-02-2014, 04:48 PM
I will upload it here later today. hi Blind-Eddie, will you be able to upload your new edit with upload fields any time soon? I went ahead with paid dev services driven by your mod then realized the version available is not the one with the upload field.
We PM each other back at the beginning of Sept, you said you would upload the file shortly after but I'm still waiting.
Thank you.
LuisUrquilla
10-06-2014, 04:01 AM
Hello…. anyone there?
LuisUrquilla
10-08-2014, 06:38 AM
Mr Blind-Eddie, are you ever coming back to update this plugin?
tbworld
10-09-2014, 08:03 PM
Please give him some time, he was in an accident recently and is still recovering, I believe. :)
LuisUrquilla
10-13-2014, 02:03 PM
Please give him some time, he was in an accident recently and is still recovering, I believe. :)
Oh, seriously? My apologies.
Thanks for letting me know.
MySaltyreef
12-09-2015, 07:32 AM
is this a graveyard hack ? or does it work anyone know ? i can't seem to find anything similar
blind-eddie
12-09-2015, 08:11 PM
It works... There is a "Like Facebook" addon here. Search above....
I.G.O.T.A.
12-11-2015, 03:44 PM
I can't seem to get the image resizer to work. What could I be missing? You it upload and then get error or don't see resize.
madzat
02-08-2016, 10:31 PM
Same here
Sorry. The administrator has banned your IP address. To contact the administrator click here
and the Image Verification to Contact you it have error
blind-eddie
02-09-2016, 12:07 AM
Same here
Sorry. The administrator has banned your IP address. To contact the administrator click here
and the Image Verification to Contact you it have error
Sorry, use this link. Yes, I know its a 3.8 site, it show the same on 4.2
http://northamericancarclub.com/member.php?u=1
blind-eddie
02-09-2016, 12:08 AM
I can't seem to get the image resizer to work. What could I be missing? You it upload and then get error or don't see resize.
Did you get this to work for you?
Elixar
06-13-2016, 11:43 PM
I added an image link but it just shows a white empty box.
blind-eddie
06-14-2016, 01:33 AM
Not sure how to reply to your post, works fine for me.
Elixar
06-14-2016, 01:41 AM
Not sure how to reply to your post, works fine for me.
Would you like to take a look?
blind-eddie
06-14-2016, 01:47 AM
Sure, set me up an account please
Elixar
06-14-2016, 01:50 AM
Sure, set me up an account please
Sure thing, setting it up now.
angeljs
06-18-2016, 12:44 PM
Can members make their banner link to their website, or is it just the image itself?
blind-eddie
06-19-2016, 02:18 PM
No, sorry, it just shows the image. But I will a bit of work it can be made to be a clickable banner.
blind-eddie
09-13-2016, 12:31 AM
Sorry, permissions set. Please try again.
blind-eddie
09-13-2016, 01:14 AM
No, it does not override the site banner, i set mine that way.
blind-eddie
09-13-2016, 08:50 AM
This allows members to add a banner just below the navbar. I don't have mine set that way, so no screenshot is available.
HM666
01-14-2018, 08:22 AM
Hey Eddie, is there any way that this can be made to only allow certain usergroups have a banner on their profile page and put one up?
Hey Eddie, is there any way that this can be made to only allow certain usergroups have a banner on their profile page and put one up?
I believe you can set the usergroup permission for any user field.
----
@blind-eddie
This is not a bad product, but it's pretty rough. We need something a lot more responsive and eye candy.
IPB has a very good class for profile banner
<div class="ipsCoverPhoto_container">
Could you look into it and implement something similar?
HM666
03-26-2018, 07:17 PM
I believe you can set the usergroup permission for any user field.
Where are you seeing that? You cannot set usergroup permissions in my profile fields.
tinuz
07-09-2018, 04:22 PM
thank you for this nice mod!! is it possible to get a preview of the banner before saving the changes and/or a preview from the banner in use?
blind-eddie
07-10-2018, 06:46 AM
No sorry, not at this time.
tinuz
07-10-2018, 09:43 AM
ok, thanks for your reply.... at the moment i'm working on another project on my forum but in between things i will try to take a look at it myself. i've been testing some things and it resulted in a display of broken an image.... i also made some changes to the pbanner page itself ... added some instructions how it works and stuff like that ;)
vBulletin® v3.8.12 by vBS, Copyright ©2000-2025, vBulletin Solutions Inc.