{"__v":125,"_id":"569d55adec29360d00f6679e","category":{"__v":1,"_id":"569d55acec29360d00f6679c","pages":["569d55adec29360d00f6679e"],"project":"569d55abec29360d00f66798","version":"569d55acec29360d00f6679b","sync":{"url":"","isSync":false},"reference":false,"createdAt":"2016-01-18T21:14:20.939Z","from_sync":false,"order":0,"slug":"documentation","title":"Converter Functionality"},"parentDoc":null,"project":"569d55abec29360d00f66798","user":"569d557c0306a10d00ce996e","version":{"__v":17,"_id":"569d55acec29360d00f6679b","project":"569d55abec29360d00f66798","createdAt":"2016-01-18T21:14:20.374Z","releaseDate":"2016-01-18T21:14:20.374Z","categories":["569d55acec29360d00f6679c","569d58cc0306a10d00ce9971","569d5c37ec29360d00f667a7","569ec89aebbadc0d0079bf71","569eccaa4a5c8b0d00744b3c","569eccbeffccd10d00a05cac","569ecd0f2d320817003b80d3","569ed216fbee990d0072d990","56b35bfb53da320d00c29716","56c1dc3d47394f0d00e227e8","570b98171e91d4220012acd8","570b9fa85f7a88340019f9f7","570e1ac1132c6d2b0000ab0b","570f5f72d6c6f00e00b98782","570f701ad6c6f00e00b98795","570f80fbb85a841900aa9505","5734a9642a48a90e0078e5ed"],"is_deprecated":false,"is_hidden":false,"is_beta":false,"is_stable":true,"codename":"","version_clean":"1.0.0","version":"1.0"},"updates":["570fedbb79b89419005475c8"],"createdAt":"2016-01-18T21:14:21.782Z","link_external":false,"link_url":"","githubsync":"","sync_unique":"","hidden":false,"api":{"results":{"codes":[]},"settings":"","auth":"required","params":[],"url":""},"isReference":false,"order":0,"body":"## Introduction\n\n<a href=\"https://htmltowordpress.io/\" target=\"_blank\">HTML to WordPress</a> converts your HTML designs into WordPress themes in seconds without the need for you to write a single line of PHP. The conversion is fully automated and the theme's functionality can be extended just by adding \"wp-\" prefixed converter classes into your HTML.\n[block:embed]\n{\n  \"html\": \"<iframe class=\\\"embedly-embed\\\" src=\\\"//cdn.embedly.com/widgets/media.html?src=https%3A%2F%2Fwww.youtube.com%2Fembed%2Fv0oEqPhRsbY%3Ffeature%3Doembed&url=https%3A%2F%2Fwww.youtube.com%2Fwatch%3Fv%3Dv0oEqPhRsbY&image=https%3A%2F%2Fi.ytimg.com%2Fvi%2Fv0oEqPhRsbY%2Fhqdefault.jpg&key=02466f963b9b4bb8845a05b53d3235d7&type=text%2Fhtml&schema=youtube\\\" width=\\\"854\\\" height=\\\"480\\\" scrolling=\\\"no\\\" frameborder=\\\"0\\\" allowfullscreen></iframe>\",\n  \"url\": \"https://www.youtube.com/watch?v=v0oEqPhRsbY\",\n  \"title\": \"HTML to WordPress 30 Second Explainer\",\n  \"favicon\": \"https://s.ytimg.com/yts/img/favicon-vflz7uhzw.ico\",\n  \"image\": \"https://i.ytimg.com/vi/v0oEqPhRsbY/hqdefault.jpg\"\n}\n[/block]\n## How to edit content\n\nOnce you have installed and activated the Simple Live Editor you can edit the content from the customize view. Content management has never been this fast and easy.\n\nSimple Live Editor is already installed and activated by default in Theme Preview\n[block:embed]\n{\n  \"html\": \"<iframe class=\\\"embedly-embed\\\" src=\\\"//cdn.embedly.com/widgets/media.html?src=https%3A%2F%2Fwww.youtube.com%2Fembed%2F1kmK3u5eqh8%3Ffeature%3Doembed&url=http%3A%2F%2Fwww.youtube.com%2Fwatch%3Fv%3D1kmK3u5eqh8&image=https%3A%2F%2Fi.ytimg.com%2Fvi%2F1kmK3u5eqh8%2Fhqdefault.jpg&key=02466f963b9b4bb8845a05b53d3235d7&type=text%2Fhtml&schema=youtube\\\" width=\\\"854\\\" height=\\\"480\\\" scrolling=\\\"no\\\" frameborder=\\\"0\\\" allowfullscreen></iframe>\",\n  \"url\": \"https://www.youtube.com/watch?v=1kmK3u5eqh8&feature=youtu.be\",\n  \"title\": \"Simple Live Editor Guide\",\n  \"favicon\": \"https://s.ytimg.com/yts/img/favicon-vflz7uhzw.ico\",\n  \"image\": \"https://i.ytimg.com/vi/1kmK3u5eqh8/hqdefault.jpg\"\n}\n[/block]\n## Extend theme functionality with classes like wp-menu-main\n\nYou can extend theme functionality by adding \"wp-\" prefixed classes in to your HTML before the conversion. Once these classes are found during the conversion, the converter will automatically add the correct WordPress functionality to make the theme work as intended.\n\nNotice the .wp-menu-main class in the the below example? This creates a WordPress menu that will be named Main. And that's all there is to it.\n[block:code]\n{\n  \"codes\": [\n    {\n      \"code\": \"<ul class=\\\"wp-menu-main\\\">\\n\\t\\t<li><a href=\\\"index.html\\\">Home</a></li>\\n\\t\\t<li><a href=\\\"contact.html\\\">Contact</a></li>\\n\\t\\t<li><a href=\\\"about.html\\\">About</a></li>\\n</ul>\",\n      \"language\": \"html\",\n      \"name\": \"An example of creating a menu called \\\"Main\\\"\"\n    }\n  ]\n}\n[/block]\n\n[block:callout]\n{\n  \"type\": \"info\",\n  \"body\": \"The converter will automatically add the correct WordPress functionality if the classes are found from the HTML.\",\n  \"title\": \"Remember to add the \\\"wp-\\\" classes before converting.\"\n}\n[/block]\nRead more about <a href=\"https://html-to-wordpress.readme.io/docs/wordpress-editable-menu\">creating editable WordPress menus here</a>.","excerpt":"<a href=\"https://html-to-wordpress.readme.io/v1.0/docs/introduction#section-introduction\">Introduction</a>\n<a href=\"https://html-to-wordpress.readme.io/v1.0/docs#introduction#section-how-to-edit-content\">How to edit content</a>\n<a href=\"https://html-to-wordpress.readme.io/v1.0/docs/introduction#section-extend-theme-functionality-with-classes-like-wp-menu-main-\">How to extend theme functionality</a>","slug":"introduction","type":"basic","title":"Introduction"}