Map not working, buttons not clickable - What to know about minification?

  • Updated

Depending on your website configuration, you may find that some Showcase IDX widgets do not perform the way they are supposed to.

An example of this would be a map showing as a grey box, your search bar widget buttons not responding to being clicked or your plugin is looking out of whack and has pushed all of your Showcase IDX data over to the left of the screen.

 

Screen_Shot_2020-09-10_at_4.26.04_PM.png

When this happens, it is usually because of something called Minification.

What is Minification?

Minification is a process to reduce the file size of your websites with the intention of speeding up the loading time. It removes whitespace and unnecessary characters from your HTML, CSS, and Javascript code (the files that are sent to your visitor’s browsers). This includes removing unneeded line-breaks, code such as comments, and even shortens variables and function names.

This reduces the size of your web page, which reduces the number of external requests and improves your website’s loading speed, which is important for your site’s SEO. Faster loading also improves the user experience (UX) of your website and helps keep your readers happy.


What does that mean to customers?

Our IDX is minified out of the box for a number of reasons. A multiple listing service gives us a lot of data. We're talking hundreds of thousands of images and thousands of listings and fields that we process and turn into a nice looking search on your site. Sometimes, if you're co-mingling multiple data feeds from several MLSs, that can double or triple! As we minify our plugin, we limit the load that it has on your website. Isn't that a nice feature?

Most people use caching or optimization plugins to help boost their performance and speed up their sites. This is a great thing to do, especially if you have a static website that doesn't change often. Since Showcase IDX is a dynamic plugin that is ever-changing as listings come and go and get updated, caching or using minify on top of our minification can often time cause the plugin to break if not configured properly, resulting in a console error that looks like this.

Screen_Shot_2019-09-19_at_10.46.23_AM.png

To view the console when visiting your website, you can right-click on the page, click Inspect and then select Console from the options.

Screen_Shot_2020-09-10_at_4.28.11_PM.png

What can you do?


Depending on the plugin you are using (either Caching plugins like WP Rocket, WP Fastest Cache, or optimize plugins like Autoptimize, SG Optimize, WP Rocket, etc.), they will often have Minify settings for CSS, HTML, and JavaScript (JS). We suggest turning these off and purging the cache. This will fix the issue 99% of the time. If you are dead-set on using these settings, check to see if your plugin gives you the option to exclude URLs or certain pages from having those settings being applied to them. You could then try to exclude the main search page or specific plugins from those settings.

Another place that could have these settings would be within your theme. It's very rare to see this in a theme but it does happen. If you check your theme settings (check for something called PERFORMANCE) and this is an option that is present, turn it off and purge the cache. If the theme doesn't have an option to disable minify, we absolutely suggest switching themes to test this out as Showcase IDX might not be compatible with their minification. It might mean reaching out to the theme's support to checking if they do any in-house caching or minifying if it's not clear in the settings. A theme that does this is the Salient theme. We do not work with Salient theme.

There may also be minified settings at the host level. We often see this when they are using Cloudflare. We are compatible with Cloudflare if you choose to use it, but again, we suggest being careful with how you configure the settings in regards to minification. Some folks use Cloudflare just for their DNS and then rely on a combination of other solutions for caching and minify. Do not use Rocket Loader.

If none of the above apply to your website set up, it could be an issue with the module used with your website builder. For example, when using a site builder like Elementor or Divi, they will give you options to use a code module or a text module. Typically, the shortcodes render best in a text module but, depending on the builder, they may render best in a code module. If you're getting the same error, try the opposite module and see if that fixes things.

Ultimately, we can't tell you what is best to do for your website and this might require testing out different solutions to see what works best with your host and site configuration. If you're not sure what is causing the issue and would like for us to evaluate your website, you can always submit a support ticket. Please provide your WordPress login so we can have a look!