The forum of the forums
Would you like to react to this message? Create an account in a few clicks or log in to continue.

user profile background image help

2 posters

Go down

Solved user profile background image help

Post by dodler-foddler October 3rd 2015, 3:05 am

I'm trying to find a way for users to get enable their own specific profile background image.

I'm trying to use the js code from here as part of it. But that js requires someone else to edit it and set it for them, and I want them to be able to do it themselves.

So far what I tried to do was make a new text field in all profiles that lets the paste the url into the textfield. But after that I don't know? Anyone here have any ideas that could help me with this?
dodler-foddler
dodler-foddler
New Member

Male Posts : 17
Reputation : 1
Language : english

http://freneticgaming.forumotion.com

Back to top Go down

Solved Re: user profile background image help

Post by Ange Tuteur October 3rd 2015, 12:24 pm

Hi @dodler-foddler,

The idea you have can work perfectly with a bit of JavaScript. Go to Modules > JavaScript codes management and create a new script with the following settings :

Placement : In all the pages
Code:
/\/u\d+/.test(window.location.href) && $(function() {
  var field_id = 257,
      background = document.getElementById('field_id-' + field_id);

  if (background) {
    document.body.style.backgroundImage = 'url(' + $(background.lastChild).text() + ')';
  }
});

That will get the text of specified field, however, it doesn't have the id of your field.

See where the variable field_id is ? You need to replace 257 by the ID of your profile field. To find the id, create another script in all the pages with this as the content :
Code:
/\/u\d+/.test(window.location.href) && $(function() {
  $('#profile-tab-field-profil dl').click(function() {
    alert(this.id);
  });
});

Then go to your profile and click on the profile field that you want to get the id from. It'll display it in a popup box :
user profile background image help Captur89

Then just replace 257 in the previous script by the number at the end in the popup box. ( 14 in the example ) After you get the id you needed you can delete this script.
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13207
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania

https://fmdesign.forumotion.com

Back to top Go down

Solved Re: user profile background image help

Post by dodler-foddler October 3rd 2015, 2:15 pm

Spoiler:

while it definitely looks like it should work, it didn't, which made me scratch my head even more. the second js to find the field_id didn't work, but i already new the specific field id i needed, from trying to make my own scripts work (and failing miserably). beu
dodler-foddler
dodler-foddler
New Member

Male Posts : 17
Reputation : 1
Language : english

http://freneticgaming.forumotion.com

Back to top Go down

Solved Re: user profile background image help

Post by Ange Tuteur October 3rd 2015, 2:24 pm

I see.

Do you have a link to a profile on your forum that I can view ? I should be able to figure something out if I can get a look at your DOM structure. Smile
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13207
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania

https://fmdesign.forumotion.com

Back to top Go down

Solved Re: user profile background image help

Post by dodler-foddler October 3rd 2015, 3:38 pm

Ange Tuteur wrote:I see.

Do you have a link to a profile on your forum that I can view ? I should be able to figure something out if I can get a look at your DOM structure. Smile

sure thing! thanks for taking your time to help me!


http://freneticgaming.forumotion.com/u1
dodler-foddler
dodler-foddler
New Member

Male Posts : 17
Reputation : 1
Language : english

http://freneticgaming.forumotion.com

Back to top Go down

Solved Re: user profile background image help

Post by Ange Tuteur October 3rd 2015, 3:55 pm

No problem. Wink

See if this works for you :
Code:
/\/u\d+/.test(window.location.href) && $(function() {
  var field = document.getElementById('field_id3'), bg;

  if (field) {
    bg = $('.field_uneditable', field)[0];
    if (bg) document.body.style.backgroundImage = 'url(' + bg.innerHTML + ')';
  }
});

The placement should be in all the pages, of course. Smile
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13207
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania

https://fmdesign.forumotion.com

Back to top Go down

Solved Re: user profile background image help

Post by dodler-foddler October 3rd 2015, 4:09 pm

Ange Tuteur wrote:No problem. Wink

See if this works for you :
Code:
/\/u\d+/.test(window.location.href) && $(function() {
  var field = document.getElementById('field_id3'), bg;

  if (field) {
    bg = $('.field_uneditable', field)[0];
    if (bg) document.body.style.backgroundImage = 'url(' + bg.innerHTML + ')';
  }
});

The placement should be in all the pages, of course. Smile

Perfect! it works great. I haven't gotten on the js boat as much as I would like to, and this was really, really bugging me out - thank you very much!
dodler-foddler
dodler-foddler
New Member

Male Posts : 17
Reputation : 1
Language : english

http://freneticgaming.forumotion.com

Back to top Go down

Solved Re: user profile background image help

Post by Ange Tuteur October 3rd 2015, 4:30 pm

You're welcome. ^^

JS is a very handy tool when it comes to manipulating the document and writing web applications. It takes a little bit of time to understand everything, but it's worth it. Just make sure to study native JavaScript first and then any libraries after that ( like jQuery, since our forums use it ) so you understand the basics.

Topic archived

If you have anymore questions or problems feel free to open a new topic. Have a great weekend. Smile
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13207
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania

https://fmdesign.forumotion.com

Back to top Go down

Back to top

- Similar topics

 
Permissions in this forum:
You cannot reply to topics in this forum