|
Nikishna
|
April 5, 2017 at 5:00 pm
I would like for my registration pages to match the css styling of my overall website. Therefore, I need to swap out the default Event Espresso css classes for each item (headers, descriptions, form field inputs, submit buttons, etc). However, I just don’t know what file(s) are used to generate the [shortcode] pages. That is where I need your help!
I know that I could create a separate Custom CSS file, find all of the EE4 element classes and copy my theme values into the Custom CSS element classes. However, this seems like a duplication of code and effort. If my theme CSS gets updated, then I will need to go back into the Custom CSS file to update all of those Event Espresso element classes as well with the new theme values. I would much rather just have the Event Espresso registration forms generate the first time with the MY theme classes without the EE4 classes. This would be much cleaner and look much better.
|
|
Josh
|
April 5, 2017 at 6:10 pm
I’m sorry changing the files directly is not supported. If you absolutely need to change the markup (html) of the pages, you can inject some custom jQuery and add or even remove classes. This way when Event Espresso 4 gets an update, you will not need to go back into your modified files and update all of those Event Espresso element classes as well.
|
|
Nikishna
|
April 5, 2017 at 7:25 pm
I added the jQuery script to the head of the website and then added a simple script in the page to remove the class, yet it did not work. I tried to add the class and then remove the old class using the code below:
<head>
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>
<script>
$( "form" ).addClass(function( index, currentClass ) {
var addedClass;
if ( currentClass === "" ) {
addedClass = "uk-form";
}
return addedClass;
});
</script>
<script>
$( "input" ).removeClass( "ee-reg-qstn" );
</script>
</body>
|
|
Josh
|
April 5, 2017 at 8:33 pm
Your code there will require some fixing.
1) You shouldn’t load in the jQuery library with your custom script because it’s already loaded by WordPress. Two copies will break things!
https://digwp.com/2009/06/including-jquery-in-wordpress-the-right-way/
2) Along with that, you’ll need to wrap your code in a document ready.
The correct way to add custom scripts is put them in their own file and enqueue them or use the wp_add_inline_script() script function.
|
