I would recommend you use the web developer tools of your browser. If you inspect that "Destiny" you see on the screen, will show you the CSS class that you will need to style.
If you know the class but your styling still doesn't work, be sure that your CSS file really gets loaded. Look at the html source of the page and a) search yourfile.css and b) open it from inside your browser and see make sure it shows what you are seeing in your editor. Sometimes files are cached and you are looking at an old version of the file.
Here's the class. I've tried span.PrefixDiscussion.SpDestiny and PrefixDiscussion.SpDestiny and still don't get any results. I've also tried adding a css folder and adding the css file into that (just how you had me do the js), but nothing. I'm thinking that this file isn't loading because I cannot find it in the pages html. To make sure I'm looking in the right place, I'm going to add another image.
The only valid characters in a class name are letters, numbers, dash and underscore, but no dot.
So that "span.PrefixDiscussion.SpDestiny" cannot be the class name. It is a short form for <span class="PrefixDiscussion SpDestiny">. The span that encloses the prefix has two classes. In order to select that element in your css file it therefore will be sufficient (and best!) to only write .SpDestiny { some css }
Concerning your CSS file problem: step one is to find out that it hasn't work. Step two will be to make it work. You have a working example for how "AddCssFile" works in the plugin. It should be easy to change that example to load a file you have created.
@R_J hey I added the same code to the prefixdiscussion.css file that was already there and it worked! What would I do in scenarios where the prefix has spaces? I've tried .SpCall-of-Duty, .SpCall of Duty & .SpCallofDuty.
Great that you now get acquainted to the developer tools and manage to solve your problems yourself!
But I feel mean to tell you that you "only" have found a solution to deal with a bug in my code. Spaces in css classes are not allowed.
That's why I updated the plugin and spaces in prefixes will now be replaced with underscores. That enhancement was made because of your input - thanks!
Hi, There seems to be a problem where the JS file is included on line 123 in the PHP file. When commented the select is populated correctly. The JS file seems to have hardcoded values and looks to be deprecated.
Should this line be commented and the JS file removed in the next version as I don't want to fork your version?
@GrahamMills said:
Hi, There seems to be a problem where the JS file is included on line 123 in the PHP file. When commented the select is populated correctly. The JS file seems to have hardcoded values and looks to be deprecated.
You're totally right! That is a relict of something I simply inserted for demonstration purpose and it was never meant to be released...
I'll fix it and upload the new version. Many thanks for your note!
Comments
I would recommend you use the web developer tools of your browser. If you inspect that "Destiny" you see on the screen, will show you the CSS class that you will need to style.
If you know the class but your styling still doesn't work, be sure that your CSS file really gets loaded. Look at the html source of the page and a) search yourfile.css and b) open it from inside your browser and see make sure it shows what you are seeing in your editor. Sometimes files are cached and you are looking at an old version of the file.
Here's the class. I've tried span.PrefixDiscussion.SpDestiny and PrefixDiscussion.SpDestiny and still don't get any results. I've also tried adding a css folder and adding the css file into that (just how you had me do the js), but nothing. I'm thinking that this file isn't loading because I cannot find it in the pages html. To make sure I'm looking in the right place, I'm going to add another image.
The only valid characters in a class name are letters, numbers, dash and underscore, but no dot.
So that "span.PrefixDiscussion.SpDestiny" cannot be the class name. It is a short form for <span class="PrefixDiscussion SpDestiny">. The span that encloses the prefix has two classes. In order to select that element in your css file it therefore will be sufficient (and best!) to only write .SpDestiny { some css }
Concerning your CSS file problem: step one is to find out that it hasn't work. Step two will be to make it work. You have a working example for how "AddCssFile" works in the plugin. It should be easy to change that example to load a file you have created.
@R_J hey I added the same code to the prefixdiscussion.css file that was already there and it worked! What would I do in scenarios where the prefix has spaces? I've tried .SpCall-of-Duty, .SpCall of Duty & .SpCallofDuty.
@R_J Wait I just figured it out!
I went into the inspector and found it's .SpCall.of.Duty! Yay for me for finding something out on my own
Great that you now get acquainted to the developer tools and manage to solve your problems yourself!
But I feel mean to tell you that you "only" have found a solution to deal with a bug in my code. Spaces in css classes are not allowed.
That's why I updated the plugin and spaces in prefixes will now be replaced with underscores. That enhancement was made because of your input - thanks!
@R_J Cool! Don't feel bad man, I know I'm a noob to this stuff. haha
Hey I tried modifying class.prefixdiscussion.plugin.php to remove the [ ] that you hard coded in the plugin, but ended up breaking my site. lol
Here's the area I tried modifying:
public function base_beforeDiscussionName_handler ($Sender) {
if (!CheckPermission('Vanilla.PrefixDiscussion.View')) {
return;
}
$Prefix = $Sender->EventArguments['Discussion']->Prefix;
if ($Prefix == '') {
return;
}
$Sender->EventArguments['Discussion']->Name = Wrap(
$Prefix,
'span',
array('class' => "PrefixDiscussion Sp{$Prefix}")
).$Sender->EventArguments['Discussion']->Name;
}
Obviously this is wrong, what would I need to do to stop the brackets from displaying? Since I'm using custom css I don't need the [ ].
The brackets are styled in the css. Just look at the "before" and "after" parts
ahhhhh dang. ok thanks!
Hi, There seems to be a problem where the JS file is included on line 123 in the PHP file. When commented the select is populated correctly. The JS file seems to have hardcoded values and looks to be deprecated.
Should this line be commented and the JS file removed in the next version as I don't want to fork your version?
You're totally right! That is a relict of something I simply inserted for demonstration purpose and it was never meant to be released...
I'll fix it and upload the new version. Many thanks for your note!
Done