Kris

Hi @snowdragon97!

Here’s the updated code that now supports both desktop and mobile menus. Although it will eventually be integrated into the FiboSearch core, I don’t have a confirmed release date at this time. In the meantime, please apply it separately to all websites.

@media (min-width: 960px) {
	#menu-footer-menu {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: end;
		-ms-flex-pack: end;
		justify-content: flex-end;
	}
}

@media (max-width: 959px) {
	.menu-primary ul.menu-smart a.dgwt-wcas-enable-mobile-form {
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
	}
	
	.dgwt-wcas-search-wrapp {
		margin: 0;
		padding: 5px 36px;
	}
}

Best regards,
Kris

Hi @leebrewerftl!

Here’s what you can do more:

1. Backup your database
2. Try to use a plugin called Database Collation Fix. This should convert tables to the right format. As the author says:

The Database Collation Fix tool converts database tables using ‘utf8mb4_unicode_520_ci’ or ‘utf8_unicode_520_ci’ Collation Algorithms to a more portable ‘utf8mb4_unicode_ci’ collation on a once daily basis. It also modifies any column-specific collation statements, not just the default table collation. This means that you can install this plugin and it will continue to monitor all of your database tables and convert them to the more portable Collation Algorithm automatically.

Dave Jesch

If the above steps don’t resolve the issue, you can always contact your hosting provider for assistance. They can analyze the database, identify the problem, and potentially fix it for you.

Best regards,
Kris

Hi @mhabeeb!

Thanks for reporting this. We will fix it in a future version. When it is ready, we will let you know in this thread.

Best regards,
Kris

Hi @leebrewerftl!

This issue arises because the query utilizes the LIKE operator with text containing special characters, such as ＳＯＣとは, which are part of the utf8mb4 character set.

To resolve this problem, verify the database configuration in the wp-config.php file to ensure it is correctly set. Specifically, check the following:

define( 'DB_CHARSET', 'utf8mb4' );
define( 'DB_COLLATE', 'utf8mb4_unicode_ci' );

Best regards,
Kris

Hi @snowdragon97!

Have you set the color in WooCommerce → FiboSearch → Search Bar (tab) → Other Colors (section)? Please refer to this screenshot for guidance. Make sure to update the settings there first.

However, remember that your theme might still override the background settings. To ensure the background displays correctly, you can use the following CSS:

html:not(.dgwt-wcas-overlay-mobile-on) .dgwt-wcas-style-pirx.dgwt-wcas-style-pirx-compact .dgwt-wcas-sf-wrapp input[type=search].dgwt-wcas-search-input {
	background: #0a0a0a !important;
}

Paste it into Appearance -> Customize -> Additional CSS. If you aren’t familiar with custom CSS, take a look at this video.

Best regards,
Kris

Hi @snowdragon97!

Use the following CSS to resolve the issue:

#menu-footer-menu {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: end;
	-ms-flex-pack: end;
	justify-content: flex-end;
}

Paste it into Appearance -> Customize -> Additional CSS. If you aren’t familiar with custom CSS, take a look at this video.

Best regards,
Kris

Hi @trevellfr!

Yes, I believe this is necessary for FiboSearch to function properly. However, the amount of CSS involved isn’t substantial. In fact, nearly all of it is actively used, and the FiboSearch styles file itself is compact, minified, and weighs just 37 KB.

Best regards,
Kris

Hi @valletinformatique44!

By default, FiboSearch calculates product scores using several factors, which determine their ranking in the autocomplete list. A higher score results in a higher position. Based on the Baymard Institute’s guidelines and recent UX research, we generally recommend not altering the default sorting in autocomplete. This approach ensures a user-friendly and intuitive experience.

However, if you choose to customize the product sorting, you can do so by using dgwt/wcas/search_results/output the filter. The below example shows how to sort products by results alphabetically (A-Z).

// Sort search results alphabetically
add_filter( 'dgwt/wcas/search_results/output', function( $output ) {
	if ( isset( $output['suggestions'] ) ) {
		usort( $output['suggestions'], function ( $a, $b ) {
			if ( isset( $a['type'] ) && $a['type'] == 'product' &&
				 isset( $b['type'] ) && $b['type'] == 'product'  ) {
				if ( $a['value'] != $b['value'] ) {
					return $a['value'] <=> $b['value'];
				}
			}
		});
	}

	return $output;
} );

You have two ways to add this code to your theme:

1. Open the functions.php in your child theme and add the code at the end.
2. or install the Code Snippets plugin and apply this code as a snippet.

Best regards,
Kris