Wordpress search custom form - wordpress

I have standard search form in on my WP.
<form method="get" id="searchform" action="<?php echo esc_url( home_url( '/' ) ); ?>">
<label for="s" class="assistive-text"><?php _e( 'Search', 'twentyeleven' ); ?></label>
<input type="text" class="field" name="s" id="s" placeholder="<?php esc_attr_e( 'Search', 'twentyeleven' ); ?>" />
<input type="submit" class="submit" name="submit" id="searchsubmit" value="<?php esc_attr_e( 'Search', 'twentyeleven' ); ?>" />
</form>
How can I do this?

Simply create a searchform.php in your theme-folder.
Copy the php-tags from the standard code, to achieve similar behaviour. Also don't change the name-attributes, or it won't work.
<form role="search" method="get" id="searchform" action="<?php echo home_url( '/' ); ?>">
<div><label class="screen-reader-text" for="s">Search for:</label>
<input type="text" value="" name="s" id="s" />
<input type="submit" id="searchsubmit" value="Search" />
</div>
</form>
See the example on this Codex page

Related

get_product_search_form not showing products in archive_products layout

When i use get_product_search_form i get normal search results - to be precise, i get the products description.
Here's the product_searchform.php code:
<form role="search" method="get" class="woocommerce-product-search" action="<?php echo esc_url( home_url( '/' ) ); ?>">
<input type="submit" class="search-button" value="">
<input type="search" id="woocommerce-product-search-field-<?php echo isset( $index ) ? absint( $index ) : 0; ?>" class="search-field" placeholder="<?php echo esc_attr__( 'Search products…', 'woocommerce' ); ?>" value="<?php echo get_search_query(); ?>" name="s" />
<input type="hidden" name="post_type" value="product" />
</form>

Replacing native search with WooCommerce Product search

I'm running a theme name melokids, for a baby clothing store.
I'm struggling with trying to replace the theme's native search function with Woo Commerce, makes sense right?
Would appreciate if anybody would have any idea on this, Here's the current search function I believe:
<?php
if(!function_exists('melokids_header_search')){
function melokids_header_search($args=[]){
$args = wp_parse_args($args, ['icon' => 'fa fa-search']);
$header_search = melokids_get_opts('header_search','0');
if('0' === $header_search) return;
wp_enqueue_script('magnific-popup');
wp_enqueue_style('magnific-popup');
$unique_id = esc_attr( uniqid( 'search-form-' ) );
?>
<a href="#zk-header-search" class="mfp-search">
<span class="<?php echo esc_attr($args['icon']);?>"></span>
</a>
<div id="zk-header-search" class="mfp-hide">
<form role="search" method="get" class="search-form" action="<?php echo esc_url( home_url( '/' ) ); ?>">
<input type="search" id="<?php echo esc_attr($unique_id); ?>" class="search-field" placeholder="<?php echo esc_attr_x( 'Type something to search ...', 'placeholder', 'melokids' ); ?>" value="<?php echo get_search_query(); ?>" name="s" />
<button type="submit" class="search-submit"><span class="screen-reader-text"><?php echo _x( 'Search', 'submit button', 'melokids' ); ?></span></button>
</form>
</div>
<?php
}
}
?>
<form role="search" method="get" class="woocommerce-product-search form-inline" action="<?php echo esc_url( home_url( '/' ) ); ?>">
<input type="search" id="woocommerce-product-search-field-0" class="search-field form-control" placeholder="Search…" value="" name="s">
<button type="submit" id="searchsubmit" value="Search" class="btn">Search</button>
<input type="hidden" name="post_type" value="product">
</form>
try this

Wordpress: Add orderby field in search form

