X Webkit Speech Custom CSS code

  • Make Ova Fashions

    (@make-ova-fashions)


    10 years, 1 month ago

    Hi

    I found this cool code to add voice search to my site by adding this line of code to my theme searchform.php

    …” x-webkit-speech speech onwebkitspeechchange=”this.form.submit();” />

    How can I add this to the Custom CSS section so that when I update my theme I won’t loose the changes I made to that file.

Viewing 4 replies - 1 through 4 (of 4 total)
  • Oded Talmon

    (@odedta)

    10 years, 1 month ago

    onwebkitspeechchange=”this.form.submit();”

    Is a Javascript event, not CSS. You need to update your JS file:

    1. Grab search box via class or id.
    2. Add event handler: onwebkitspeechchange
    3. On firing event: this.form.submit();

    As for your question, unfortunately I do not know where is a “safe” place to store JS code that would not be overwritten on next update.

    What you can do is create a JS file with all your JS code and just link to it in the header simply using:
    <script src=”myscripts.js”></script>

    On next update just remember to check that line is still there.

    Thread Starter Make Ova Fashions

    (@make-ova-fashions)

    10 years, 1 month ago

    Thanks for the idea, this stuff is a bit above me. I know what you talking about I just don’t know exactly how to apply what you’ve said. I lost you by Grab search box via class or id. I think I will have to go read some JS stuff to understand it better.

    I think I’ll just keep that code and make sure it’s in the searchform.php the next time I update my theme.

    Thanks again anyways.

    Oded Talmon

    (@odedta)

    10 years, 1 month ago

    Well, in searchform.php

    change:

    <input class=”market-search” type=”text” placeholder=”<?php _e( ‘Search’, ‘bre-bootstrap-ecommerce’ ); ?>” name=”s” id=”s”>

    to this:

    <input class=”market-search” type=”text” placeholder=”<?php _e( ‘Search’, ‘bre-bootstrap-ecommerce’ ); ?>” name=”s” id=”s” onwebkitspeechchange=”this.form.submit();”>

    Thread Starter Make Ova Fashions

    (@make-ova-fashions)

    10 years, 1 month ago

    I see that makes more sense. thanks for all your help

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘X Webkit Speech Custom CSS code’ is closed to new replies.