Add Custom Meta as a submodule (Custom Metatags UI)

I'll raise the PR as I'll get the greenlight.

Just came across this and I think it would indeed make sense to integrate "Custom Metatags" ( https://www.drupal.org/project/custom_meta → ) as a submodule. But it should then better fit the UX from Metatags.

While Metatag perfectly supports all standard meta tags, you sometimes run into situations, where you need to add futher custom meta tags, for example for Domain Owner Validation and other cases which don't make sense to handle by adding these meta tags statically in Metatags.

The main benefit if having custom_meta as submodule in Metatags is to have Metatag more feature-complete and have a combined, convenient UI / UX, where you add these custom tags instead of a further separate module (where you wouldn't expect them).

Currently Metatags seems to lack such a functionality, right?

So +1 but it will need some work to integrate it flawlessly!

Currently you'd need to write code to define such metatags, I think? See #1466292: Document all Metatag's hooks → (D7)

@Anybody, Thanks for your inputs and linking to the old issue.
Looking forward to hearing what @DamienMcKenna thinks and share your wisdom on how to move it forward

I think the next steps should be:
* Copy the module over and rename it to "metatag_custom_tags".
* Improve the module so it's more flexible.

    $custom_meta_settings = \Drupal::config('custom_meta.settings');
    $custom_meta = $custom_meta_settings->get('tag') ?? [];

Storing multiple things inside a single settings config seems rather weird and cumbersome. It's also going to make managing site config harder for site builders, because all the metatag definitions are in one config file. This seems like a clear case for a config entity.

Moving the moving into this project would be a good time to create a new major version.

Moving the moving into this project would be a good time to create a new major version.

@joachim Happy to add you as a co-maintainer of custom_meta if you're interested in building a major version in the custom_meta contributed module OR we could build it in this issue

Moving the moving into this project would be a good time to create a new major version.

This would go into the next minor release of Metatag, per semver.

Assigning this to myself. I will be trying to port this module as a sub-module.

A WIP MR has been raised. I will be working the following now:

• Converting the configurations to Config Entity.
• Code standards and improvements.

Looks for more feedbacks. Thank you.

Apologies for the delay. I attempted to debug the failed test cases but was not successful. I will continue investigating, but I'm leaving this issue open for the community to assist.

FYI the 10.2.x test failures are being worked on in 📌 Adapt tests for Drupal 10.2 Needs work .

Looks like the custom metatag save is not working. It's expected to come to /admin/config/search/metatag/custom-meta path here https://git.drupalcode.org/project/metatag/-/merge_requests/94/diffs#c3a...
However it's still stuck at /admin/config/search/metatag/custom-meta/add page

Upon reviewing the test cases, I found that most of the failed cases are related to:

Drupal\Tests\metatag_custom_tags\Functional\CustomMetaTagPropertyTest::testCustomMetaTagPropertyWithPrefix
Behat\Mink\Exception\ExpectationException: Current page is "/admin/config/search/metatag/custom-meta/add", but "/admin/config/search/metatag/custom-meta" expected.

Which basically points to a single file: https://git.drupalcode.org/project/metatag/-/merge_requests/94/diffs#c3a...

I think the values are not set correctly, so the page redirection is not happening. To confirm if the data is stored, I check the page redirection and the confirmed saved message.

I also tried using the page session variable to save the values, but it didn't help redirecting the page after saving successfully.

    $page = $this->getSession()->getPage();

    $page->selectFieldOption('attribute', $attribute);
    $page->fillField('label', 'foo');
    $page->fillField('description', 'foo description');
    $page->pressButton('Save');

The tests are fixed. Setting the issue for review

Let's try to finish this for the upcoming 2.1.0 release.

This is really good work, thank you!

Reviewing the MR I have a few requests that would make it more robust:

• It needs to be able to control the tag name itself, as not all tags will be "meta" tags.
• It needs to be able to control the attribute where the value is stored. Wile most tags use "content", the "link" tag uses "href", so how would this be able to handle that scenario?
• All of the tests could be combined into one single test class with multiple test methods.

Otherwise this is really close.

#23

It needs to be able to control the tag name itself, as not all tags will be "meta" tags.
It needs to be able to control the attribute where the value is stored. Wile most tags use "content", the "link" tag uses "href", so how would this be able to handle that scenario?

Thanks for raising it. I have accommodated that scenario. Please se

All of the tests could be combined into one single test class with multiple test methods.

Initially I merged all of them into single test class but then the administration and Tag testing should be part of the separate tests.
Sending back to review again

Some additional feedback:
* I think the tab label is too confusing - what does "Metatag Custom Tags" mean? How about "Custom meta tags" or even just "Custom tags"?
* The labels on the form should be simplified to make it easier for a non-developer to understand, or at least someone who hasn't looked at the innards of a Metatag Tag plugin.
* It would be useful to provide an example of how the pieces fit together, either directly in the form or via hook_help().
* It would also be useful to control the group that the tags show up in.
* The custom group label should be easier to understand, e.g. "Custom tags".
* The Metatag plugin cache needs to be cleared when a custom tag is created or modified.
* The demo "sitename" tag needs improvements so it's clear what the values mean, e.g. just having "Sitename" as the description doesn't make it clear what it means or does.

Forgot to add: the improvements are definitely working great, thank you for adding those naveenvalecha!

@DamienMcKenna
Thank you for the feedback!

* I think the tab label is too confusing - what does "Metatag Custom Tags" mean? How about "Custom meta tags" or even just "Custom tags"?

I have changed it to "Custom tags"

* The labels on the form should be simplified to make it easier for a non-developer to understand, or at least someone who hasn't looked at the innards of a Metatag Tag plugin.

I have made it simpler now with more meaningful names. I'm open to accomodate more suggestions

* It would be useful to provide an example of how the pieces fit together, either directly in the form or via hook_help().

Added basic hook_help

* It would also be useful to control the group that the tags show up in.

I thought about the group should be controlled by the site builder but I don't want the custom tags should overlap with any existing module implementation and having them into a single group are better for maintainability prespective. What do you think?

* The custom group label should be easier to understand, e.g. "Custom tags".

I have changed it to "Custom tags"

* The Metatag plugin cache needs to be cleared when a custom tag is created or modified.

Done

* The demo "sitename" tag needs improvements so it's clear what the values mean, e.g. just having "Sitename" as the description doesn't make it clear what it means or does.

I have updated the description. I'm open to accomodate more suggestions

I am trying to add the following custom meta tag:

<link rel="preload" as="image" href="image.webp">

Patch applies without issue.

After enabling this metatag submodule, I have option to create custom metatag. I am not sure how or if I can create my custom tag? See attached screenshot.

When trying to add new custom metetag I am getting the following:

Fatal error: Trait "Drupal\metatag\MetatagSeparator" not found in /var/www/html/web/modules/contrib/metatag/metatag_custom_tags/src/Plugin/metatag/Tag/MetaTagCustomTag.php on line 35

Looking at the codebase and change I cannot find any MetatagSeparator class?

https://git.drupalcode.org/project/metatag/-/merge_requests/94.diff

Are you using the patch with v2? MetatagSeparator is a trait stored in src/MetatagSeparator.php.

Sorry, i was still on 1.x

updating to 2 and fatal error is no more!

So as mentioned I am trying to get the custom attribute as mentioned above

If I enter

[node:field_picture:entity:field_media_image]" on="image, test" on="image

I get the following output:

<link rel="preload" href="&quot; on=&quot;image">
<link rel="preload" href="&quot;test&quot; on=&quot;image">

So it seems that token is not being replaced and the quotes are a bit strange. Also it took me a while to figure out how to get that far!

Ok so with the following string/token

https://i0.wp.com/www.brixtonbuzz.com/wp-content/uploads/2024/05/streatham-food-1.jpg" as="image

I am able to generate:

<link rel="preload" href="https://i0.wp.com/www.brixtonbuzz.com/wp-content/uploads/2024/05/streatham-food-1.jpg&quot; as=&quot;image">

However browser is still complaining:

<link rel=preload> cannot have the empty string as `as` value

So I guess as="image" might be confusing it. Not sure.

The UI doesn't support adding more attributes, right now it's limited to just assign a single attribute, so you won't be able to assign the "as" or "on" attributes.

Does it work if the "on" or "as" attributes are present?

as determines the type so I think that is required.

Probably more than 2 attributes are required:

https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/rel/preload

@2dareis2do
Thank you for testing it out
@DamienMcKenna
Should I explore the option to add multiple attributes via UI? Are you open for this direction?

Please do take a look -if you think it'll be a lot of work we can commit what we have first and then expand it later.

There might be a use case for a preload metatag submodule

Agreed - the need to specify multiple attributes of related data does make it a little harder to manage the way things are currently structured.

To help get the ball rolling I have created an issue for creating a module that supports the use of rel=preload attribute in head using link tag

https://www.drupal.org/project/metatag/issues/3450705 ✨ Add preload Meta as a submodule (Preload Metatags UI) Active

@naveenvalecha: So I guess the plan is now to integrate this as-is and then provide further improvements in follow-ups? Still the status is "Needs review"? Based on the recent comments, I think the state might be RTBC for as-is? Or what's left to be done?

@Anybody
nothing pending other than more features. It's under review and waiting for RTBC

This is good to go - thank you naveenvalecha for all of your work to build out this functionality, the test coverage, etc.