Change Buddypress "Change Profile Photo" URL

This topic has 19 replies, 5 voices, and was last updated 9 years by tmh23.

Author

Tagged: nav, buddypress
October 24, 2014 at 04:43 #32874

chazzzzy
Participant

Users trying to change their profile pic on my website are not aware that when they klick “Change Profile Picture” in the sub Profile nav item, that they then have to SCROLL down to see that the page has changed.

If you could ADD #upload to the URL of the Change Profile Photo link to look like:

members/charles/profile/change-avatar/#upload

It would SCROLL to the changed page and the users would know what to do.

I have spent the whole day trying to figure this out to no avail.

Could you please tell me what to do?

Again, I just want to ADD #upload to the URL of the Profile/Change Profile Photo nav item.

Thanks!

Charles

October 24, 2014 at 14:13 #32919

sharmstr
Moderator

I tried to add an anchor to the buddypress slugs the other day for someone else here and couldn’t get it work. Maybe ask over on the buddypress forum. I did a search over there and couldnt find anything.

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

This support site is not about custom work. If you need custom development please contact cornel@seventhqueen.com
October 28, 2014 at 16:21 #33323

Abe
Keymaster
Hello there
I came with a quick solution that implies only adding this code to your child theme functions.php. This will make the page go a bit lower when clicking Buddypress navigation links
COPY CODE
```
/* Buddypress profile - scroll page below when clicking navigation */
add_action('wp_footer', 'kleo_bp_add_link_nav');
function kleo_bp_add_link_nav() {
    echo '<script>jQuery(document).ready(function() { ' . "\n\t" .
        'jQuery("#item-nav .item-list-tabs a, #item-body #subnav a").each(function() {' . "\n\t\t" .
        'jQuery(this).attr("href",jQuery(this).attr("href")+"#item-nav");' . "\n\t" .
        '}); ' . "\n" .
        '});</script>' . "\n";
}
```
Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

---
@ SeventhQueen we do our best to have super happy customers. Thanks for being our customer.
October 28, 2014 at 17:03 #33333

sharmstr
Moderator

Tricky 🙂

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

This support site is not about custom work. If you need custom development please contact cornel@seventhqueen.com

October 28, 2014 at 22:39 #33360

Abe
Keymaster

hehe, indeed 🙂

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

---
@ SeventhQueen we do our best to have super happy customers. Thanks for being our customer.

October 28, 2014 at 22:47 #33361

chazzzzy
Participant

Wow Abe!! Thank you so much!! Works like a charm! Yeah!

You should perhaps include it in future updates as I’m sure others on laptops encounter the same issue.

Thanks again and thank you sharmstr for all your help as well!

Charles

October 29, 2014 at 07:18 #33407

chazzzzy
Participant

Whoops.. Abe.. the code breaks the navigation from dropping down when you click the + sign on a mobile phone.

October 29, 2014 at 07:20 #33408

chazzzzy
Participant

Actually, it breaks the whole clicking the + sign in the nav.. it no longer works as I guess it’s adding the #item-nav to that item as well.
October 29, 2014 at 07:42 #33409

chazzzzy
Participant
OK.. I fixed it… I added :gt(0) to the links.. to get the following code:
COPY CODE
```
/* Buddypress profile - scroll page below when clicking navigation */
add_action('wp_footer', 'kleo_bp_add_link_nav');
function kleo_bp_add_link_nav() {
    echo '<script>jQuery(document).ready(function() { ' . "\n\t" .
        'jQuery("#item-nav .item-list-tabs a:gt(0), #item-body #subnav a:gt(0)").each(function() {' . "\n\t\t" .
        'jQuery(this).attr("href",jQuery(this).attr("href")+"#item-nav");' . "\n\t" .
        '}); ' . "\n" .
        '});</script>' . "\n";
}
```
October 29, 2014 at 15:40 #33431

sharmstr
Moderator

Nice job chazzzzy. I was going to ask about mobile. Thanks.

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

This support site is not about custom work. If you need custom development please contact cornel@seventhqueen.com

November 13, 2014 at 17:21 #35326

kobrakai75
Participant

Is there any way to change this for the main links to “Friends”, “Messages” etc? You still have to scroll down to view your list of friends or messages (unless you have selected “show less”).

November 13, 2014 at 17:57 #35332

chazzzzy
Participant

The code above actually makes it scroll down on all of those links, including the ones you arr asking for.

November 13, 2014 at 23:20 #35371

kobrakai75
Participant

Hi chazzzzy, thanks for the response. I’m seeing the “#item-nav” added to the sub-profile links, but not to any of the links in my primary menu at the top.

No special customization in my menu, just created in the admin area: Appearance > Menus

November 14, 2014 at 19:57 #35471

Abe
Keymaster

It won’t work for the main menu … only for Buddypress navigation. in the main menu add the #item-nav yourself 🙂

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

---
@ SeventhQueen we do our best to have super happy customers. Thanks for being our customer.

November 15, 2014 at 22:31 #35630

kobrakai75
Participant

Hi Abe, no idea how to add that to main menu navigation. Does it require adding code to the child theme functions.php?

Thanks for your help with this.

November 19, 2014 at 23:21 #35996

Abe
Keymaster

@kobrakai75 if you add a custom link then just add that at the end.. if you add one that is generated them you need to come with a script like the one above

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

---
@ SeventhQueen we do our best to have super happy customers. Thanks for being our customer.

November 26, 2014 at 16:18 #36728

kobrakai75
Participant

Hi Abe, if I add my own custom links to the Primary Menu they can be seen by users who are not logged into the site, which I don’t want. Is there a way to hide the links and only make them appear to logged in users?

November 28, 2014 at 17:48 #36961

Abe
Keymaster

use a plugin like https://wordpress.org/plugins/menu-items-visibility-control/

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

---
@ SeventhQueen we do our best to have super happy customers. Thanks for being our customer.

August 19, 2015 at 05:12 #73686

tmh23
Participant

@chazzzzy

I’m using your code in post #33409 above and it works great! Really brilliant. Wondering if there is a way to tweak one thing. Currently is scrolls and hides the tab options… is there a way to change the spot where it scrolls to so that it consistently shows the tabs on both profile and groups pages.
The first screen shot shows where it scrolls to now and the second screen shot is where it would be nice to have it scroll to… showing the other option tabs.

Thanks,
Troy

Attachments:
You must be logged in to view attached files.

October 2, 2015 at 17:41 #80443

tmh23
Participant

@abe

@chazzzzy

Can you help me modify this code so the page doesn’t jump so high up? I’d like to keep the profile menu tabs still visible on the page. See screen shots.

Thanks,
Troy

Attachments:
You must be logged in to view attached files.
Author

Posts