Custom user background image uploads?

[samborabora]

A page that users could goto that has an upload box for them to upload their own .jpg/png/gif as a forum background (specify max filesize), can be disabled on mobile themes, can override theme css variants and has a remove background option in case you want to delete the iamge and revert to the forum defaults. Also preferably can have a variable, i.e: !empty($user['custom_background']) then the forum owner can show or hide any theme variant choosers they may have installed, or display custom text or whatever.

Any takers? 

[samborabora]

Anyone have any ideas about doing a mod like this? I think it woudl just require an upload script/page and a tweak to the css file to accept a dynamic image IF it's available.

[Suki]

Is not as easy as you might think it is, I implemented something similar to one of my mods and its everything but easy.

Just so you can have an idea on the amount of work this would require:

https://github.com/MissAllSunday/Breeze/blob/develop/Sources/Breeze/BreezeUser.php#L564
https://github.com/MissAllSunday/Breeze/blob/develop/Sources/Breeze/BreezeAjax.php#L631

And all this code do is setting a background url for each user's wall page.

[samborabora]

Well, could it be done, say, having a second stylesheet that could have an overridding background-image definition, each users image could be stored with a filename related to the usernumber, and then the stylesheet dynamically calls, say, themes/theme/bgimgs/user144bgimg.jpg, if the user has never defined or has removed their background iamge, it wouldn't load since it has never existed or was deleted by the server, and if so, it would override the current background with the stylesheet?

[Suki]

Yeah but it really depends on the theme you are using.

The simplest way of doing it would be printing some small in-line css adding the user ID, something like:

https://github.com/MissAllSunday/Breeze/blob/develop/Sources/Breeze/BreezeUser.php#L109

Of course you will have to let php to check if the file exists before doing it, on those cases simply let the css handle it or provide a fallback background image

[samborabora]

Yeah but it really depends on the theme you are using.

The simplest way of doing it would be printing some small in-line css adding the user ID, something like:

https://github.com/MissAllSunday/Breeze/blob/develop/Sources/Breeze/BreezeUser.php#L109

Of course you will have to let php to check if the file exists before doing it, on those cases simply let the css handle it or provide a fallback background image

Exactly, and the fallback background could just be whatever default the theme uses. I would imagine it would be easiest to implement as a single page action, not integrated into the profile page or anything, just a standalone thing.

[Suki]

no no no, the css thing its a fairly easy thing to do, uploading an image, store it and then use it its another entire matter altogether, not an easy task to do.

[samborabora]

no no no, the css thing its a fairly easy thing to do, uploading an image, store it and then use it its another entire matter altogether, not an easy task to do.

Yeah, I'm wondering what kind of price this would command if it were a paid request?

[Gluz]

Wouldn't be easy to use a custom profile field and let the user to specify an URL to the image they want as background instead of upload the image?

[samborabora]

Wouldn't be easy to use a custom profile field and let the user to specify an URL to the image they want as background instead of upload the image?

Yeah, that would work too. How about both options? That way if the URL goes down the background still works for the user.

[samborabora]

So, what would the basic method of doing this be?

[Gluz]

... uploading an image, store it and then use it its another entire matter altogether, not an easy task to do.

As Suki said, if you want it to be able to upload images to the server, then it's not that easy, so, if you really want that feature, you probably need to hire someone to code the MOD in that way.

That's why I suggest to use just an URL instead of upload an image, that would be much easy to do.

[samborabora]

... uploading an image, store it and then use it its another entire matter altogether, not an easy task to do.

As Suki said, if you want it to be able to upload images to the server, then it's not that easy, so, if you really want that feature, you probably need to hire someone to code the MOD in that way.

That's why I suggest to use just an URL instead of upload an image, that would be much easy to do.

Okay, it would be great to do this with an URL then, if that's easier, any ideas where to start?

[Gluz]

This was in the Spanish section as a TIP/TRICK, I just modified a little bit.

For that, just start creating a Custom Profile Field in:
index.php?action=admin;area=featuresettings;sa=profileedit

-Name: fbg. Save and then edit and change to Background.
-Description: Image URL for a Custom Forum Background.
-Profile Section: Look and Layout.
-Show on Registration: No.
-Show on Topic View: No (unthicked).
-File Type: Text.
-Max Lenght: 255.
-Alow BBC: No (unthicked).
-Input Mask: Regular Expression.
-Mask: ([^\s]+(\.(?i)(jpg|png|gif|bmp))$)
-Privacy: Users cannot see this field; owner and admins can edit it.
-Serchable: No (unthicked).
-Active: Yes (thicked).

Then the users can add the direct link to an image when edit Look and Layout in their profiles.

The code to make this works should be added in /Themes/yourtheme/index.template.php, search for :

Code Select Expand

// Output any remaining HTML headers. (from mods, maybe?)

and add before:

Code Select Expand


// Custom Background from URL in Custom Profile Field
loadMemberData($context['user']['id']);
if (!empty($options['cust_fbg']))
echo '
<style>body {
background-image: url("', $options['cust_fbg'],'");
background-repeat: repeat;
background-position: 50% 50%;
}</style>';


And that would be all, I actually have it in my site but not tell the users yet