高级自定义字段，设置html5画布文本

Question

If anyone would have any references or links to point me in the direction I'd greatly appreciate it. I know I can set canvas text with "context.fillText ("Hello World");" when just doing straight forward canvas.

My question is how would I go about using Advanced Custom Fields (acf) field to as my text variable so the client can set/change the text on their own.

So if I had:

<?php the_field('canvas_text'); ?>

How would I go about setting this as the 'fillText'?

Could I use somehow use the ACF field as a variable that I then use in the canvas js?

Answer 1

Use wp_localize_script to pass a variable from php to javascript in WordPress, like this:

wp_localize_script( 'canvas_js', 'canvas_js_localization', array(
    'canvas_text' => get_field( 'canvas_text' )
) );

and then use it in your js like this:

context.fillText (canvas_js_localization.canvas_text)

Of course you have to edit the handle and name to fit your scenario.