1

My goal is simple, I'd like to use the LinkControl element on an admin page rendered by my plugin. Using the LinkControl on the BlockEditor page is quite easy the issue is doing it without being inside the Edit/Save functions of a custom block.

These are the steps I did:

  1. On the php of my custom admin page I included the scripts: ['wp-blocks', 'wp-block-editor', 'wp-element']
  2. I also included my script admin.js using the wp_enqueue_scripts
  3. Inside main.js I have:
wp.element.render(
    wp.element.createElement( wp.blockEditor.__experimentalLinkControl,{
        onChange:function(value){console. Debug(value);},
        showSuggestions:true,
        value:{url:'test'}
    } ),
    document.getElementById( 'my_linkcontrol' )
);

The LinkControl shows but doesn't suggest any entries when you write something. I assume it has something to do with block editor settings: __experimentalFetchLinkSuggestions

Update:As explained on this git issue LinkControl calls a function specified on the editor-block settings to fetch the suggestions (that's why <LinkControl /> works on a custom block edit.js) :

import { __experimentalFetchLinkSuggestions as fetchLinkSuggestions } from '@wordpress/core-data';
initializeEditor( id, settings ) {
settings.__experimentalFetchLinkSuggestions = ( search, searchOptions )
=> fetchLinkSuggestions( search, searchOptions, settings );

This is called when intatiating the block-editor but I can't do that with my code. How can I specify editor settings if I'm not loading the editor, only <LinkControl />

enter image description here

5
  • the documentation for that component states its default behaviour doesn't do anything and you have to provide it yourself, and has a link to an example github.com/WordPress/gutenberg/blob/… Can you expand your code snippet? Is this running on an event or hook?
    – Tom J Nowell
    Commented Sep 20, 2022 at 15:21
  • This runs inside a script that is loaded on an admin form I implemented (admin.php?page=my_custom_form). When I'm enqueuing the scripts I first add the block-edtiro script. I saw the documentation but if I use <LinkControl /> but inside the edit.js of a custom block I implemented it shows the suggestion without any other prop.
    – out_sid3r
    Commented Sep 20, 2022 at 15:40
  • This is done when initializing the editor but I'm outside the editor , I'm on an admin page: export function initializeEditor( id, settings ) { settings.__experimentalFetchLinkSuggestions = ( search, searchOptions ) => fetchLinkSuggestions( search, searchOptions, settings );
    – out_sid3r
    Commented Sep 20, 2022 at 15:51
  • can you edit that code into the question rather than a comment? Comments don't work for blocks of code, only inline like this
    – Tom J Nowell
    Commented Sep 20, 2022 at 16:30
  • @TomJNowell done
    – out_sid3r
    Commented Sep 20, 2022 at 16:47

1 Answer 1

0

Not possible unless using isolated block editor, based on a reply from one of the Wordpress developers which was really helpful.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.