Hi @gh0stclaw
Yes, it is possible to extend the LinkControl component in Gutenberg or remove specific attributes from anchor tags in your case. Here are two approaches you can consider:
- Extending the LinkControl Component: To extend the LinkControl component, you can create a custom plugin or add the code to your theme’s functions.php file. Here’s an example of how you can remove the data-id attribute from the anchor tags: javascript Copy code
(function(wp) { var LinkControl = wp.editor.LinkControl; var el = wp.element.createElement; var __assign = wp.blocks.__assign; // Create a new extended LinkControl component var CustomLinkControl = function(props) { // Remove the data-id attribute from the link attributes var attributes = __assign({}, props.attributes); if (attributes && attributes.href) { delete attributes['data-id']; } // Render the LinkControl component with modified attributes return el(LinkControl, __assign({}, props, { attributes: attributes })); }; // Replace the original LinkControl component with the custom one wp.hooks.addFilter('editor.LinkControl', 'my-plugin/extend-link-control', function() { return CustomLinkControl; }); })(window.wp); After adding this code, the LinkControl component will be extended, and the data-id an attribute will be removed from the anchor tags.
- Removing Attributes from Anchor Tags: If you want to remove specific attributes from anchor tags globally, you can use a filter hook called
wp_targeted_link_rel in your theme’s functions.php file. Here’s an example of how you can remove the data-id attribute from all anchor tags: PHP Copy code function remove_link_attributes($rel_attributes) { $rel_attributes = str_replace('data-id', '', $rel_attributes); return $rel_attributes; } add_filter('wp_targeted_link_rel', 'remove_link_attributes'); By adding this code to your theme’s functions.php file, the data-id attribute will be removed from all anchor tags throughout your website.
Remember to use a child theme or custom plugin to make these modifications to avoid losing your changes during theme or plugin updates.
Thread Starter
alewis
(@gh0stclaw)
Firstly, thank you for responding to this, it’s been a headscratcher for me for a bit now. I can’t seem to find any documentation regarding this particular ask, I’m assuming it has to do with it being a newer feature.
Is there a method of doing this as a kind of block-filter? So I have this folder where I store my core-filters, specifically so I can add my customization layers on top of the core blocks via extending them.
If I’m not mistaken, I can do the same thing for this particular component, correct? @sumitsingh
Thread Starter
alewis
(@gh0stclaw)
Quick update here, it doesn’t seem to work, I don’t see any editor.LinkControl filter accessible @sumitsingh
-
This reply was modified 2 years, 11 months ago by
alewis.