AI Search
Classic Search
 Search Phrase:
 Search Type:
Advanced search options
 Search in Forums:
 Search in date period:

 Sort Search Results by:

Filter by custom fields

Topic prefix

AI Assistant
Notifications
Clear all

[Solved] moving my badges

18 Posts
2 Users
6 Reactions
5,632 Views
Posts: 1242
Topic starter
Translate
English
Spanish
French
German
Italian
Portuguese
Russian
Chinese
Japanese
Korean
Arabic
Hindi
Dutch
Polish
Turkish
Vietnamese
Thai
Swedish
Danish
Finnish
Norwegian
Czech
Hungarian
Romanian
Greek
Hebrew
Indonesian
Malay
Ukrainian
Bulgarian
Croatian
Slovak
Slovenian
Serbian
Lithuanian
Latvian
Estonian
(@percysgrowroom)
Noble Member
Joined: 7 years ago
[#11508]

I want to be able to move the "mycred ranking" so they display above the forum badges. I made a pic to explain easier:

is this possible? 

 wpforopicd

17 Replies
Sofy
Posts: 5774
 Sofy
Admin
Translate
English
Spanish
French
German
Italian
Portuguese
Russian
Chinese
Japanese
Korean
Arabic
Hindi
Dutch
Polish
Turkish
Vietnamese
Thai
Swedish
Danish
Finnish
Norwegian
Czech
Hungarian
Romanian
Greek
Hebrew
Indonesian
Malay
Ukrainian
Bulgarian
Croatian
Slovak
Slovenian
Serbian
Lithuanian
Latvian
Estonian
(@sofy)
Support Team
Joined: 8 years ago

You should use the following JS codes: 

jQuery(document).ready(function ($) {
$.each($(".wpforo-mycred-rank-wrap"), function () {
$(this).insertBefore($(this).parents(".wpf-left").find(".author-name"));
});
});

jQuery(document).ready(function ($) {
$.each($(".author-title"), function () {
$(this).insertAfter($(this).parents(".wpf-left").find(".wpforo-mycred-badges-wrap"));
});
});

The js codes should be added in your active theme's js files. 


2 Replies
(@percysgrowroom)
Joined: 7 years ago

Noble Member
Posts: 1242
Translate
English
Spanish
French
German
Italian
Portuguese
Russian
Chinese
Japanese
Korean
Arabic
Hindi
Dutch
Polish
Turkish
Vietnamese
Thai
Swedish
Danish
Finnish
Norwegian
Czech
Hungarian
Romanian
Greek
Hebrew
Indonesian
Malay
Ukrainian
Bulgarian
Croatian
Slovak
Slovenian
Serbian
Lithuanian
Latvian
Estonian

@sofy

I cant just add this to CSS? Where can i find my themes JS? 


Sofy
 Sofy
Admin
(@sofy)
Joined: 8 years ago

Support Team
Posts: 5774
Sofy
Translate
English
Spanish
French
German
Italian
Portuguese
Russian
Chinese
Japanese
Korean
Arabic
Hindi
Dutch
Polish
Turkish
Vietnamese
Thai
Swedish
Danish
Finnish
Norwegian
Czech
Hungarian
Romanian
Greek
Hebrew
Indonesian
Malay
Ukrainian
Bulgarian
Croatian
Slovak
Slovenian
Serbian
Lithuanian
Latvian
Estonian

@percysgrowroom

I can't just add this to CSS? 

It's a little difficult to make the customization via CSS code, you should change the value of the order CSS property in the code below to get it resolved: 

.author-data {
display: flex;
flex-direction: column;
}

.wpforo-mycred-rank-wrap {
order: 2;
}

.author-rating-full {
order: 3;
}

.wpforo-mycred-badges-wrap {
order: 4;
}
.author-title {
order: 5;
}
.wpforo-mycred-points-wrap {
orphans: 5;
}

.author-joined {
order: 6;
}

.author-posts {
order: 7;
}

.wpforo-mycred-points-wrap {
order: 8;
}

Where can i find my themes JS? 

This article should be helpful for you: https://www.collectiveray.com/add-javascript-to-wordpress


Posts: 1242
Topic starter
Translate
English
Spanish
French
German
Italian
Portuguese
Russian
Chinese
Japanese
Korean
Arabic
Hindi
Dutch
Polish
Turkish
Vietnamese
Thai
Swedish
Danish
Finnish
Norwegian
Czech
Hungarian
Romanian
Greek
Hebrew
Indonesian
Malay
Ukrainian
Bulgarian
Croatian
Slovak
Slovenian
Serbian
Lithuanian
Latvian
Estonian
(@percysgrowroom)
Noble Member
Joined: 7 years ago

Thanks Sofy 🙂 You're always so helpful, I appreciate it, thanks 


1 Reply
Sofy
 Sofy
Admin
(@sofy)
Joined: 8 years ago

Support Team
Posts: 5774
Translate
English
Spanish
French
German
Italian
Portuguese
Russian
Chinese
Japanese
Korean
Arabic
Hindi
Dutch
Polish
Turkish
Vietnamese
Thai
Swedish
Danish
Finnish
Norwegian
Czech
Hungarian
Romanian
Greek
Hebrew
Indonesian
Malay
Ukrainian
Bulgarian
Croatian
Slovak
Slovenian
Serbian
Lithuanian
Latvian
Estonian

@percysgrowroom

Please let us know if the codes don't work. 


Posts: 1242
Topic starter
Translate
English
Spanish
French
German
Italian
Portuguese
Russian
Chinese
Japanese
Korean
Arabic
Hindi
Dutch
Polish
Turkish
Vietnamese
Thai
Swedish
Danish
Finnish
Norwegian
Czech
Hungarian
Romanian
Greek
Hebrew
Indonesian
Malay
Ukrainian
Bulgarian
Croatian
Slovak
Slovenian
Serbian
Lithuanian
Latvian
Estonian
(@percysgrowroom)
Noble Member
Joined: 7 years ago

I dont know where to find the CSS, what file should i be looking in in the cpanel?

 


1 Reply
Sofy
 Sofy
Admin
(@sofy)
Joined: 8 years ago

Support Team
Posts: 5774
Translate
English
Spanish
French
German
Italian
Portuguese
Russian
Chinese
Japanese
Korean
Arabic
Hindi
Dutch
Polish
Turkish
Vietnamese
Thai
Swedish
Danish
Finnish
Norwegian
Czech
Hungarian
Romanian
Greek
Hebrew
Indonesian
Malay
Ukrainian
Bulgarian
Croatian
Slovak
Slovenian
Serbian
Lithuanian
Latvian
Estonian

@percysgrowroom

The CSS codes should be added in the "Custom CSS code" textarea, located in the Dashboard > Forums > Settings > Style Tab.  

Please don't forget to delete all caches and press Ctrl+F5 (twice) on the frontend before checking to reload the updated CSS file.    


Posts: 1242
Topic starter
Translate
English
Spanish
French
German
Italian
Portuguese
Russian
Chinese
Japanese
Korean
Arabic
Hindi
Dutch
Polish
Turkish
Vietnamese
Thai
Swedish
Danish
Finnish
Norwegian
Czech
Hungarian
Romanian
Greek
Hebrew
Indonesian
Malay
Ukrainian
Bulgarian
Croatian
Slovak
Slovenian
Serbian
Lithuanian
Latvian
Estonian
(@percysgrowroom)
Noble Member
Joined: 7 years ago

its not worked Sofy 🙁

I moved the section to where i want it to be, deleted cache and all that, no change

then change the numbers in Order too, no change.

 wpforocss

1 Reply
Sofy
 Sofy
Admin
(@sofy)
Joined: 8 years ago

Support Team
Posts: 5774
Translate
English
Spanish
French
German
Italian
Portuguese
Russian
Chinese
Japanese
Korean
Arabic
Hindi
Dutch
Polish
Turkish
Vietnamese
Thai
Swedish
Danish
Finnish
Norwegian
Czech
Hungarian
Romanian
Greek
Hebrew
Indonesian
Malay
Ukrainian
Bulgarian
Croatian
Slovak
Slovenian
Serbian
Lithuanian
Latvian
Estonian

@percysgrowroom

Please see how it looks in my case:

 

 icons

Page 1 / 3
Share: