{"id":165260,"date":"2022-11-11T04:04:36","date_gmt":"2022-11-11T04:04:36","guid":{"rendered":"https:\/\/wordpress.org\/plugins\/advance-custom-html\/"},"modified":"2026-03-29T06:25:30","modified_gmt":"2026-03-29T06:25:30","slug":"advance-custom-html","status":"publish","type":"plugin","link":"https:\/\/wordpress.org\/plugins\/advance-custom-html\/","author":22028296,"comment_status":"closed","ping_status":"closed","template":"","meta":{"version":"2.0.4","stable_tag":"2.0.4","tested":"6.9.4","requires":"6.6","requires_php":"7.1","requires_plugins":null,"header_name":"Advance Custom HTML","header_author":"bPlugins","header_description":"An advance html code editor which enable you to code professionally. It provides different skins, denting, correction and more.","assets_banners_color":"c2c0c9","last_updated":"2026-03-29 06:25:30","external_support_url":"","external_repository_url":"","donate_link":"https:\/\/gum.co\/wpdonate\/","header_plugin_uri":"","header_author_uri":"http:\/\/bplugins.com","rating":3,"author_block_rating":4.2461538461538,"active_installs":10000,"downloads":151451,"num_ratings":3,"support_threads":0,"support_threads_resolved":0,"author_block_count":62,"sections":["description","installation","faq","changelog"],"tags":{"1.0.0":{"tag":"1.0.0","author":"shehabulislam","date":"2024-10-17 11:13:18"},"1.0.1":{"tag":"1.0.1","author":"taninrahman21","date":"2024-11-23 09:02:06"},"1.0.2":{"tag":"1.0.2","author":"taninrahman","date":"2025-01-26 04:46:28"},"1.0.3":{"tag":"1.0.3","author":"taninrahman","date":"2025-01-26 05:03:17"},"1.0.4":{"tag":"1.0.4","author":"taninrahman","date":"2025-04-13 05:04:01"},"1.0.5":{"tag":"1.0.5","author":"taninrahman","date":"2025-05-08 05:10:17"},"1.0.6":{"tag":"1.0.6","author":"taninrahman","date":"2025-06-21 11:22:32"},"1.0.7":{"tag":"1.0.7","author":"taninrahman","date":"2025-07-20 05:39:33"},"1.0.8":{"tag":"1.0.8","author":"taninrahman","date":"2025-08-14 03:21:58"},"1.0.9":{"tag":"1.0.9","author":"taninrahman","date":"2025-08-17 09:57:26"},"2.0.0":{"tag":"2.0.0","author":"taninrahman","date":"2025-09-17 06:24:26"},"2.0.1":{"tag":"2.0.1","author":"taninrahman","date":"2025-11-17 03:24:26"},"2.0.2":{"tag":"2.0.2","author":"taninrahman","date":"2025-11-25 09:40:54"},"2.0.3":{"tag":"2.0.3","author":"taninrahman","date":"2026-02-15 09:06:56"},"2.0.4":{"tag":"2.0.4","author":"taninrahman","date":"2026-03-29 06:25:30"}},"upgrade_notice":[],"ratings":{"1":1,"2":0,"3":1,"4":0,"5":1},"assets_icons":{"icon-128x128.png":{"filename":"icon-128x128.png","revision":3477722,"resolution":"128x128","location":"assets","locale":""}},"assets_banners":{"banner-772x250.png":{"filename":"banner-772x250.png","revision":3401144,"resolution":"772x250","location":"assets","locale":""}},"assets_blueprints":{},"all_blocks":{"bplugins\/custom-html":{"apiVersion":"1","name":"bplugins\/custom-html","title":"Advance Custom HTML","version":"2.0.3","description":"Write code like editor.","category":"widgets","keywords":["custom html","code","html","code editor","embed code","display code snippet","code viewer","write code","display code block","embed javascript","embed css","embed html","embed script","awesome code snippet","lightweight code editor"],"icon":"html","textdomain":"custom-html","attributes":{"uniqueId":{"type":"string","default":""},"HTML":{"type":"string","default":""},"fontSize":{"type":"number","default":15},"alignment":{"type":"string","default":"center"},"mainEditor":{"type":"object","default":{"theme":"oneDark","language":"html","copyBtnType":"icon","copyBtnText":"Copy Code","textAfterCopied":"Copied","copyBtnPosition":"topright","height":"400px","width":"100%","embeddedContentHeight":"600px","embeddedContentWidth":"100%","border":{"color":"","style":"","width":""},"borderRadius":0}},"headingStyles":{"type":"object","default":{"headlineText":"","titleColor":"#fff","titleTypo":{"fontSize":"14"},"backgroundColor":"#000","padding":{"top":"5px","right":"0px","bottom":"5px","left":"20px"}}},"options":{"type":"object","default":{"showLineNumbers":true,"highlightActiveLine":true,"autocompletion":true,"wrapEnabled":false,"foldGutter":true,"tabSize":2,"displayCodeToFrontend":false,"displayHeading":false,"displayCopyBtn":false,"setEmbededContentHeightWidht":false,"isRenderViaIframe":false}},"btnStyle":{"type":"object","default":{"textColor":"white","backgroundColor":"#4a90e2","typo":{"fontSize":12},"copyBtnIconColor":"#4a90e2","copyBtnIconSize":25}}},"supports":{"html":false,"align":["wide","full"]},"example":{"attributes":{"preview":true,"HTML":"
#1 Plugin to Add Custom HTML & CSS & JavaScript Code and Display Any Code Snippet Beautifully in WordPress.<\/strong><\/p>\n\n Advance Custom HTML<\/strong><\/a> lets users display HTML, CSS, JavaScript, PHP, Python, or other code snippets within WordPress posts, pages, or widgets. With built-in live preview support, syntax highlighting, and code editor features, it\u2019s designed for sharing code in a clean, readable, and responsive format.<\/p>\n\n This plugin includes a front-end code editor with a draggable preview panel, multiple syntax themes, and customizable settings for formatting and appearance. Ideal for tutorials, technical articles, and documentation, it provides a flexible way to embed and present code with real-time results.<\/p>\n\n Advance Custom HTML<\/strong><\/a> | Pricing<\/strong><\/a> | Support<\/strong><\/a> | Demo<\/strong><\/a><\/p>\n\n Edit code and preview output together<\/strong> on the editor\/backend.<\/p><\/li>\n Live Output Preview<\/strong>: See the results of your code instantly<\/p><\/li>\n Autocomplete suggestions<\/strong> while writing code<\/p><\/li>\n Draggable Preview Panel<\/strong> to move output anywhere on screen<\/p><\/li>\n Set editor Font Size<\/strong><\/p><\/li>\n Fully responsive<\/strong>, mobile-friendly interface<\/p><\/li>\n Lightweight and fast<\/strong> for better performance<\/p><\/li>\n<\/ul>\n\n The Pro version<\/strong><\/a> offers extended customization and control over code presentation and layout.<\/p>\n\n What\u2019s Included in Pro:<\/strong><\/p>\n\n Choose from 40+ editor themes<\/strong> (dark, light, minimal, etc.)<\/p><\/li>\n Adjust Tab size, line wrapping, editor height\/width<\/strong><\/p><\/li>\n Change syntax mode per snippet: HTML, CSS, JS, PHP, Python, and more<\/strong><\/p><\/li>\n Toggle features: Copy button, Fold gutter, Highlight active line<\/strong>, etc.<\/p><\/li>\n Customize the Copy to Clipboard<\/strong> button text, icon, style, and position<\/p><\/li>\n Hide Headings or Labels<\/strong> for a clean, minimalist look<\/p><\/li>\n Hide or Show Line numbers<\/strong> to simplify code presentation<\/p><\/li>\n Enable or Disable Wrap<\/strong> to control line flow in your editor<\/p><\/li>\n Edit Code Editor\/Snippet Height and Width<\/strong>, and align left, center, or right<\/p><\/li>\n Fold Gutter<\/strong> support for collapsing code blocks<\/p><\/li>\n Highlight Active Line<\/strong> Toggle for easier focus during tutorials<\/p><\/li>\n<\/ul>\n\n Install the Advance Custom HTML<\/strong><\/p><\/li>\n Open the editor for any post or page<\/p><\/li>\n Click Add Block<\/strong> and select Advance Custom HTML<\/strong> under Widgets<\/p><\/li>\n Write or paste your code<\/p><\/li>\n Customize the settings (theme, preview, copy button)<\/p><\/li>\n Publish or update the content<\/p><\/li>\n<\/ul>\n\n Write and preview front-end HTML\/CSS tutorials<\/strong><\/p><\/li>\n Embed JavaScript snippets<\/strong> with instant results<\/p><\/li>\n Display PHP code<\/strong> in educational content<\/p><\/li>\n Show Python syntax<\/strong> in data science blogs<\/p><\/li>\n Publish developer documentation or API guides<\/strong><\/p><\/li>\n Create interactive code articles with live editing<\/strong><\/p><\/li>\n<\/ul>\n\n Bloggers and Tech Writers<\/p><\/li>\n Coaches, Instructors, and Course Creators<\/p><\/li>\n Web Developers and Designers<\/p><\/li>\n Software Product Sites<\/p><\/li>\n Niche Tutorials & SaaS Startups<\/p><\/li>\n Business Sites with Technical Content<\/p><\/li>\n Anyone publishing HTML, JS, CSS, PHP, or Python code<\/p><\/li>\n<\/ul>\n\n Live Demo<\/strong><\/a> | Buy The Pro<\/strong><\/a><\/p>\n\n Html5 Video Player<\/strong><\/a> \u2013 Display videos as single and playlist in multiple skins.<\/p>\n\n PDF Poster<\/strong><\/a> \u2013 Display\/Embed PDF files with different styles.<\/p>\n\n Html5 Audio Player<\/strong><\/a> \u2013 Listen audios with awesome visuals.<\/p>\n\n StreamCast<\/strong><\/a> \u2013 Customizable radio player with different skins.<\/p>\n\n 3D Viewer<\/strong><\/a> \u2013 Embed 3D models and 3D products with interaction.<\/p>\n\nFree Features \u2013 Everything You Need to Start<\/h3>\n\n
\n
Pro Features \u2013 Unlock Advanced Controls<\/h3>\n\n
\n
How to Use \u2013 Step-by-Step Guide<\/h3>\n\n
Quick setup in just a few steps:<\/h4>\n\n
\n
Use Cases:<\/h3>\n\n
\n
Perfect For:<\/h3>\n\n
\n
Check out our other WordPress Plugins-<\/h3>\n\n