{"id":63,"date":"2019-10-03T14:35:33","date_gmt":"2019-10-03T12:35:33","guid":{"rendered":"http:\/\/hubertsouchaud.fr\/cms\/?page_id=63"},"modified":"2019-10-03T14:35:33","modified_gmt":"2019-10-03T12:35:33","slug":"demo","status":"publish","type":"page","link":"https:\/\/hubertsouchaud.fr\/cms\/demo\/","title":{"rendered":"D\u00e9mo"},"content":{"rendered":"<header class=\"header heroe\">\n  <h1 itemprop=\"name\">HTML Ipsum <small>Presents<\/small><\/h1>\n  <p itemprop=\"description\">Mauris placerat eleifend leo. Quisque sit amet est et <a href=\"#\">sapien<\/a> ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi. <\/p>\n  <p class=\"text-muted\"><small><b style=\"text-decoration: underline\">4vw + 4vh + 2vmin<\/b>: Using <strong>calc<\/strong> in combination with <abbr title=\"viewport width based unit\">vw<\/abbr> and <abbr title=\"viewport height based unit\">vh<\/abbr> <i>units<\/i> for <em>font-size<\/em> to create text that always fills the viewport. No matter what ratio. <\/small><\/p>\n  <p>\n    <button class=\"btn-primary\"><i class=\"fa fa-share-alt\" aria-hidden=\"true\"><\/i>\n    share<\/button>\n    <button class=\"btn-analogous-1\"><i class=\"fa fa-share-alt\" aria-hidden=\"true\"><\/i>\n    share<\/button>\n    <button class=\"btn-default\"><i class=\"fa fa-share-alt\" aria-hidden=\"true\"><\/i>\n    share<\/button>\n    <button class=\"btn-analogous-2\"><i class=\"fa fa-share-alt\" aria-hidden=\"true\"><\/i>\n    share<\/button>\n  <\/p>\n  <div class=\"rainbow\"><\/div>\n<\/header>\n<section class=\"row content show-grid\">\n  <h2>Header Level 2<\/h2>\n  <p><strong>Pellentesque habitant morbi tristique<\/strong> senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat. <\/p>\n  <p>Vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. <em>Aenean ultricies mi vitae est<\/em>. Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum\n    sed, <code>commodo vitae<\/code>, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. Donec non enim in turpis pulvinar facilisis. Ut felis.\n  <\/p>\n  <h3>Header Level 3<\/h3>\n  <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat. <\/p>\n  <ol>\n    <li>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.<\/li>\n    <li>Aliquam tincidunt mauris eu risus.<\/li>\n    <li>Vestibulum auctor dapibus neque.<\/li>\n  <\/ol>\n  <h4>Header Level 4<\/h4>\n  <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat. <\/p>\n  <ul>\n    <li>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.<\/li>\n    <li>Aliquam tincidunt mauris eu risus.<\/li>\n    <li>Vestibulum auctor dapibus neque.<\/li>\n  <\/ul>\n  <h5>Header Level 5<\/h5>\n  <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat. <\/p>\n  <dl>\n    <dt>Definition list<\/dt>\n    <dd>Consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.<\/dd>\n    <dt>Lorem ipsum dolor sit amet<\/dt>\n    <dd>Consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.<\/dd>\n  <\/dl>\n  <h6>Header Level 6<\/h6>\n  <p><small>Pellentesque habitant morbi tristique senectus et netus et malesuada famtempus lacus enim ac dui. Donec non enim in turpis pulvinar facilisis. Ut felis. Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus<\/small>.<\/p>\n  <hr>\n  <h2>Special HTML<\/h2>\n  <h3>Citation<\/h3>\n  <blockquote>\n    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus magna. Cras in mi at felis aliquet congue. Ut a est eget ligula molestie gravida. Donec eleifend, libero at sagittis mollis, tellus est malesuada tellus, at luctus turpis elit\n      sit amet quam. Vivamus pretium ornare est.\n    <\/p>\n    <cite>Curabitur massa.<\/cite>\n  <\/blockquote>\n  <hr>\n  <h3>Tableau<\/h3>\n  <table>\n    <caption>\n      This is an example table, and this is its caption to describe the contents.\n    <\/caption>\n    <thead>\n      <tr>\n        <th>Table heading<\/th>\n        <th>Table heading<\/th>\n        <th>Table heading<\/th>\n        <th>Table heading<\/th>\n      <\/tr>\n    <\/thead>\n    <tbody>\n      <tr>\n        <td>Table cell<\/td>\n        <td>Table cell<\/td>\n        <td>Table cell<\/td>\n        <td>Table cell<\/td>\n      <\/tr>\n      <tr>\n        <td>Table cell<\/td>\n        <td>Table cell<\/td>\n        <td>Table cell<\/td>\n        <td>Table cell<\/td>\n      <\/tr>\n      <tr>\n        <td>Table cell<\/td>\n        <td>Table cell<\/td>\n        <td>Table cell<\/td>\n        <td>Table cell<\/td>\n      <\/tr>\n    <\/tbody>\n  <\/table>\n<\/section>\n<section class=\"row interaction\">\n  <h3>User Interaction<\/h3>\n  <form class=\"bd-example\">\n    <fieldset>\n      <legend>Example legend<\/legend>\n      <p>\n        <label for=\"input\">Example input<\/label>\n        <input id=\"input\" placeholder=\"Example input\" type=\"text\">\n      <\/p>\n      <p>\n        <label for=\"select\">Example select<\/label>\n        <select id=\"select\">\n          <option value=\"\">Choose...<\/option>\n          <optgroup label=\"Option group 1\">\n            <option value=\"\">Option 1<\/option>\n            <option value=\"\">Option 2<\/option>\n            <option value=\"\">Option 3<\/option>\n          <\/optgroup>\n          <optgroup label=\"Option group 2\">\n            <option value=\"\">Option 4<\/option>\n            <option value=\"\">Option 5<\/option>\n            <option value=\"\">Option 6<\/option>\n          <\/optgroup>\n        <\/select>\n      <\/p>\n      <p>\n        <label>\n        <input value=\"\" type=\"checkbox\">\n        Check this checkbox\n        <\/label>\n      <\/p>\n      <p>\n        <label>\n        <input name=\"optionsRadios\" id=\"optionsRadios1\" value=\"option1\" checked=\"\" type=\"radio\">\n        Option one is this and that\n        <\/label>\n        <label>\n        <input name=\"optionsRadios\" id=\"optionsRadios2\" value=\"option2\" type=\"radio\">\n        Option two is something else that's also super long to demonstrate the wrapping of these fancy form controls.\n        <\/label>\n        <label>\n        <input name=\"optionsRadios\" id=\"optionsRadios3\" value=\"option3\" disabled=\"\" type=\"radio\">\n        Option three is disabled\n        <\/label>\n      <\/p>\n      <p>\n        <label for=\"textarea\">Example textarea<\/label>\n        <textarea id=\"textarea\" rows=\"3\"><\/textarea>\n      <\/p>\n      <p>\n        <label for=\"color\">Example color<\/label>\n        <input id=\"color\" type=\"color\">\n      <\/p>\n      <p>\n        <label for=\"date\">Example date<\/label>\n        <input id=\"date\" type=\"date\">\n      <\/p>\n      <p>\n        <label for=\"datetime-local\">Example datetime-local<\/label>\n        <input id=\"datetime-local\" type=\"datetime-local\">\n      <\/p>\n      <p>\n        <label for=\"email\">Example email<\/label>\n        <input id=\"email\" type=\"email\">\n      <\/p>\n      <p>\n        <label for=\"month\">Example month<\/label>\n        <input id=\"month\" type=\"month\">\n      <\/p>\n      <p>\n        <label for=\"number\">Example number<\/label>\n        <input id=\"number\" type=\"number\">\n      <\/p>\n      <p>\n        <label for=\"range\">Example range<\/label>\n        <input id=\"range\" type=\"range\">\n      <\/p>\n      <p>\n        <label for=\"search\">Example search<\/label>\n        <input id=\"search\" type=\"search\">\n      <\/p>\n      <label for=\"tel\">Example tel<\/label>\n      <input id=\"tel\" type=\"tel\">\n      <p><\/p>\n      <label for=\"time\">Example time<\/label>\n      <input id=\"time\" type=\"time\">\n      <p><\/p>\n      <label for=\"url\">Example url<\/label>\n      <input id=\"url\" type=\"url\">\n      <p><\/p>\n      <label for=\"week\">Example week<\/label>\n      <input id=\"week\" type=\"week\">\n      <p><\/p>\n      <p>\n        <label for=\"output\">Example output<\/label>\n        <output name=\"result\" id=\"output\">100<\/output>\n      <\/p>\n      <p>\n        <button type=\"submit\">Button submit<\/button>\n        <input value=\"Input submit button\" type=\"submit\">\n        <input value=\"Input button\" type=\"button\">\n      <\/p>\n      <p>\n        <button type=\"submit\" disabled=\"\">Button submit<\/button>\n        <input value=\"Input submit button\" disabled=\"\" type=\"submit\">\n        <input value=\"Input button\" disabled=\"\" type=\"button\">\n      <\/p>\n    <\/fieldset>\n  <\/form>\n<\/section>\n<section class=\"row aside more\">\n  <h2>More \u2026<\/h2>\n  <h3>Adresse<\/h3>\n  <address>\n    <strong>Hubert Souchaud<\/strong><br>\n    26 Grand'Rue<br>\n    86000 Poitiers, France<br>\n    <abbr title=\"Phone\">Tel.<\/abbr>: +33 651097069\n  <\/address>\n  <hr>\n  <h3>Code<\/h3>\n  <pre><code>&lt;p&gt;Sample text here...&lt;\/p&gt;\n&lt;p&gt;And another line of sample text here...&lt;\/p&gt;\n<\/code><\/pre>\n  <p><var>y<\/var> = <var>m<\/var><var>x<\/var> + <var>b<\/var><\/p>\n  <p>To switch directories, type <kbd>cd<\/kbd> followed by the name of the directory.<br> To edit settings, press <kbd><kbd>ctrl<\/kbd> + <kbd>,<\/kbd><\/kbd><\/p>\n  <p><samp>This text is meant to be treated as sample output from a computer program.<\/samp><\/p>\n<\/section>\n<footer class=\"footer\">\n  <h2 class=\"sr-only\" aria-hidden=\"true\">\ud83d\ude09 <\/h2>\n  <p>\u00a92017 Hubert Souchaud<\/p>\n<\/footer>\n","protected":false},"excerpt":{"rendered":"<p>D\u00e9mo contenu HTML<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":10000,"comment_status":"closed","ping_status":"closed","template":"","meta":{"advanced_seo_description":"","jetpack_seo_html_title":"","jetpack_seo_noindex":false,"Layout":"","footnotes":"","_wp_rev_ctl_limit":""},"class_list":["entry","author-dmsr","has-excerpt","post-63","page","type-page","status-publish","odd"],"jetpack-related-posts":[{"id":57,"url":"https:\/\/hubertsouchaud.fr\/cms\/webmaster\/","url_meta":{"origin":63,"position":0},"title":"Webmaster","author":"Hubert Souchaud","date":"3 octobre 2019","format":false,"excerpt":"Contacter le webmaster","rel":"","context":"Article similaire","block_context":{"text":"Article similaire","link":""},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":58,"url":"https:\/\/hubertsouchaud.fr\/cms\/mentions-legales\/","url_meta":{"origin":63,"position":1},"title":"Mentions l\u00e9gales","author":"Hubert Souchaud","date":"3 octobre 2019","format":false,"excerpt":"Bienvenue!","rel":"","context":"Article similaire","block_context":{"text":"Article similaire","link":""},"img":{"alt_text":"Logo Hubert Souchaud","src":"https:\/\/i0.wp.com\/hubertsouchaud.fr\/cms\/wp-content\/uploads\/2018\/12\/logo-256x256.png?resize=350%2C200&ssl=1","width":350,"height":200},"classes":[]},{"id":55,"url":"https:\/\/hubertsouchaud.fr\/cms\/contact\/","url_meta":{"origin":63,"position":2},"title":"Contact","author":"Hubert Souchaud","date":"3 octobre 2019","format":false,"excerpt":"Entrer en contact","rel":"","context":"Article similaire","block_context":{"text":"Article similaire","link":""},"img":{"alt_text":"Localisation Hubert Souchaud","src":"https:\/\/i0.wp.com\/hubertsouchaud.fr\/cms\/wp-content\/uploads\/2019\/10\/map%402x.jpg?resize=350%2C200&ssl=1","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/hubertsouchaud.fr\/cms\/wp-content\/uploads\/2019\/10\/map%402x.jpg?resize=350%2C200&ssl=1 1x, https:\/\/i0.wp.com\/hubertsouchaud.fr\/cms\/wp-content\/uploads\/2019\/10\/map%402x.jpg?resize=525%2C300&ssl=1 1.5x, https:\/\/i0.wp.com\/hubertsouchaud.fr\/cms\/wp-content\/uploads\/2019\/10\/map%402x.jpg?resize=700%2C400&ssl=1 2x, https:\/\/i0.wp.com\/hubertsouchaud.fr\/cms\/wp-content\/uploads\/2019\/10\/map%402x.jpg?resize=1050%2C600&ssl=1 3x"},"classes":[]},{"id":53,"url":"https:\/\/hubertsouchaud.fr\/cms\/a-propos\/","url_meta":{"origin":63,"position":3},"title":"\u00c0 propos","author":"Hubert Souchaud","date":"3 octobre 2019","format":false,"excerpt":"Vous allez d\u00e9coller ! Je b\u00e2tis et j'entretiens l'ensemble de votre projet web. Votre site, mais aussi l'ensemble de vos donn\u00e9es et services web que vous utilisez par ailleurs\u2026 dans le cloud (les nuages). Je vous forme \u00e0 l'usage de vos outils web marketing, en particulier Wordpress, Google, Facebook et\u2026","rel":"","context":"Article similaire","block_context":{"text":"Article similaire","link":""},"img":{"alt_text":"Avion dans le ciel","src":"https:\/\/i0.wp.com\/hubertsouchaud.fr\/cms\/wp-content\/uploads\/2019\/10\/airplanes_trans.jpg?resize=350%2C200&ssl=1","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/hubertsouchaud.fr\/cms\/wp-content\/uploads\/2019\/10\/airplanes_trans.jpg?resize=350%2C200&ssl=1 1x, https:\/\/i0.wp.com\/hubertsouchaud.fr\/cms\/wp-content\/uploads\/2019\/10\/airplanes_trans.jpg?resize=525%2C300&ssl=1 1.5x, https:\/\/i0.wp.com\/hubertsouchaud.fr\/cms\/wp-content\/uploads\/2019\/10\/airplanes_trans.jpg?resize=700%2C400&ssl=1 2x, https:\/\/i0.wp.com\/hubertsouchaud.fr\/cms\/wp-content\/uploads\/2019\/10\/airplanes_trans.jpg?resize=1050%2C600&ssl=1 3x"},"classes":[]}],"jetpack_sharing_enabled":true,"jetpack_shortlink":"https:\/\/wp.me\/Pak7s8-11","_links":{"self":[{"href":"https:\/\/hubertsouchaud.fr\/cms\/wp-json\/wp\/v2\/pages\/63","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/hubertsouchaud.fr\/cms\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/hubertsouchaud.fr\/cms\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/hubertsouchaud.fr\/cms\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/hubertsouchaud.fr\/cms\/wp-json\/wp\/v2\/comments?post=63"}],"version-history":[{"count":1,"href":"https:\/\/hubertsouchaud.fr\/cms\/wp-json\/wp\/v2\/pages\/63\/revisions"}],"predecessor-version":[{"id":85,"href":"https:\/\/hubertsouchaud.fr\/cms\/wp-json\/wp\/v2\/pages\/63\/revisions\/85"}],"wp:attachment":[{"href":"https:\/\/hubertsouchaud.fr\/cms\/wp-json\/wp\/v2\/media?parent=63"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}