OpenCart is a very flexible system for effective SEO optimization. There are also many SEO extensions for OpenCart to facilitate the manual work. However, there are some of its features that do not interfere with the normal functioning of the website and are invisible to the normal eye, which can be a critical problem for SEO. One of these problems is the incorrect display of pages of a website built on OpenCart CMS in Google cache, or rather the way your pages are "seen" by Google bots.
Using the Google cache allows you to understand what content Google sees, analyzes, and crawls when a page is visited. This helps to determine whether certain elements of the site are accessible to Google and whether the page is rendered for a bot in the same way as for a regular user.
When Google indexes a website, it saves a cached copy of the page, which is used to quickly access its content. This cached version can be used by search engines to determine the relevance of the page to certain user requests. The problem arises because Google's cache includes the URL of the current page in the <base> tag, not the main page. Recall that the <base> tag sets the base URL for all relative URLs on the page. This leads to the fact that all relative URLs that connect scripts, styles, fonts, and images become invalid, their response is 404. As a result, the page is rendered without styles and scripts, fonts and images that have relative URLs. This negatively affects the appearance of the page and its functionality for search bots.
1. Incorrect page rendering
When Googlebot indexes a page and can't find the necessary scripts, styles, or images, it sees a page that looks very different from what a normal user sees. This can lead to incorrect indexing of the page because the bot does not understand its content properly.
2. Lowering the page ranking
Search engines like Google evaluate user experience (UX) when determining page rankings. If a bot sees a page that doesn't look right or function properly, it may consider it less relevant and lower its ranking in search results.
3. Loss of traffic
Incorrect indexing and lower rankings lead to a decrease in the visibility of the page in search engines, which in turn reduces organic traffic to the site. This can have a negative impact on the business, especially if a large share of visitors comes through search engines.
To check how a particular page looks like in Google's cache, add the prefix "cache:" in the address bar of your Google Chrome browser before the URL, for example, "cache:https://shop.com/product". The page in the cache will open, where the date of caching will be indicated. You can check all the problematic resources that did not connect on the page in the browser console (using Google Chrome as an example) by pressing the F12 button on the cache page and going to the Console tab.
Let's look at a specific example of a product page in OpenCart: https://demo.opencartbot.net/ua/macbook
And here is how this page looks like in Google cache: http://webcache.googleusercontent.com/search?q=cache%3Ahttps%3A%2F%2Fdemo.opencartbot.net%2Fua%2Fmacbook
When you follow this link, you can see that the page is loaded without styles, scripts, and some images. This is the result of an incorrect base URL in the <base> tag on the cache page, which makes all relative URLs incorrect. Thus, the Google bot sees the page as incomprehensible and non-functional, which leads to all the above problems. Unfortunately, we can't influence what URL Google adds to the <base> tag on cache pages, but there are other solutions, which we will discuss below. And you can check all the problematic resources that did not connect on the page in the browser console (for example, Google Chrome) by pressing the F12 button on the cache page and going to the Console tab.
1. Add a slash before relative addresses
This method will work only if the main page of the site is a domain address, i.e. if the site is not located in a separate folder on the domain. First of all, you need to check all the relative addresses that are in the header and footer templates, because this is where styles and scripts are usually connected. Add a slash before these relative addresses.
Here is a real example: open the file catalog/view/theme/default/template/common/header.twig
Look for the following:
<script src="catalog/...
and add a slash before the script address:
<script src="/catalog/...
Similarly for connected styles:
<link href="catalog/...
should look like this:
<link href="/catalog/
Save, update the modifier cache, theme cache and other caches that are available.
2. Use absolute URLs
Another solution is to switch to using absolute URLs for all resources (scripts, styles, images, etc.). This will ensure their correct connection regardless of how the page is displayed (in the cache or in real time). That is, before all relative addresses, add the domain address and, if necessary, the folder where the site is located.
3. Check with Google tools
Regularly check how your site is indexed using Google Search Console (GSC) webmaster tools. This will allow you to quickly identify and fix any issues related to page rendering. By pasting the URL into the GSC search field, you can check how all page resources are loaded. Keep in mind that Google ignores some images, fonts, and external scripts when loading the page, this is normal.
4. Submit corrected URLs for reindexing
This can be done through the same Google Search Console panel, but it will be much faster and more convenient to use a special module for OpenCart that works through the Google Indexing API.
Problems with the loading of some resources on pages in Google's cache can have a serious impact on website SEO. Correctly setting up the relative URL tag or using absolute URLs will help to avoid incorrect rendering of pages for search bots, which will ensure correct indexing and higher rankings in search results.
Sometimes, in the browser console in the Google cache, you can also see a problem with font connection due to cross-site server policy. It is on sites built on OpenCart that the problem with connecting the icon font - FontAwesome - is common. This problem is solved by adding a rule to pass the corresponding HTTP header to the .htaccess file located in the root directory of the site. Add the following rule to the end of the .htaccess file:
<IfModule mod_headers.c>
<FilesMatch "\.(ttf|ttc|otf|eot|woff|woff2|font.css|css)$">
Header set Access-Control-Allow-Origin "*"
</FilesMatch>
</IfModule>
Use our tips and information on search engine documentation, then you can speed up the crawling and ..
The correct structure of the site, headings and content is a key element of successful SEO, i.e. opt..
Basic SEO optimization in OpenCart is certainly present. This is the presence of meta tags such as T..
