Profile Cover Image plugin [AVAILABLE NOW]

[Nathan Lecompte]

Hey all,
I've got another idea for a plug-in, a feature which enables users to add a cover image to their profile page. Users are able to upload an image from their computers, choose one from the cover gallery (already available images like the preset profile pictures). Here's an example: www.oxwall.org/store/item/483

This would be a great plug-in, 
Thanks!

PS: It's not on purpose that most of my plug-in requests are mainly Oxwall plug-ins.

[Nathan Lecompte]

Bump.

[Nathan Lecompte]

Bump.

[Wormopolis]

upload in image to where? are you talking about linking an image already loaded on photobucket or imageshack?

[Nathan Lecompte]

I was thinking of allowing them to select pre-installed images (from URL) or allow them to upload an image and store it via a secondary host of some sort, if thats possible (Here's a plug-in which does this: www.proboards.com/library/plugins/item/148).

[Wormopolis]

the "upload an image" part is what throws a wrench. you have to have storage on the web for that kind of stuff. a plugin doesnt provide the capability to store files. the plugin you linked to is just an interface to an already existing storage site. similar to image shack or photobucket, however the person who wrote the plugin (and subsequently hasnt provided support for since submitting it) provided the conduit for it.

now if you want to provide some default image URLs or give them the ability to link there own already hosted image - totally doable.

can you post a screenshot of what the end result would look like?

[Nathan Lecompte]

That's fine.

As mentioned in my post, this site shows a pretty nice idea of what it could look like: www.oxwall.org/store/item/483 (just click on the big image to the left)

If you want more detail I can make a design brief with measurements etc.

[Wormopolis]

well the example leads me to believe you are after basically what the top of a facebook profile looks like? if storage of multiple default images isnt a priority, ther emight be a way to pull this off with a custom field entry and a template mod.

[Nathan Lecompte]

Ok, I've made a little template for my forum profile with some basic example images. Now I just need to find a way to allow the user to change their profile cover, does anyone know how to do so?

BTW if you want I can post the code for it .




PS: It's not published on my forum YET...I'll post when done. Forum: techviewhd.freeforums.net/

[Nathan Lecompte]

Ok, so I've added the cover to my forum: techviewhd.freeforums.net/user/1

[Nathan Lecompte]

jrryan I'll post the code when the cover is changeable .

Wormopolis Not sure if you'd call this a plug-in or theme, but that doesn't matter. Do you know how to let the user change the cover using custom profile fields, I'm not too sure on how to do so.

[Alisha]

Nathan Lecompte, I can help you with this.

Replace your div with this:
<div style="height: 145px;border-bottom: 5px solid #eeeeee;{foreach $[user.mini_custom_field]}{if $[user.mini_custom_field.name] == "Cover Photo"}background-image: url('$[user.mini_custom_field.value]');{/if}{/foreach};opacity: 0.9;background-position: center;background-size:cover;">

Your custom field would be named "Cover Photo".

Also, I thought I'd mention that the profile(and all other forum content) appears to be cut off for guests. This is because you have a margin-top of -57px. Change this to 15px and it should solve the issue.

[Wormopolis]

sorry something came up in my personal life and I havent been able to do any writing. I was going to come back to this but I have just been overwhelmed lately.

[Nathan Lecompte]

Wormopolis That's absolutely fine, you don't need to worry about this. You should take some time off. I'm sure everybody here at Proboards will support you. (no pun intended)





Alisha Thanks! I'll post the code for this when ready.
If you have Adblock it usually blocks off one of the div's up top (just disable Adblock on the forum for it to work), if it still occurs then I'll fix it.

[Nathan Lecompte]

Alisha The code doesn't seem to be working, I fixed it up a bit but still no luck:
<div style="height: 145px;border-bottom: 5px solid #eeeeee;{foreach $[user.mini_custom_field]}{if $[user.mini_custom_field.name] == 'Cover Photo'} background-image: url('$[user.mini_custom_field.value]');{/if}{/foreach};opacity: 0.9;background-position: center;background-size:cover;">

I added the custom profile field, set it to Text Field type and tried all acceptable values.