Title tag not updated when using the head-tags package

modyydom · 27 January 2020 22:47

Can I ask a question

Why title is not updated with page name ?

David · 28 January 2020 09:50

Uhm, we need to answer some questions before:

Is that happening for every page or just a few? In what kind of pages?
What packages are installed in your project? (paste the output of running npx frontity info)
Did you set any value for state.frontity.title in your frontity.settings.js file?
Have you set any value for state.frontity.url in your frontity.settings.js file?
What SEO plugin are you using in your WordPress?

luisherranz · 28 January 2020 12:46

Do you have a <title></title> tag in your theme somewhere? It could be that your are overriding the one that the head-tags package is creating.

modyydom · 28 January 2020 17:04

As you can see that head_tags doesn’t have title tag

modyydom · 28 January 2020 17:10

for every page, post, category and …etc


## System:
 - OS: Windows 10 10.0.18362
 - CPU: (8) x64 Intel(R) Core(TM) i7-7700HQ CPU @ 2.80GHz
 - Memory: 1.18 GB / 15.89 GB
## Binaries:
 - Node: 12.13.1 - C:\Program Files\nodejs\node.EXE
 - npm: 6.11.3 - C:\Program Files\nodejs\npm.CMD
## Browsers:
 - Edge: 44.18362.449.0
 - Internet Explorer: 11.0.18362.1
## npmPackages:
 - bootstrap: ^4.4.1 => 4.4.1 
 - frontity: ^1.4.4 => 1.4.4 
 - frontity-contact-form-7: ^0.1.4 => 0.1.4 
 - prop-types: ^15.7.2 => 15.7.2 
 - react: ^16.12.0 => 16.12.0 
 - react-select: ^3.0.8 => 3.0.8 
 - react-slick: ^0.25.2 => 0.25.2 
 - react-spinners: ^0.8.0 => 0.8.0 
 - react-spring: ^8.0.27 => 8.0.27 
 - slick-carousel: ^1.8.1 => 1.8.1 
## npmGlobalPackages:
 - frontity: Not Found
 - npx: Not Found

No SEO plugins

thank you for you attention

luisherranz · 28 January 2020 19:28

Without SEO plugins, the title should be populated by your theme. What theme are you using?

modyydom · 28 January 2020 20:33

no theme also

luisherranz · 29 January 2020 16:24

Oh, that’s the problem. The head-tags plugin adds the tags found in the <head> of your WordPress. If there is no <title> tag, then it won’t show any.

dejangeorgiev · 6 July 2020 19:23

I have the same issue and i use twentytwenty theme. I have overwritten the title as i didn’t found any other solution.

github.com

dejangeorgiev/ruthgeorgiev-frontity/blob/master/packages/twentytwenty-theme/src/components/page-meta-title.js

import React, {useEffect} from "react";
import {Head, connect, decode} from "frontity";

const Title = ({state, actions}) => {
    // Get data about the current URL.
    const data = state.source.get(state.router.link);
    // Set the default title.
    let title = state.frontity.title;
    // Set the default description.
    let description = state.frontity.description;

    if (data.isTaxonomy) {
        // Add titles to taxonomies, like "Category: Italian - Blog Name" or "Tag: Asian - Blog Name".
        // 1. Get the taxonomy entity from the state to get its taxonomy term and name.
        const {taxonomy, name} = state.source[data.taxonomy][data.id];
        // 2. Uppercase first letter of the taxonomy term (from "category" to "Category").
        const taxonomyCapitalized =
            taxonomy.charAt(0).toUpperCase() + taxonomy.slice(1);
        // 3. Render the proper title.
        title = `${taxonomyCapitalized}: ${decode(name)} - ${state.frontity.title}`;

This file has been truncated. show original

Can you please help on how can i use the <title /> tag from Yoast e.g. head_tags

Thank you very much for your support.
Best,
Dejan

mburridge · 7 July 2020 16:47

Hi @dejangeorgiev

In your index.js file you have this import line:

import MetaTitle from "./page-meta-title";

which I think should be either:

import Title from "./page-meta-title";

and then you would use <Title /> on line 39, or if you want to keep line 39 as <MetaTitle/> then:

import Title as MetaTitle from "./page-meta-title";

Let me know if this fixes the problem.

dejangeorgiev · 7 July 2020 19:26

Hi @mburridge

Well, not sure if i explained the issue very well in my previous comment.
The thing is, i don’t get the value of the title that i add in Yoast SEO. (see Screenshots)
This is the title in Yoast:

This is what i get in the console (note that i override the title currently), but when i don’t do that, i get an empty title tag. Thus i can’t find the title tag into head_tags (see Screenshot from the developer console)

So, for clarification, currently i use “./page-meta-title” because i don’t want the title tag to be empty, but i can completely ignore this component if there is another solution from where i can get the Yoast SEO title in the “head_tags”

Hope you get my point.
Thank you very much for your support.
Best,
Dejan

mburridge · 8 July 2020 08:35

Hi @dejangeorgiev

Just to confirm, you are using the Head Tags plugin on your WordPress site, yes?

If you open your site using the WP theme, i.e. not Frontity, do you get the <title> in the <head> there?

David · 8 July 2020 12:12

Hey @dejangeorgiev, I checked your site and I can confirm that title tags are not included in the REST API response using our Head Tags plugin. It is strange because all other tags are there and they are fine.

What theme are you using in the WordPress site (https://admin.ruthgeorgiev.com)? Maybe is it generating the <title> tag in a different hook than wp_head?

dejangeorgiev · 8 July 2020 19:24

Hi @mburridge

Yes, i confirm i use the Head Tags plugin.

Yes, i get title when i use the WP Theme. Do you think this might be the issue?

dejangeorgiev · 8 July 2020 19:33

hi @David

I use a fully custom developed theme. Yes, i had the <title> tag and wp_head() in header.php but now i removed the title tag. Still can’t see it in Head Tags…

Thanks for your help.
Best,
Dejan

David · 9 July 2020 13:35

Hi again, @dejangeorgiev

What the REST API - Head Tags plugin does is to simply parse the HTML the wp_head action generates for each entity and adds the result to the head_tags fields. If the title tag doesn’t appear, that means it wasn’t gererated during the execution of wp_head action.

Regarding how to add the <title> tag, there are two types of WordPress themes:

Those which let WordPress to add it automatically
Those which add it themselves

To let WordPress add the <title> tag, a theme should execute the following code:

function theme_slug_setup() {
  add_theme_support( 'title-tag' );
}
add_action( 'after_setup_theme', 'theme_slug_setup' );

That way, WordPress will render the title when the wp_head action is called. The function in charge of doing so is _wp_render_title_tag (defined in wp-includes/general-template.php) which is added to the wp_head hook in the wp-includes/default-filters.php file.

That’s the ideal solution, but if you don’t want WordPress to add the title automatically, the theme would have to add it somewhere (in functions.php, for example):

function theme_slug_render_title() {
  echo '<title>' . wp_title( '|', true, 'right' ) . '</title>' . "\n";
}

add_action( 'wp_head', 'theme_slug_render_title' );

Any of these options should work.

Try it out and let us know.

PS: Do not forget to clear the plugin cache right after!

dejangeorgiev · 9 July 2020 19:51

Hi @David

Thank you very much David for your support. I added this one and it works!

David:

To let WordPress add the <title> tag, a theme should execute the following code:
function theme_slug_setup() {
  add_theme_support( 'title-tag' );
}
add_action( 'after_setup_theme', 'theme_slug_setup' );

Best,
Dejan