Re: Help on favicon and SEO title

Crystalwclee · ‎10-15-2024

Hi, I need help on 2 things on favicon and web title please.

1. My favicon for different page of my website display differently. The images attached as an example of 2 different favicon when I open different pages of my website. How to make all pages updated with my new favicon uploaded?

2. How to change web title name next to favicon to be just the name of the page. For example, I want the title to be just "Aromatic Ingredients", instead of "Aromatic Ingredients <link rel: icon>....". How to remove it?

K_Br4 · ‎10-15-2024

I think there is some custom HTML code added somewhere and you need to find it and remove it.

rajweb · ‎10-15-2024

Hey @Crystalwclee ,

it could be due to caching issues or improper implementation.

Updating the Favicon Across All Pages

Follow these steps:

1. Online Store > Theme > Edit Code

2. Open the theme.liquid file.

3. Look for any <link rel="icon" tags and ensure they point to the same favicon URL.

4. Update the favicon file if necessary. To do this, upload your favicon image in Setting > Files and copy the URL.

Add or update the link in the <head> section:

<link rel="icon" type="image/png" href="{{ 'favicon.png' | asset_url }}">

Clear Cache:

After making changes, clear your browser cache or test in an incognito window to see the updates. It may take some time for changes to reflect due to caching.

Changing the Web Title

To change the web title to reflect just the name of the page (like "Aromatic Ingredients"), you can do the following:

Edit the Page Title

Follow these steps:

1. Online store > Pages.

2. Click on the specific page (e.g., "Aromatic Ingredients").

3. Change the Page Title field to your desired title (e.g., "Aromatic Ingredients"). This title will appear in the browser tab.

Remove Unnecessary Tags: If there are still extra tags like <link rel= "icon" showing up, check the theme.liquid file or the specific template files (like product or collection pages) for any manual title tags that may be added. You should have a section like this:

<title>{{ page.title }} - {{ shop.name }}</title>

You can customize it based on your needs. To only show the page name:

<title>{{ page.title }}</title>

After making these changes, be sure to save your files and refresh your pages to see the updates.

If I managed to help you then, don't forget to Like it and Mark it as Solution!

Best Regard,

Rajat Sharma

-Need a Shopify developer?
https://rajatweb.dev/
Email: rajat.shopify@gmail.com

Crystalwclee · ‎10-15-2024

Hi Rajat,

Thanks for your help! While waiting for the favicon to reflect, let us discuss on the web title change.

I followed your guide to go under >Pages but I don't think it's the issue there. Even my home page on Google has the extra tags after my brand name. Every link I click, there's the extra tags reflecting on my window tags.

rajweb · ‎10-15-2024

Thank you for the screenshot! It looks like the title in Google search results is incorrectly including parts of the <link rel="icon"> HTML code.

Follow these steps:

1. Online Store > Themes > Edit Code.

2. Open theme.liquid.

3. In the <head> section, make sure it looks like this:

<title>{{ page_title }}</title>
<link rel="icon" href="{{ 'favicon.png' | asset_url }}" type="image/png">

Remove any <link> or extra HTML tags from inside the <title> tag.

Check Google Search Console:

1. Go to Google Search Console and use the URL Inspection Tool.

2. Click Request Indexing to update Google’s view of your site.

This will clean up the title tags and remove the <link rel="icon" issue from your titles.

thanks

-Need a Shopify developer?
https://rajatweb.dev/
Email: rajat.shopify@gmail.com

Crystalwclee · ‎10-16-2024

Hi Rajat,

Both favicon and title work well now! Thank you!

However, I have another problem which is the meta title and description on Google search. I'm not sure why on Google the title still have extra tags and the description did not match what I input on shopify. Where and how could I fix this?

rajweb · ‎10-16-2024

Hey Crystalwclee,

Glad to hear the favicon and titles are working now! Let's quickly address the issue with your meta title and description on Google.

Follow these steps to Fix Meta Title and Description Issues:

1. Online Store > Pages (for regular pages) or Product/Collections (for product/collection pages).

2. Open the specific page, product, or collection.

3. Scroll down to Search Engine Listing preview.

4. Ensure the Meta title and Meta description match what you want Google to display. If not, update them here.

Check Meta Tags in Theme Files:

1. Online Store > Themes > Action > Edit Code.

2. Open theme.liquid or relevant template files (product.liquid, collection.liquid , etc.).

Ensure your meta tags look like this inside the <head> section:

<title>{{ page_title }}</title>
<meta name="description" content="{{ page_description }}">

Check for SEO App Interference

If you use an SEO app, verify that it isn't overriding the Shopify meta title and description settings.

Use Google Search Console to Re-index Your Pages
1. Go to Google Search Console
2. Use the URL Inspection Tool to enter the affected URL(s).
3. Click Request Indexing to ask Google to re-crawl your site.

Let me know if this helps or if you encounter any further issues!

Thanks

-Need a Shopify developer?
https://rajatweb.dev/
Email: rajat.shopify@gmail.com

Crystalwclee · ‎10-16-2024

Hi Rajat,

I have tried your suggestions and please see the screenshot below to check if I'm doing it right. However, nothing has changed on Google search and I suspect that Google hasn't picked up yet. The page title, page description has remained the same. I have also found that when I clicked on my domain showed on Google search, my domain link seems to have extra characters behind my domain link (my domain is compoundcosmetics.com). Please see picture below for better understanding.

rajweb · ‎10-16-2024

Look for Canonical Tags:

1. Check if your theme includes a canonical tag for each page to help Google identify the preferred version of your content.

2. It should look like this in your HTML:

<link rel="canonical" href="https://compoundcosmetics.com/page-url">

Extra Characters in Domain Link:

1. The extra characters in your domain link may be tracking parameters or session IDs. If you’ve linked to your site with parameters, ensure those links are cleaned up:

Example: If your link appears as (https://compoundcosmetics.com/?utm_source...), you might want to avoid linking like this unless necessary for analytics.

Google Search Console:

Use the URL Inspection Tool in Google Search Console:

Enter the specific URL showing issues.
Click on Request Indexing after confirming that your meta tags are correct.

Make sure there aren’t multiple pages with similar content that could confuse Google regarding which page to prioritize in search results.

Review SEO Settings:

If you're using any SEO apps or plugins, double-check their settings to ensure they’re not overriding Shopify's default settings.

Thanks

-Need a Shopify developer?
https://rajatweb.dev/
Email: rajat.shopify@gmail.com

Re: Help on favicon and SEO title

Help on favicon and SEO title

Check for SEO App Interference

Use Google Search Console to Re-index Your Pages

Community Blog Articles