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.

    Thread Starter quantrpeter

    (@quantrpeter)

    thanks so much

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘block dev : how to display a complex html tags’ is closed to new replies.