I have created a WordPress custom search form for a particular custom post type. The results are showing up in an order other than newest posts first. I would like the search results to be displayed with the newest custom posts first. Is there a hidden field that I can add to the search form, so the results will show in date order DESC?
I tried:
<input type="hidden" name="orderby" value="date" />
and
<input type="hidden" name="orderby" value="post_date DESC" />
but neither worked.
Here is my search form code:
<div class="event-search-form">
<form method="get" class="searchform" action="<?php echo esc_attr( $action ); ?>"<?php wpex_aria_landmark( 'searchform' ); ?>>
<input type="hidden" name="post_type" value="ai1ec_event" />
<input type="hidden" name="orderby" value="date" />
<input type="hidden" name="order" value="DESC" />
<label>
<span class="screen-reader-text"><?php echo esc_html( $placeholder ); ?></span>
<input type="search" class="field" name="s" placeholder="<?php echo esc_attr( $placeholder ); ?>" />
</label>
<?php if ( defined( 'ICL_LANGUAGE_CODE' ) ) : ?>
<input type="hidden" name="lang" value="<?php echo( ICL_LANGUAGE_CODE ); ?>"/>
<?php endif; ?>
<?php do_action( 'wpex_searchform_fields' ); ?>
<button type="submit" class="searchform-submit"><span class="fa fa-search" aria-hidden="true"></span><span class="screen-reader-text"><?php esc_html_e( 'Submit', 'total' ); ?></span></button>
</form>
</div>

WordPress login page error message customize and relocate

I have wordpress error mesages comming from wp-includes/user.php.
I have a customized Log in page(TML). I want to place the error messages after the input Fields.
At present they are validated and coming at the top of the from. I want to place the error message($template->the_errors(); ) after input fields(email and password accordingly).
<div id="signInPage">
<div id="blackSignInBox">
<h1>ONBoard Guide Sign-In</h1>
<!-- <p id="message">Enter your email addres and password provided</p> -->
<h2 id="mobileh1signin">ONBoard Guide<br /> Sign-In</h2>
<div class="tml tml-login" id="theme-my-login<?php $template->the_instance(); ?>">
<?php $template->the_action_template_message( 'login' ); ?>
<?php $template->the_errors(); ?>
<form name="loginform" id="loginform<?php $template->the_instance(); ?>" action="<?php $template->the_action_url( 'login', 'login_post' ); ?>" method="post">
<span class="input-wrap email sipage">
<label for="user_login<?php $template->the_instance(); ?>"><?php _e( 'Email', 'theme-my-login' ); ?></label>
<input type="text" name="log" id="user_login<?php $template->the_instance(); ?>" class="input" value="<?php $template->the_posted_value( 'log' ); ?>" size="20" />
<div class="error email-error">You have entered an invalid email. Try again.</div>
</span>
<span id="passSI" class="input-wrap password sipage">
<label for="user_pass<?php $template->the_instance(); ?>"><?php _e( 'Password', 'theme-my-login' ); ?></label>
<div id="inputContainer">
<input type="password" name="pwd" id="user_pass<?php $template->the_instance(); ?>" class="input" value="" size="20" autocomplete="off" />
<button type="button" id="showHide" onclick="passFunction()">Show </button>
</div>
<div class="error password-error">Please enter a password</div>
<p class="action-link lost-password"><?php $template->lost_pw_action_link(); ?></p>
</span>
<?php do_action( 'login_form' ); ?>
<span class="tml-submit-wrap sipage">
<button type="submit" name="wp-submit" id="wp-submit<?php $template->the_instance(); ?>" ><?php esc_attr_e( 'Sign In', 'theme-my-login' ); ?></button>
<input type="hidden" name="redirect_to" value="<?php $template->the_redirect_url( 'login' ); ?>" />
<input type="hidden" name="instance" value="<?php $template->the_instance(); ?>" />
<input type="hidden" name="action" value="login" />
</span>
</form>
<p class="action-link register">Don't have an account? <?php $template->register_action_link(); ?></p>
</div>
</div>
</div>

Wordpress loging form in a bootstrap modal

