This code allow to limit a characters in search area and works good in desktop version, but not in mobile one. How to make it working in mobile version too?
<form role="search" method="get" class="woocommerce-product-search" action="<?php echo esc_url( home_url( '/' ) ); ?>">
<label class="screen-reader-text" for="s"><?php _e( '', 'woocommerce' ); ?></label>
<input pattern=".{17,}" required title="You must enter 17 characters at last, to search Car by VIN Number" class="search-field" placeholder="<?php echo esc_attr_x( 'Enter VIN Number…', 'placeholder', 'woocommerce' ); ?>" value="<?php echo get_search_query(); ?>" name="s" title="<?php echo esc_attr_x( 'Search for:', 'label', 'woocommerce' ); ?>" />
<input type="submit" value="<?php echo esc_attr_x( 'Search', 'submit button', 'woocommerce' ); ?>" />
<input type="hidden" name="post_type" value="product" />
Related
I'm wondering if anyone can help me please?
I've currently got a search form setup, i'd like to remove the 'search' button and allow the user to search by typing and then click enter into the 'search-field'.
<form role="search" method="get" class="search-form" action="<?php echo home_url( '/' ); ?>">
<label>
<input type="search"
class="search-field"
placeholder="<?php echo esc_attr_x( 'Search Our Site', 'placeholder' ) ?>"
value="<?php echo get_search_query() ?>"
name="s"
title="<?php echo esc_attr_x( 'Search for:', 'label' ) ?>"
/>
</label>
<input type="submit"
class="search-submit"
value="<?php echo esc_attr_x( 'Search', 'submit button' ) ?>"
/>
</form>
Any help would really be appreciated.
Thanks!
I am using Wordpress and installed plugin named TML.
I'd like to change the displayed text of this registering page without touching the features working.
enter image description here
I had checked the source code of plugin TML, and I had found this file
"theme-my-login/templates/register-form.php"
<?php
/*
If you would like to edit this file, copy it to your current theme's directory and edit it there.
Theme My Login will always look in your theme's directory first, before using this default template.
*/
?>
<div class="tml tml-register" id="theme-my-login<?php $template->the_instance(); ?>">
<?php $template->the_action_template_message( 'register' ); ?>
<?php $template->the_errors(); ?>
<form name="registerform" id="registerform<?php $template->the_instance(); ?>" action="<?php $template->the_action_url( 'register', 'login_post' ); ?>" method="post">
<?php if ( 'email' != $theme_my_login->get_option( 'login_type' ) ) : ?>
<p class="tml-user-login-wrap">
<label for="user_login<?php $template->the_instance(); ?>"><?php _e( 'Username', 'theme-my-login' ); ?></label>
<input type="text" name="user_login" id="user_login<?php $template->the_instance(); ?>" class="input" value="<?php $template->the_posted_value( 'user_login' ); ?>" size="20" />
</p>
<?php endif; ?>
<p class="tml-user-email-wrap">
<label for="user_email<?php $template->the_instance(); ?>"><?php _e( 'E-mail', 'theme-my-login' ); ?></label>
<input type="text" name="user_email" id="user_email<?php $template->the_instance(); ?>" class="input" value="<?php $template->the_posted_value( 'user_email' ); ?>" size="20" />
</p>
<?php do_action( 'register_form' ); ?>
<p class="tml-registration-confirmation" id="reg_passmail<?php $template->the_instance(); ?>"><?php echo apply_filters( 'tml_register_passmail_template_message', __( 'Registration confirmation will be e-mailed to you.', 'theme-my-login' ) ); ?></p>
<p class="tml-submit-wrap">
<input type="submit" name="wp-submit" id="wp-submit<?php $template->the_instance(); ?>" value="<?php esc_attr_e( 'Register', 'theme-my-login' ); ?>" />
<input type="hidden" name="redirect_to" value="<?php $template->the_redirect_url( 'register' ); ?>" />
<input type="hidden" name="instance" value="<?php $template->the_instance(); ?>" />
<input type="hidden" name="action" value="register" />
</p>
</form>
<?php $template->the_action_links( array( 'register' => false ) ); ?>
</div>
Which field do I have to change for my changing display such as "Register" "Password", etc?
You can see the field names like
The _e means "get the translation for". In thtis case for Username. And the text domain is "theme-my-login". So you can change the language file only and you are all set without editing the php files.
I'm using WooCommerce product search widget and add minlength="17" fragment in this code:
<form role="search" method="get" class="woocommerce-product-search" action="<?php echo esc_url( home_url( '/' ) ); ?>">
<label class="screen-reader-text" for="s"><?php _e( 'Search for:', 'woocommerce' ); ?></label>
<input type="search" class="search-field" placeholder="<?php echo esc_attr_x( 'Search Products…', 'placeholder', 'woocommerce' ); ?>" value="<?php echo get_search_query(); ?>" minlength="17" name="s" title="<?php echo esc_attr_x( 'Search for:', 'label', 'woocommerce' ); ?>" />
<input type="submit" value="<?php echo esc_attr_x( 'Search', 'submit button', 'woocommerce' ); ?>" />
<input type="hidden" name="post_type" value="product" />
</form>
And it works very nice in Chrome. It shows a message:
"Please lengthen this text to 17 characters or more(You are currently
use * characters)".
This is what I need, but it doesn't in Firefox and IE.
When I put 3,4 or less then 17 characters in search field, It starts search.
What to do? How to make it working in all browsers?!
check this out.
<form action="">
<input minlength="17" >
<input pattern=".{17,}" required title="17 characters minimum">
<input pattern=".{5,10}" required title="5 to 10 characters">
<input type="submit">
</form>
DEMO
You can do it with javascript code
<input onblur="checkLength(this)" id="groupidtext" type="text" style="width: 100px;" minlength="6" />
<!-- or use event onkeyup instead if you want to check every character strike-->
function checkLength(el) {
if (el.value.length <= 6) {
alert("length must be atleast 6 characters")
}
}
Try to implement this snippet, i hope this code will help
<link rel="stylesheet" href="http://jqueryvalidation.org/files/demo/site-demos.css">
<form id="myform">
<label for="field">Required, minimum length 17: </label>
<input type="text" class="left" id="field" name="field">
<br/>
<input type="submit" value="Validate!">
</form>
<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
<script src="http://jqueryvalidation.org/files/dist/jquery.validate.min.js"></script>
<script src="http://jqueryvalidation.org/files/dist/additional-methods.min.js"></script>
<script>
// just for the demos, avoids form submit
jQuery.validator.setDefaults({
debug: true,
success: "valid"
});
$( "#myform" ).validate({
rules: {
field: {
required: true,
minlength: 17
}
}
});
</script>
This is my site's woocommerce product page
As you can see, I use two search: The first above contact menu item and the second one in sidebar. First search is a template default search and the second one is woocommerce product search widget.
My aim is to limit character numbers in both search. I have this code in woocommerce product search widget and it works good. Just try to search with less then 17 characters and you will see what I mean:
<form role="search" method="get" class="woocommerce-product-search" action="<?php echo esc_url( home_url( '/' ) ); ?>">
<label class="screen-reader-text" for="s"><?php _e( '', 'woocommerce' ); ?></label>
<input pattern=".{17,}" required title="17 characters minimum" class="search-field" placeholder="<?php echo esc_attr_x( 'Search Products…', 'placeholder', 'woocommerce' ); ?>" value="<?php echo get_search_query(); ?>" name="s" title="<?php echo esc_attr_x( 'Search for:', 'label', 'woocommerce' ); ?>" />
<input type="submit" value="<?php echo esc_attr_x( 'Search', 'submit button', 'woocommerce' ); ?>" />
<input type="hidden" name="post_type" value="product" />
But the same code (after copy/paste) doesn't work for the first search.
This is the first/template default search code:
<div class="widget-search">
<form action="<?php echo esc_url( get_home_url() ); ?>/" class="searchform" id="searchform" method="get" role="search">
<input type="search" value="<?php echo get_search_query(); ?>" name="s" id="s" placeholder="<?php _e( 'Search...', 'pixar' ); ?>">
<button type="submit"> <i class="fa fa-search"></i> </button>
</form>
</div>
How to get the same result for the template default search? Simple copy/paste doesn't work.
Try to implement this snippet, i hope this code will help
<link rel="stylesheet" href="http://jqueryvalidation.org/files/demo/site-demos.css">
<form id="myform">
<label for="field">Required, minimum length 17: </label>
<input type="text" class="" id="" name="field5">
<br/>
<br/>
<input type="submit" value="Validate!">
</form>
<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
<script src="http://jqueryvalidation.org/files/dist/jquery.validate.min.js"></script>
<script src="http://jqueryvalidation.org/files/dist/additional-methods.min.js"></script>
<script>
// just for the demos, avoids form submit
jQuery.validator.setDefaults({
debug: true,
success: "valid"
});
$( "#myform" ).validate({
rules: {
field5: {
required: true,
minlength: 17
}
}
});
</script>
just keep the id of form and input field name attributes same
I am fleshing out my first custom Wordpress theme and trying to hook up the search. Now I am following the codex but does not appear to be working correctly. Perhaps I am doing something wrong?
I have added the theme support as this is using the HTML field method.
so here is my search field:
<form role="search" method="get" class="search-form" action="<?php echo home_url( '/' ); ?>">
<label>
<input type="search" class="search-field" placeholder="What are you looking for?" value="<?php echo get_search_query() ?>" name="s" title="<?php echo esc_attr_x( 'Search for:', 'label' ) ?>" />
</label>
<br />
<button class="button-search">Find items</button>
</form>
And I have created a search.php with the usual template page bits along the top, created the search page as a page in wordpress, yet when I search I can see the post request in the URL but the page is blank. I am cleary doing something wrong here?
This should work for you
<form role="search" method="get" class="search-form" action="<?php echo esc_url( home_url( '/' ) ); ?>">
<label>
<input type="text" class="search-field" placeholder="What are you looking for?" value="<?php echo get_search_query() ?>" name="s" id="s" title="<?php echo esc_attr_x( 'Search for:', 'label' ) ?>" />
</label>
<br />
<input type="submit" class="button-search" id="searchsubmit" value="Find items" />
</form>