I've programmed a theme before three years and I want to update it with Bootstrap. I need the input groups, modal windows and some other features.

Now I have implemented it and it works! But one thing I dont understand: If I want to use the bootstrap classes like form-control for input fields I don't know how can I set the class to all the available input fields. I tried it for the search box widget with this code and it works:

function search_form($html) {
    $html = str_replace('id="s"', 'id="s" class="form-control" required', $html);

    return $html;
add_filter('get_search_form', 'search_form');

Now the search field have the class form-control and the CSS style from Bootstrap. But that can't a good solution, I think. How can I set the class to all input fields like "input=text, textarea, checkboxes...."?

Or is there a way to assign the Bootstrap classes to the available wordpress classes in CSS? I mean: If the input field has the class "wordpress-input", so I can say in CSS "form-control extends wordpress-input"?

I hope you understand me. Sorry for my bad english I'm from Germany :)

Thanks in advance!

  • What you could do is go through your bootstrap.css and where you have the form-control class, simply add the default classes from your WordPress theme. Although, if you built the theme yourself you should have the ability to add classes to everything within the theme files. Look at the first note here: developer.wordpress.org/reference/functions/get_search_form/… Commented Oct 17, 2020 at 1:40


Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Browse other questions tagged or ask your own question.