I want to load the wordpress login module in a bootstrap modal.
I want to put the following code in the modal body and work as real wordpress login form from that modal.
The modal will be created show up on click on a button/testlink
<form action="<?php wppb_curpageurl(); ?>" method="post" class="sign-in" name="loginForm">
<?php
if ( isset( $_POST['user-name'] ) )
$userName = esc_html( $_POST['user-name'] );
else
$userName = '';
if ( isset( $wppb_generalSettings['loginWith'] ) && ( $wppb_generalSettings['loginWith'] == 'email' ) )
$loginWith = __( 'Email', 'profilebuilder' );
else
$loginWith = __( 'Username', 'profilebuilder' );
$loginFilterArray['loginUsername'] = '
<p class="login-form-username">
<label for="user-name">'. $loginWith .'</label>
<input type="text" name="user-name" id="user-name" class="text-input" value="'.$userName.'" />
</p><!-- .form-username -->';
$loginFilterArray['loginUsername'] = apply_filters('wppb_login_username', $loginFilterArray['loginUsername'], $userName);
echo $loginFilterArray['loginUsername'];
$loginFilterArray['loginPassword'] = '
<p class="login-form-password">
<label for="password">'. __('Password', 'profilebuilder') .'</label>
<input type="password" name="password" id="password" class="text-input" />
</p><!-- .form-password -->';
$loginFilterArray['loginPassword'] = apply_filters('wppb_login_password', $loginFilterArray['loginPassword']);
echo $loginFilterArray['loginPassword'];
?>
<p class="login-form-submit">
<?php $button_name = __('Log in', 'profilebuilder'); ?>
<input type="submit" name="submit" class="submit button" value="<?php echo apply_filters('wppb_login_button_name1', $button_name); ?>" />
<?php
$loginFilterArray['rememberMe'] = '
<input class="remember-me checkbox" name="remember-me" id="remember-me" type="checkbox" checked="checked" value="forever" />
<label for="remember-me">'. __('Remember me', 'profilebuilder').'</label>';
$loginFilterArray['rememberMe'] = apply_filters('wppb_login_remember_me', $loginFilterArray['rememberMe']);
echo $loginFilterArray['rememberMe'];
?>
<input type="hidden" name="action" value="log-in" />
<input type="hidden" name="button" value="<?php echo apply_filters('wppb_login_button_name2', $submit); ?>" />
<input type="hidden" name="formName" value="login" />
</p><!-- .form-submit -->
<?php
if ($display === true){
$siteURL=get_option('siteurl').'/wp-login.php?action=lostpassword';
$siteURL = apply_filters('wppb_pre_login_url_filter', $siteURL);
$loginFilterArray['loginURL'] = '
<p>
'. __('Lost password?', 'profilebuilder').'
</p>';
$loginFilterArray['loginURL'] = apply_filters('wppb_login_url', $loginFilterArray['loginURL'], $siteURL);
echo $loginFilterArray['loginURL'];
}
wp_nonce_field('verify_true_login','login_nonce_field'); ?>
</form><!-- .sign-in -->
Just copy and paste below code in your template or file
<?php if (!(current_user_can('level_0'))){ ?>
<h2>Login Form</h2>
<form action="<?php echo get_option('home'); ?>/wp-login.php" method="post">
<input type="text" name="log" id="log" value="<?php echo wp_specialchars(stripslashes($user_login), 1) ?>" size="20" />
<input type="password" name="pwd" id="pwd" size="20" />
<input type="submit" name="submit" value="Send" class="button" />
<p>
<label for="rememberme"><input name="rememberme" id="rememberme" type="checkbox" checked="checked" value="forever" /> Remember me</label>
<input type="hidden" name="redirect_to" value="<?php echo $_SERVER['REQUEST_URI']; ?>" />
</p>
</form>
Recover password
<?php } else { ?>
logout<br />
admin
<?php }?>
I found an answer.Its easy.
http://codex.wordpress.org/Function_Reference/wp_login_form
In modal body just put the function name in a php tag.
<div class="modal-body">
<?php wp_login_form(); ?>
</div>

Resources