{"version":"1.0","provider_name":"ITviec Blog","provider_url":"https:\/\/itviec.com\/blog","author_name":"Uyen Ngo","author_url":"https:\/\/itviec.com\/blog\/author\/uyen-ngo\/","title":"Figma to HTML: H\u01b0\u1edbng d\u1eabn chuy\u1ec3n \u0111\u1ed5i thi\u1ebft k\u1ebf th\u00e0nh m\u00e3 ngu\u1ed3n","type":"rich","width":600,"height":338,"html":"<blockquote class=\"wp-embedded-content\" data-secret=\"8beaE7SW0t\"><a href=\"https:\/\/itviec.com\/blog\/cach-chuyen-doi-figma-to-html\/\">Figma to HTML: H\u01b0\u1edbng d\u1eabn chuy\u1ec3n \u0111\u1ed5i thi\u1ebft k\u1ebf th\u00e0nh m\u00e3 ngu\u1ed3n<\/a><\/blockquote><iframe sandbox=\"allow-scripts\" security=\"restricted\" src=\"https:\/\/itviec.com\/blog\/cach-chuyen-doi-figma-to-html\/embed\/#?secret=8beaE7SW0t\" width=\"600\" height=\"338\" title=\"&#8220;Figma to HTML: H\u01b0\u1edbng d\u1eabn chuy\u1ec3n \u0111\u1ed5i thi\u1ebft k\u1ebf th\u00e0nh m\u00e3 ngu\u1ed3n&#8221; &#8212; ITviec Blog\" data-secret=\"8beaE7SW0t\" frameborder=\"0\" marginwidth=\"0\" marginheight=\"0\" scrolling=\"no\" class=\"wp-embedded-content\"><\/iframe><script>\n\/**\n * WordPress inline HTML embed\n *\n * @since 4.4.0\n * @output wp-includes\/js\/wp-embed.js\n *\n * Single line comments should not be used since they will break\n * the script when inlined in get_post_embed_html(), specifically\n * when the comments are not stripped out due to SCRIPT_DEBUG\n * being turned on.\n *\/\n(function ( window, document ) {\n\t'use strict';\n\n\t\/* Abort for ancient browsers. *\/\n\tif ( ! document.querySelector || ! window.addEventListener || typeof URL === 'undefined' ) {\n\t\treturn;\n\t}\n\n\t\/** @namespace wp *\/\n\twindow.wp = window.wp || {};\n\n\t\/* Abort if script was already executed. *\/\n\tif ( !! window.wp.receiveEmbedMessage ) {\n\t\treturn;\n\t}\n\n\t\/**\n\t * Receive embed message.\n\t *\n\t * @param {MessageEvent} e\n\t *\/\n\twindow.wp.receiveEmbedMessage = function( e ) {\n\t\tvar data = e.data;\n\n\t\t\/* Verify shape of message. *\/\n\t\tif (\n\t\t\t! ( data || data.secret || data.message || data.value ) ||\n\t\t\t\/[^a-zA-Z0-9]\/.test( data.secret )\n\t\t) {\n\t\t\treturn;\n\t\t}\n\n\t\tvar iframes = document.querySelectorAll( 'iframe[data-secret=\"' + data.secret + '\"]' ),\n\t\t\tblockquotes = document.querySelectorAll( 'blockquote[data-secret=\"' + data.secret + '\"]' ),\n\t\t\tallowedProtocols = new RegExp( '^https?:$', 'i' ),\n\t\t\ti, source, height, sourceURL, targetURL;\n\n\t\tfor ( i = 0; i < blockquotes.length; i++ ) {\n\t\t\tblockquotes[ i ].style.display = 'none';\n\t\t}\n\n\t\tfor ( i = 0; i < iframes.length; i++ ) {\n\t\t\tsource = iframes[ i ];\n\n\t\t\tif ( e.source !== source.contentWindow ) {\n\t\t\t\tcontinue;\n\t\t\t}\n\n\t\t\tsource.removeAttribute( 'style' );\n\n\t\t\tif ( 'height' === data.message ) {\n\t\t\t\t\/* Resize the iframe on request. *\/\n\t\t\t\theight = parseInt( data.value, 10 );\n\t\t\t\tif ( height > 1000 ) {\n\t\t\t\t\theight = 1000;\n\t\t\t\t} else if ( ~~height < 200 ) {\n\t\t\t\t\theight = 200;\n\t\t\t\t}\n\n\t\t\t\tsource.height = height;\n\t\t\t} else if ( 'link' === data.message ) {\n\t\t\t\t\/* Link to a specific URL on request. *\/\n\t\t\t\tsourceURL = new URL( source.getAttribute( 'src' ) );\n\t\t\t\ttargetURL = new URL( data.value );\n\n\t\t\t\tif (\n\t\t\t\t\tallowedProtocols.test( targetURL.protocol ) &&\n\t\t\t\t\ttargetURL.host === sourceURL.host &&\n\t\t\t\t\tdocument.activeElement === source\n\t\t\t\t) {\n\t\t\t\t\twindow.top.location.href = data.value;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t};\n\n\tfunction onLoad() {\n\t\tvar iframes = document.querySelectorAll( 'iframe.wp-embedded-content' ),\n\t\t\ti, source, secret;\n\n\t\tfor ( i = 0; i < iframes.length; i++ ) {\n\t\t\t\/** @var {IframeElement} *\/\n\t\t\tsource = iframes[ i ];\n\n\t\t\tsecret = source.getAttribute( 'data-secret' );\n\t\t\tif ( ! secret ) {\n\t\t\t\t\/* Add secret to iframe *\/\n\t\t\t\tsecret = Math.random().toString( 36 ).substring( 2, 12 );\n\t\t\t\tsource.src += '#?secret=' + secret;\n\t\t\t\tsource.setAttribute( 'data-secret', secret );\n\t\t\t}\n\n\t\t\t\/*\n\t\t\t * Let post embed window know that the parent is ready for receiving the height message, in case the iframe\n\t\t\t * loaded before wp-embed.js was loaded. When the ready message is received by the post embed window, the\n\t\t\t * window will then (re-)send the height message right away.\n\t\t\t *\/\n\t\t\tsource.contentWindow.postMessage( {\n\t\t\t\tmessage: 'ready',\n\t\t\t\tsecret: secret\n\t\t\t}, '*' );\n\t\t}\n\t}\n\n\twindow.addEventListener( 'message', window.wp.receiveEmbedMessage, false );\n\tdocument.addEventListener( 'DOMContentLoaded', onLoad, false );\n})( window, document );\n\/\/# sourceURL=https:\/\/itviec.com\/blog\/wp-includes\/js\/wp-embed.js\n<\/script>\n","thumbnail_url":"https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/05\/figma-to-html-vippro-scaled.png","thumbnail_width":640,"thumbnail_height":337,"description":"Chuy\u1ec3n \u0111\u1ed5i t\u1eeb Figma to HTML kh\u00f4ng ch\u1ec9 l\u00e0 qu\u00e1 tr\u00ecnh chuy\u1ec3n \u0111\u1ed5i thi\u1ebft k\u1ebf sang m\u00e3 ngu\u1ed3n, m\u00e0 c\u00f2n l\u00e0 b\u01b0\u1edbc c\u1ea7u n\u1ed1i gi\u1eefa \u00fd t\u01b0\u1edfng v\u00e0 tr\u1ea3i nghi\u1ec7m ng\u01b0\u1eddi d\u00f9ng th\u1ef1c"}