Support » Developing with WordPress » block dev : how to display a complex html tags

  • Hi
    I have created a “block”, i want to display a complex html tags, so the el() can’t help. How can i include and return a php page for the save() function?

    blocks.registerBlockType('quantr-widgets/example-widget', {
    		title: 'Quantr Block',
    		icon: 'universal-access-alt',
    		category: 'layout',
    		edit: function (props) {
    			return el(
    				'p',
    				{ style: blockStyle },
    				'Quantr Block (from the editor)'
    			);
    		},
    		save: function () {
    			return el(
    				'p',
    				{ style: blockStyle },
    				'Quantr Block (from the frontend)'
    			);
    		}
    	});

    thanks

Viewing 2 replies - 1 through 2 (of 2 total)
  • For more complex HTML you’ll probably find it easier to use JSX syntax for the block markup:

    edit() {
    	return (
    		<p style={blockStyle}>Quantr Block (from the editor)</p>
    	);
    },
    save() {
    	return (
    		<p style={blockStyle}>Quantr Block (from the frontend)</p>
    	);
    },
    

    To use this style, however, you need to introduce a build step. This article gives a good overview of how to do that.

    thanks so much

Viewing 2 replies - 1 through 2 (of 2 total)
  • You must be logged in to reply to this topic.