Adding custom links to to buddy press menu

[olufemishield]

Hello,

I want to add new components that are not native of buddy press to its menu. I want to do this so that all member unique pages can be accessed from on navigation (the buddy press menu). This unique pages include

1. “sensei my courses”,

2. “Events from fooevents” (I cant use the event manager that kleo integrated it with)

3. some post pages accessible to each class of membership

I may decide to add one or two more member unique links but if I get the scope I’ll be able to add others anytime.

 

Thank you in advance

[Radu]

Hi,

The issue it’s related to the Buddypress plugin itself not Kleo but here it’s a plugin that allows you to create custom menus there: https://wordpress.org/plugins/buddypress-custom-profile-menu/

I don’t know if without custom code you can achieve membership restriction in the custom profile links

Cheers
R.

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

What support service includes ? What not ?

[olufemishield]

Ill work with this for now and see what happens. Thank you.

[olufemishield]

Hi,

I want to give each custom link its unique icon rather than the default down arrow. I have tried the instruction in this link: https://archived.seventhqueen.com/kleo/article/changing-section-icons-in-profiles-and-groups#link_tab-writecss.

Though I didn’t see a json file but I somehow got the codes of the icons I needed but it didn’t work unfortunately. Kindly check and advice.

Thank you

[Radu]

To can load custom font icons there just follow this : https://archived.seventhqueen.com/kleo/article/use-custom-fontello-icons-kleo-theme

So the actually icons can be found in theme package that you have downloaded from theme forest : /MainFiles/Assets/Fontello

After you load the new codes into the fontello file and uploaded it into kleo-child/assets you can use the css to change the icons for the item that you have added.

Cheers
R.

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

What support service includes ? What not ?

[olufemishield]

The link wasn’t helpful. Remember I want to change buddy press profile menu icons not just have new icons in repository and not knowing how to manually use them in buddy press menu.

The link I mentioned earlier did the job once I figured out what the icon codes were.

(https://archived.seventhqueen.com/kleo/article/changing-section-icons-in-profiles-and-groups#link_tab-writecss)

Thank you

[Radu]

Hi,

If you want to use other icons than fontello use the next selectors to load images nto font icons

Icons can be changed using some cusom CSS selectors

COPY CODE

a#user-activity:before {
    content: " " !important; 
    background-image: url('http://www.laconexioncreadora.com/wp-content/uploads/icons/actividades.jpg');
    width: 40px;
    height: 40px;
    color: transparent !important;
    background-size: cover;
}
a#user-xprofile:before {
    content: " " !important; 
    background-image: url('http://www.laconexioncreadora.com/wp-content/uploads/icons/perfil.jpg');
    width: 40px;
    height: 40px;
    color: transparent !important;
    background-size: cover;
}
a#user-friends:before {
    content: " " !important; 
    background-image: url('http://www.laconexioncreadora.com/wp-content/uploads/icons/amigos.jpg');
    width: 40px;
    height: 40px;
    color: transparent !important;
    background-size: cover;
}
a#user-settings:before {
    content: " " !important; 
    background-image: url('http://www.laconexioncreadora.com/wp-content/uploads/icons/configuracion.jpg');
    width: 40px;
    height: 40px;
    color: transparent !important;
    background-size: cover;
}
a#user-courses:before {
    background-image: url('http://www.laconexioncreadora.com/wp-content/uploads/icons/cursos.jpg');
    width: 40px;
    height: 40px;
    color: transparent !important;
    background-size: cover;
}
a#user-forums:before {
    background-image: url('http://www.laconexioncreadora.com/wp-content/uploads/icons/foros.jpg');
    width: 40px;
    height: 40px;
    color: transparent !important;
    background-size: cover;
}
a#user-groups:before {
    content: " " !important; 
    background-image: url('http://www.laconexioncreadora.com/wp-content/uploads/icons/grupos.jpg');
    width: 40px;
    height: 40px;
    color: transparent !important;
    background-size: cover;
}
a#user-messages:before {
    content: " " !important; 
    background-image: url('http://www.laconexioncreadora.com/wp-content/uploads/icons/mensajes.jpg');
    width: 40px;
    height: 40px;
    color: transparent !important;
    background-size: cover;
}
a#user-notifications:before {
    content: " " !important;  
    background-image: url('http://www.laconexioncreadora.com/wp-content/uploads/icons/notificaciones.jpg');
    width: 40px;
    height: 40px;
    color: transparent !important;
    background-size: cover;
}

The CSS will be added to wp-admin -> theme options -> general settings -> quick css

Cheers
R

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

What support service includes ? What not ?

[Author]

Posts