JavaScript — получить значение из Gutenberg SelectControl в php для внешнего интерфейса
У меня есть простой блок Гутенберга с выбором шрифтов Google.
el (SelectControl,
{
value: fontFamily,
label: __('Шрифт'),
options: [
{
value: 'Georgia',
label: 'Georgia'
},
{
value: 'PT Sans',
label: 'PT Sans'
},
{
value: 'Amatic SC',
label: 'Amatic SC'
},
],
onChange: onChangefontFamily,
},),
PHP:
function google_fonts_url() {
$fonts_url = '';
$font_families = array();
$font_families[] = 'Amatic SC|PT Sans:400,400i';
$query_args = array(
'family' => urlencode( implode( '|', $font_families ) ),
'subset' => urlencode( 'latin,cyrillic' ),
);
$fonts_url = add_query_arg( $query_args, 'https://fonts.googleapis.com/css' );
return $fonts_url; }
Мне нужно загрузить только выбранный шрифт из Google.
Как получить Валь из избранных для этого?
Решение
Гутенберг сохраняет атрибуты блока в HTML-комментариях внутри post_content. Поэтому вам нужно разобрать комментарии HTML с помощью PHP. Одним из способов сделать это является использование DOMDocument
Допустим, ваш контент сохраняется в post_content следующим образом:
<!-- wp:yourprefix/yourblock {"fontFamily":"Amatic SC"} -->
<div class="wp-block-yourprefix-yourblock"></div>
<!-- /wp:yourprefix/yourblock -->
Затем вы можете получить содержимое поста / страницы, используя:
$content_post = get_post($my_postid);
$content = $content_post->post_content;
Затем это содержимое может быть проанализировано библиотекой DOMDocument для извлечения значения select, закодированного в JSON
$dom = new DOMDocument();
//Pass the content to the loadHTML function
$dom->loadHTML($content);
$xpath = new DOMXPath($dom);
//Extract Comment Nodes
$comments = $xpath->query('//comment()');
//Extract text from the 1st node
$text = $comments->item(0)->data;
//Match the JSON string and decode to get the selected font value
preg_match('~\{(?:[^{}]|(?R))*\}~', $text,$res);
$fontFamily = json_decode($res[0])->fontFamily;
Другие решения
Других решений пока нет …