This topic has 15 replies, 2 voices, and was last updated 10 years by 
-
-
@abe: Starting a new topic since I can’t add to the sticky topic anymore.
I’m requesting that you consider disabling the enter key as suggested in the other topic. I’m currently working on updating your vc search form shortcode to include a search context field so admins can narrow searches to just members or groups or whatever else. In doing so, I’ve been using your search form on the pinterest page. I had no idea that it was actually a live search form because I was typing in my search term and hitting the enter key before the results would show up. Furthermore, the enter key is always going to default to a post search. It seems to me that the search button isn’t even needed anymore.
Also, I love the styling you did 🙂
This support site is not about custom work. If you need custom development please contact cornel@seventhqueen.com
Also, I just noticed a styling issue on mobile. The ‘page/post’ view all results background is black. I couldn’t fit all the results into a single screenshot from my phone, so here’s two of them.
Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solutionThis support site is not about custom work. If you need custom development please contact cornel@seventhqueen.com
Hello, You can’t post to the sticky any more?
I am extending the functionality too so you could choose where to search in from the shortcode and I will put a checkbox for ajax search and to disable the enter key. I will try to finish today and give you an update with the code.We did some changes to the styling so look now on the demo: http://seventhqueen.com/themes/kleo/e-learning-home/
Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution---
@ SeventhQueen we do our best to have super happy customers. Thanks for being our customer.Were you telling me to look at the demo because you resolved the phone issue? If so, its still has a black background for view all results. The rest of it looks great and probably is better that you left out the excerpts.
Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solutionThis support site is not about custom work. If you need custom development please contact cornel@seventhqueen.com
What phone are you using? I have tested it on a Samsung Galaxy S4 and looks like this
Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution---
@ SeventhQueen we do our best to have super happy customers. Thanks for being our customer.Chrome on Samsung S4 🙂 Lemme try a different browser
Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solutionThis support site is not about custom work. If you need custom development please contact cornel@seventhqueen.com
Clearing the cache on my phone did the trick. Its looks great!
Hey, can you put either a magnifying glass or the word search in the box? My users will have no idea that’s a search box. :/
Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solutionThis support site is not about custom work. If you need custom development please contact cornel@seventhqueen.com
Oh, and to answer your question about not being able to post to ‘stick’ topics. It because its in the FAQ forum now
“The forum ‘KLEO – FAQ’ is closed to new topics and replies.”
Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solutionThis support site is not about custom work. If you need custom development please contact cornel@seventhqueen.com
I’ll do that, put a search placeholder in the search form.
Also I have made the FAQ public again so replies are opened now.Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution---
@ SeventhQueen we do our best to have super happy customers. Thanks for being our customer.Well, here goes the updated files for the search form changes 🙂
I have added the context attribute to filter the search only by content selected and it will apply to ajax too. Also I have added an option to disable ajax or form submit.wp-content/plugins/k-elements/shortcodes/shortcodes.php
COPY CODEfunction kleo_search_form_func( $atts, $content = null ) { $form_style = $type = $placeholder = $context = $el_class = ''; extract(shortcode_atts(array( 'form_style' => 'default', 'type' => 'both', 'context' => '', 'placeholder' => '', 'el_class' => '' ), $atts)); global $kleo_config; $class = ''; if ($el_class != '') { $class = ' '. $el_class; } $class .= ' search-style-'. $form_style; //Defaults $action = home_url( '/' ); $hidden = ''; $input_name = 's'; $ajax_results = 'yes'; $search_page = 'yes'; if ( $type == 'ajax' ) { $search_page = 'no'; } elseif ( $type == 'form_submit' ) { $ajax_results = 'no'; } if ( function_exists('bp_is_active') && $context == 'members' ) { //Buddypress members form link $action = bp_get_members_directory_permalink(); } elseif ( class_exists('bbPress') && $context == 'forum' ) { $action = bbp_get_search_url(); $input_name = 'bbp_search'; } elseif ( $context == 'product' ) { $hidden .= '<input type="hidden" name="post_type" value="product">'; } $output = '<div class="kleo-search-wrap kleo-search-form'. $class .'">'; $output .= '<form role="search" method="get" id="searchform" ' . ($search_page == 'no' ? ' onsubmit="return false;"' : '') . ' action="' . $action . '" data-context="'. $context .'"> <div class="input-group"> <input name="' . $input_name . '" id="' . $input_name . '" autocomplete="off" type="text" class="ajax_s form-control input-lg" value="" placeholder="' . $placeholder . '"> <span class="input-group-btn"> <input type="submit" value="Search" id="searchsubmit" class="button"> </span> </div> '.$hidden.' </form>'; if ($ajax_results == 'yes' ) { $output .= '<span class="kleo-ajax-search-loading"><span class="kleo-loading-icon"></span></span><div class="kleo_ajax_results"></div>'; } $output .= '</div>'; return $output; }wp-content/plugins/k-elements/compat/plugin-js-composer/config.php around 2302
COPY CODE/* Search form */ $kleo_post_types = array(); if ( function_exists( 'bp_is_active' ) ) { $kleo_post_types['Members'] = 'members'; } $kleo_post_types['Posts'] = 'post'; $kleo_post_types['Pages'] = 'page'; $args = array( 'public' => true, '_builtin' => false ); $types_return = 'objects'; // names or objects, note names is the default $post_types = get_post_types( $args, $types_return ); $except_post_types = array('kleo_clients', 'kleo-testimonials', 'topic', 'reply'); foreach ( $post_types as $post_type ) { if ( in_array( $post_type->name, $except_post_types ) ) { continue; } $kleo_post_types[$post_type->labels->name] = $post_type->name; } vc_map( array( 'base' => 'kleo_search_form', 'name' => 'Search Form', 'weight' => 6, 'class' => 'kleo-search', 'icon' => 'kleo-search', 'category' => __("Content",'js_composer'), 'description' => __('Insert search form','kleo_framework'), 'params' => array( array( "param_name" => "form_style", "type" => "dropdown", "holder" => "div", "class" => "hide hidden", "heading" => __("Form Style"), "value" => array( 'Default' => 'default', 'Transparent' => 'transparent' ), "description" => 'This affects the look of the form. Default has a border and works for white backgrounds.' ), array( "param_name" => "type", "type" => "dropdown", "holder" => "div", "class" => "hide hidden", "heading" => __("Form Type"), "value" => array( 'Form submit + AJAX results' => 'both', 'Just Form Submit' => 'form_submit', 'Just AJAX results' => 'ajax' ), "description" => 'Here you can disable Form Submit or AJAX results.' ), array( "param_name" => "context", "type" => "checkbox", "holder" => "div", "class" => "hide hidden", "heading" => __("Search context"), "value" => $kleo_post_types, "description" => 'What content do you want to search for. If you select just Members then the form submit will go to members directory. Same applies for Forums and Products.' ), array( "type" => "textfield", "holder" => "div", "class" => "", "heading" => __("Placeholder"), "param_name" => "placeholder", "value" => '', "description" => __("Placeholder to show when the input is empty") ), $el_class ) ) );wp-content/themes/kleo/lib/theme-functions.php
COPY CODEfunction kleo_ajax_search() { //if "s" input is missing exit if( empty( $_REQUEST['s'] ) ) die(); $output = ""; $context = "any"; $defaults = array( 'numberposts' => 4, 'post_type' => $context, 'post_status' => 'publish', 'post_password' => '', 'suppress_filters' => false, 's' => $_REQUEST['s'] ); if ( isset( $_REQUEST['context'] ) ) { $context = explode( ",", $_REQUEST['context'] ); $defaults['post_type'] = $context; } $defaults = apply_filters( 'kleo_ajax_query_args', $defaults); $query = http_build_query( $defaults ); $posts = get_posts( $query ); $members = array(); $members['total'] = 0; if ( function_exists( 'bp_is_active' ) && ( $context == "any" || in_array( "members", $context ) ) ) { $members = bp_core_get_users(array('search_terms' => $_REQUEST['s'], 'per_page' => $defaults['numberposts'], 'populate_extras' => false)); } //if there are no posts nor members if( empty( $posts ) && $members['total'] == 0 ) { $output = "<div class='kleo_ajax_entry ajax_not_found'>"; $output .= "<div class='ajax_search_content'>"; $output .= "<i class='icon icon-exclamation-sign'></i> "; $output .= __("Sorry, we haven't found anything based on your criteria.", 'kleo_framework'); $output .= "<br>"; $output .= __("Please try searching by different terms.", 'kleo_framework'); $output .= "</div>"; $output .= "</div>"; echo $output; die(); } //if there are members if ( $members['total'] != 0 ) { $output .= '<div class="kleo-ajax-part kleo-ajax-type-members">'; $output .= '<h4><span>' . __("Members", 'kleo_framework') . '</span></h4>'; foreach ( (array) $members['users'] as $member ) { $image = '<img src="' . bp_core_fetch_avatar(array('item_id' => $member-> ID, 'width' => 25, 'height' => 25, 'html' => false)) . '" class="kleo-rounded" alt="">'; if ( $update = bp_get_user_meta( $member-> ID, 'bp_latest_update', true ) ) { $latest_activity = "<br>" . char_trim( trim( strip_tags( bp_create_excerpt( $update['content'], 50,"..." ) ) ) ); } else { $latest_activity = ''; } $output .= "<div class ='kleo_ajax_entry'>"; $output .= "<div class='ajax_search_image'>$image</div>"; $output .= "<div class='ajax_search_content'>"; $output .= "<a href='" . bp_core_get_user_domain( $member->ID ) . "' class='search_title'>"; $output .= $member->display_name; $output .= "</a>"; $output .= "<span class='search_excerpt'>"; $output .= $latest_activity; $output .= "</span>"; $output .= "</div>"; $output .= "</div>"; } $output .= "<a class='ajax_view_all' href='" . bp_get_members_directory_permalink() . "?s=" . $_REQUEST['s'] . "'>" . __('View member results','kleo_framework') . "</a>"; $output .= "</div>"; } //if there are posts if( ! empty( $posts ) ) { $post_types = array(); $post_type_obj = array(); foreach ( $posts as $post ) { $post_types[$post->post_type][] = $post; if (empty($post_type_obj[$post->post_type])) { $post_type_obj[$post->post_type] = get_post_type_object($post->post_type); } } foreach ($post_types as $ptype => $post_type) { $output .= '<div class="kleo-ajax-part kleo-ajax-type-' . esc_attr( $post_type_obj[$ptype]->name ) . '">'; if (isset($post_type_obj[$ptype]->labels->name)) { $output .= "<h4><span>" . $post_type_obj[$ptype]->labels->name . "</span></h4>"; } else { $output .= "<hr>"; } foreach ($post_type as $post) { $format = get_post_format($post->ID); if (get_the_post_thumbnail($post->ID, 'thumbnail')) { $image = get_the_post_thumbnail($post->ID, 'thumbnail'); } else { if ($format == 'video') { $image = "<i class='icon icon-video'></i>"; } elseif ($format == 'image' || $format == 'gallery') { $image = "<i class='icon icon-picture'></i>"; } else { $image = "<i class='icon icon-link'></i>"; } } $excerpt = ""; if (!empty($post->post_content)) { $excerpt = "<br>" . char_trim(trim(strip_tags(strip_shortcodes($post->post_content))), 40, "..."); } $link = apply_filters('kleo_custom_url', get_permalink($post->ID)); $classes = "format-" . $format; $output .= "<div class ='kleo_ajax_entry $classes'>"; $output .= "<div class='ajax_search_image'>$image</div>"; $output .= "<div class='ajax_search_content'>"; $output .= "<a href='$link' class='search_title'>"; $output .= get_the_title($post->ID); $output .= "</a>"; $output .= "<span class='search_excerpt'>"; $output .= $excerpt; $output .= "</span>"; $output .= "</div>"; $output .= "</div>"; } $output .= '</div>'; } $output .= "<a class='ajax_view_all' href='" . home_url( '/' ) . '?s=' . $_REQUEST['s'] . "'>" . __('View all results', 'kleo_framework') . "</a>"; } echo $output; die(); }Add this in wp-content/themes/kleo/assets/js/app.js around line 1548, after
COPY CODEvalues += "&action=kleo_ajax_search";COPY CODEif ( form.data('context') ) { values += "&context="+form.data('context'); }Hope I haven’t missed any 🙂
Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution---
@ SeventhQueen we do our best to have super happy customers. Thanks for being our customer.I just need to add the forums AJAX results to it
Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution---
@ SeventhQueen we do our best to have super happy customers. Thanks for being our customer.I’ll test it over coffee tomorrow AM. The code looks great though. Probably because there’s not a single line of my code left in it. LOL. Thanks Abe. 🙂
Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solutionThis support site is not about custom work. If you need custom development please contact cornel@seventhqueen.com
haha, not true, you inspired it 🙂
Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution---
@ SeventhQueen we do our best to have super happy customers. Thanks for being our customer.Abe. Can you attach function kleo_ajax_search in a text file. The pre tags dont parse out the image or link tags well on here. 🙁
Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solutionThis support site is not about custom work. If you need custom development please contact cornel@seventhqueen.com
Its also missing the bit where $kleo_post_types is defined so there’s no checkboxes under Search Context in the VC form.
Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solutionThis support site is not about custom work. If you need custom development please contact cornel@seventhqueen.com
I have edited the code with the vc_map and it was missing some code before it. Here is the attached file for the ajax search form
Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution---
@ SeventhQueen we do our best to have super happy customers. Thanks for being our customer.
The forum ‘KLEO’ is closed to new topics and replies.
