SVG tag block validation
-
Hello,
I create a new block with svg tag in the jsx template on save function.
When i save on my pc, there’s no problem after reload page, but when an other pc update the block, on reload page, the block validation is wrong. I inspect and i thound that svg tag in html code is missing.
Why is doing this ?
Anyone have solution to solve this ?
I have the same issues when i add attribut srcset, sizes or time tag on jsx. They disappear on save whith an other pc. I use private navigator, purge cache, but the issues is always present in the bloc.
Thanks for helpconst {__, setLocaleData} = wp.i18n; const { registerBlockType, } = wp.blocks; const { InnerBlocks } = wp.editor; const { G, Path, SVG, Circle } = wp.components; const BLOCKS_TEMPLATE = [ ['custom-gutenberg-elements/cge-local-full-post-intro-bloc', {}], ]; const ALLOWED_BLOCKS = ['custom-gutenberg-elements/cge-local-full-post-intro-bloc']; registerBlockType('custom-gutenberg-elements/cge-local-full-post-intro-bloc-container', { title: __('CGE: Full Local - Introduction conteneur slide', 'custom-gutenberg-elements'), icon: 'index-card', category: 'formatting', attributes: {}, edit: (props) => { const { className, attributes: {}, } = props; return ( <div className={"section-left col-sm-12 " + className}> <div className="row"> <div className="block block-page__text col-md-10"> <div className="block-content"> <div className="block-body rte"> <InnerBlocks template={BLOCKS_TEMPLATE} allowedBlocks={ALLOWED_BLOCKS} templateLock={false}/> </div> </div> </div> </div> </div> ); }, save: (props) => { const { className, attributes: {}, } = props; let asset = "https://" + window.location.hostname + "/content/themes/resoconfort/dist/" return ( <div className="col-sm-6"> <div className={"block block-intro__text " + className}> <div className="dots"> <div className="dot dot-chauffage"> <span className="dot-icon"> <SVG width="56" height="56" viewBox="0 0 52 52" version="1.1" xmlns="https://www.w3.org/2000/svg"> <Circle cx='26' cy='26' r='25' stroke="white" stroke-width="2" fill="transparent"/> </SVG> <img src={asset + "images/intro__text-fire.png"} width="27" height="32" alt=""/> </span> <strong className="dot-text match-2">Chauffage</strong> </div> <div className="dot dot-climatisation"> <span className="dot-icon"> <SVG width="56" height="56" viewBox="0 0 52 52" version="1.1" xmlns="https://www.w3.org/2000/svg"> <Circle cx='26' cy='26' r='25' stroke="white" stroke-width="2" fill="transparent"/> </SVG> <img src={asset + "images/intro__text-snowflake.png"} width="28" height="29" alt=""/> </span> <strong className="dot-text match-2">Climatisation</strong> </div> <div className="dot dot-ventilation"> <span className="dot-icon"> <SVG width="56" height="56" viewBox="0 0 52 52" version="1.1" xmlns="https://www.w3.org/2000/svg"> <Circle cx='26' cy='26' r='25' stroke="white" stroke-width="2" fill="transparent"/> </SVG> <img src={asset + "images/intro__text-propeller.png"} width="28" height="30" alt=""/> </span> <strong className="dot-text match-2">Ventilation</strong> </div> <div className="dot dot-eau"> <span className="dot-icon"> <SVG width="56" height="56" viewBox="0 0 52 52" version="1.1" xmlns="https://www.w3.org/2000/svg"> <Circle cx='26' cy='26' r='25' stroke="white" stroke-width="2" fill="transparent"/> </SVG> <img src={asset + "images/intro__text-drop.png"} width="24" height="30" alt=""/> </span> <strong className="dot-text match-2">Eau chaude</strong> </div> </div> <div className="slider"> <InnerBlocks.Content/> </div> </div> </div> ); } });
- The topic ‘SVG tag block validation’ is closed to new replies.