{"id":10568,"date":"2015-08-12T17:56:18","date_gmt":"2015-08-12T15:56:18","guid":{"rendered":"http:\/\/flaven.fr\/?p=10568"},"modified":"2015-08-12T22:35:49","modified_gmt":"2015-08-12T20:35:49","slug":"deck-js-javascript-faire-une-presentation-avec-deck-js","status":"publish","type":"post","link":"https:\/\/flaven.fr\/2015\/08\/deck-js-javascript-faire-une-presentation-avec-deck-js\/","title":{"rendered":"deck.js, JavaScript &#8211; Faire une pr\u00e9sentation avec deck.js"},"content":{"rendered":"<p>Tout le monde connait powerpoint ou keynote. Compte tenu du fait que le partage d&#8217;information et la communication \u00e9taient d\u00e9j\u00e0 pr\u00e9gnants dans le monde du travail, il va sans qu&#8217;avec la mobilit\u00e9 et l&#8217;imp\u00e9ratif toujours renouvel\u00e9 de documenter, synth\u00e9tiser puis partager imposent progressivement de changer le format de la sacro-sainte pr\u00e9sentation. La pr\u00e9sentation devient un petit module en soit, facilement modifiable, multi-plateformes, chargeable en local ou sur le Cloud \u00e0 l&#8217;aide de n&#8217;importe quel navigateur moderne.<\/p>\n<p>C&#8217;est ainsi que l&#8217;on voit donc fleurir de tr\u00e8s nombreux frameworks Javascript, HTML5, CSS, qui rivalisent dans l&#8217;art de la pr\u00e9sentation, si tant est que cela soit un art !<\/p>\n<p>Cet article ne sera consacr\u00e9 en fait qu&#8217;\u00e0 un seul des 2 frameworks retenus au d\u00e9part \u00e0 savoir : <code>deck.js<\/code>. On laisse de cot\u00e9 \u00e0 tort <code>REVEAL.JS<\/code> de l&#8217;excellent Hakim El Hattab, bien connu pour ses animations HTML5, CSS3. Ce framework sera sans doute l&#8217;objet d&#8217;un article futur. Ce framework a quand m\u00eame du potentiel !<br \/>\nSource : <a href=\"http:\/\/lab.hakim.se\/reveal-js\/#\/\" target=\"_blank\">http:\/\/lab.hakim.se\/reveal-js\/#\/<\/a><\/p>\n<p>Pour se donner aussi une id\u00e9e du potentiel de Deck.js, voici un excellent lien qui montre en action ce framework de presentation <code>Deck.js<\/code>.<br \/>\nSource : <a href=\"http:\/\/imakewebthings.com\/deck.js\/introduction\/\" target=\"_blank\">http:\/\/imakewebthings.com\/deck.js\/introduction\/<\/a><\/p>\n<h4>La forme au d\u00e9triment du fond<\/h4>\n<p>C&#8217;est une \u00e9vidence qu&#8217;un logiciel de pr\u00e9sentation dissimule parfois l&#8217;indigence de la r\u00e9flexion sous des effets de manche mais pas toujours, il faut aussi en convenir. Il existe m\u00eame un livre plut\u00f4t caustique sur la question nomm\u00e9e &#8220;La Pens\u00e9e PowerPoint, enqu\u00eate sur ce logiciel qui rend stupide&#8221; de Franck Frommer.<\/p>\n<p>Que vous passiez sous un framework ne change rien, vous n&#8217;\u00e9chapperez pas \u00e0 ce travers. Vous pouvez en plus de vous former \u00e0 ce framework, vous impr\u00e9gniez du code &#8220;bushido&#8221; de la pr\u00e9sentation de feu Steve Jobs. Voici 2 videos, pr\u00e9sentant quelques morceaux de choix du grand Steve, le shogun de la prez minimaliste !<\/p>\n<ul>\n<li><a href=\"https:\/\/www.youtube.com\/watch?v=iJq-thyDF9Q\" target=\"_blank\">Steve Jobs Presentation Skills<\/a><\/li>\n<li><a href=\"https:\/\/www.youtube.com\/watch?v=uvsuAZFem88\" target=\"_blank\">Steve Jobs&#8217; Best Video Moments on Stage (1\/3)<\/a><\/li>\n<\/ul>\n<h4>Modifier l&#8217;apparence de la pr\u00e9sentation<\/h4>\n<p>La premi\u00e8re que l&#8217;on souhaite g\u00e9n\u00e9ralement faire, toujours la forme sur le fond&#8230;<\/p>\n<p><b>Un certain nombre de th\u00e8me vous sont livr\u00e9s. En changeant l&#8217;url vers la css, vous changez l&#8217;apparence de votre pr\u00e9sentation : web-2.0.css, neon.css, swiss.css. On choisit <code>swiss.css<\/code><\/b><\/p>\n<pre lang=\"html\" escaped=\"true\">\r\n  &lt;!-- Style theme. More available in \/themes\/style\/ or create your own. --&gt;\r\n  &lt;link rel=\"stylesheet\" media=\"screen\" href=\"themes\/style\/swiss.css\"&gt;\r\n<\/pre>\n<p><b>On peut aussi changer la transition g\u00e9n\u00e9rale entre les slides. Il est possible de choisir un glissement vertical (vertical-slide.css), horizontal (horizontal-slide.css) ou bien le fade (fade.css).<\/b><\/p>\n<pre lang=\"html\" escaped=\"true\"> \r\n  &lt;!-- Transition theme. More available in \/themes\/transition\/ or create your own. --&gt;\r\n  &lt;link rel=\"stylesheet\" media=\"screen\" href=\"themes\/transition\/horizontal-slide.css\"&gt;\r\n<\/pre>\n<p>Dans l&#8217;URL, <code>boilerplate_5.html#css-transition<\/code>, vous acc\u00e9dez via l&#8217;URL aux \u00e9v\u00e9nements d&#8217;affichage au sein des slides.<\/p>\n<pre lang=\"html\" escaped=\"true\">\r\n&lt;p class=\"slide\" id=\"css-transition\"&gt;&amp;hellip;and how to transition between&amp;nbsp;them.&lt;\/p&gt;\r\n<\/pre>\n<p><b>Le premier slide avec le motif suisse (swiss.css)<\/b><br \/>\n<img loading=\"lazy\" decoding=\"async\" class=\"aligncenter\" src=\"https:\/\/flaven.fr\/wp-content\/uploads\/2015\/08\/prez_js_1.jpg\" width=\"640\" height=\"480\" alt=\"deck.js, JavaScript - Faire une pr\u00e9sentation avec deck.js\"><\/p>\n<p><b>Une exemple de bullet point indispensable \u00e0 toute bonne pr\u00e9sentation.<\/b><br \/>\n<img loading=\"lazy\" decoding=\"async\" class=\"aligncenter\" src=\"https:\/\/flaven.fr\/wp-content\/uploads\/2015\/08\/prez_js_2.jpg\" width=\"640\" height=\"480\" alt=\"deck.js, JavaScript - Faire une pr\u00e9sentation avec deck.js\"><\/p>\n<p><b>Un slide avec l&#8217;affiche de <code>&lt;pre&gt;...&lt;\/pre&gt;<\/code><\/b><br \/>\n<img loading=\"lazy\" decoding=\"async\" class=\"aligncenter\" src=\"https:\/\/flaven.fr\/wp-content\/uploads\/2015\/08\/prez_js_3.jpg\" width=\"640\" height=\"480\" alt=\"deck.js, JavaScript - Faire une pr\u00e9sentation avec deck.js\"><\/p>\n<p><b>Le fichier source<\/b><\/p>\n<p>On est parti du fichier de base qui a \u00e9t\u00e9 l\u00e9g\u00e8rement modifi\u00e9 <code>boilerplate_5.html<\/code> disponible sur la d\u00e9monstration de Deck.js sur <a href=\"http:\/\/imakewebthings.com\/deck.js\/\" target=\"_blank\">http:\/\/imakewebthings.com\/deck.js\/<\/a> <\/p>\n<pre lang=\"html\" escaped=\"true\">\r\n\r\n&lt;!DOCTYPE html&gt;\r\n&lt;html&gt;\r\n&lt;head&gt;\r\n  &lt;meta charset=\"utf-8\"&gt;\r\n  &lt;meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge,chrome=1\"&gt;\r\n  &lt;meta name=\"viewport\" content=\"width=1024, user-scalable=no\"&gt;\r\n\r\n  &lt;title&gt;Using deck.js for Prez&lt;\/title&gt;\r\n\r\n  &lt;!-- Required stylesheet --&gt;\r\n  &lt;link rel=\"stylesheet\" media=\"screen\" href=\"core\/deck.core.css\"&gt;\r\n\r\n  &lt;!-- Extension CSS files go here. Remove or add as needed. --&gt;\r\n  &lt;link rel=\"stylesheet\" media=\"screen\" href=\"extensions\/goto\/deck.goto.css\"&gt;\r\n  &lt;link rel=\"stylesheet\" media=\"screen\" href=\"extensions\/menu\/deck.menu.css\"&gt;\r\n  &lt;link rel=\"stylesheet\" media=\"screen\" href=\"extensions\/navigation\/deck.navigation.css\"&gt;\r\n  &lt;link rel=\"stylesheet\" media=\"screen\" href=\"extensions\/status\/deck.status.css\"&gt;\r\n  &lt;link rel=\"stylesheet\" media=\"screen\" href=\"extensions\/scale\/deck.scale.css\"&gt;\r\n\r\n  &lt;!-- Style theme. More available in \/themes\/style\/ or create your own. --&gt;\r\n  &lt;link rel=\"stylesheet\" media=\"screen\" href=\"themes\/style\/swiss.css\"&gt;\r\n\r\n  &lt;!-- Transition theme. More available in \/themes\/transition\/ or create your own. --&gt;\r\n  &lt;link rel=\"stylesheet\" media=\"screen\" href=\"themes\/transition\/horizontal-slide.css\"&gt;\r\n\r\n  &lt;!-- Basic black and white print styles --&gt;\r\n  &lt;link rel=\"stylesheet\" media=\"print\" href=\"core\/print.css\"&gt;\r\n\r\n  &lt;!-- Required Modernizr file --&gt;\r\n  &lt;script src=\"modernizr.custom.js\"&gt;&lt;\/script&gt;\r\n&lt;\/head&gt;\r\n&lt;body&gt;\r\n  &lt;div class=\"deck-container\"&gt;\r\n\r\n    &lt;!-- Begin slides. Just make elements with a class of slide. --&gt;\r\n\r\n    &lt;section class=\"slide\"&gt;\r\n      &lt;h1&gt;Using Deck.js&lt;\/h1&gt;\r\n    &lt;\/section&gt;\r\n\r\n\t  \r\n\t  \r\n\t  &lt;section class=\"slide deck-next\" id=\"sample\"&gt;\r\n\t\t  &lt;hgroup&gt;\r\n\t\t  \t\t\t\t&lt;h2&gt;Vivamus sed quam leo.&lt;\/h2&gt;\r\n\t\t  \t\t\t&lt;\/hgroup&gt;\r\n\t  \t\t&lt;pre&gt;Duis luctus leo in porttitor sollicitudin. Nullam ut urna lectus. Integer ac commodo dui. Duis luctus leo in porttitor sollicitudin. Nullam ut urna lectus.&lt;\/pre&gt;\r\n\r\n\t  \t\t&lt;h2&gt;Nullam ut urna lectus.&lt;\/h2&gt;\r\n\r\n\t  \t\t&lt;div class=\"sample-content\"&gt;\r\n\t  \t\t\t&lt;p class=\"slide\" id=\"slides-html\"&gt;Slides are basic HTML.&lt;\/p&gt;\r\n\t  \t\t\t&lt;p class=\"slide\" id=\"slide-states\"&gt;The &lt;a href=\".\/docs\/#deck-core\"&gt;deck.core&lt;\/a&gt; module keeps track of slide states&lt;\/span&gt; &lt;span class=\"slide\" id=\"deck-states\"&gt;and deck states&lt;\/span&gt;&lt;span class=\"slide\" id=\"css-role\"&gt;, leaving CSS to define what each state look like&amp;hellip;&lt;\/span&gt;&lt;\/p&gt;\r\n\t  \t\t\t&lt;p class=\"slide\" id=\"css-transition\"&gt;&amp;hellip;and how to transition between&amp;nbsp;them.&lt;\/p&gt;\r\n\t  \t\t\t&lt;p class=\"slide\" id=\"extensions\"&gt;&lt;a href=\".\/introduction\/#extensions\"&gt;Extensions&lt;\/a&gt; use core &lt;a href=\".\/docs\/#deck-core-events\"&gt;events&lt;\/a&gt; and &lt;a href=\".\/docs\/#deck-core-methods\"&gt;methods&lt;\/a&gt; to add goodies&lt;span class=\"slide\" id=\"add-what-you-want\"&gt;, giving presenters the freedom to add what they want&lt;\/span&gt;&lt;span class=\"slide\" id=\"leave-stuff-out\"&gt; and leave out what they don&amp;rsquo;t.&lt;\/span&gt;&lt;\/p&gt;\r\n\t  \t\t&lt;\/div&gt;\r\n\t  \t&lt;\/section&gt;\r\n\r\n    &lt;section class=\"slide\"&gt;\r\n      &lt;h2&gt;Slide 3&lt;\/h2&gt;\r\n      &lt;ul&gt;\r\n          &lt;li class=\"slide\" id=\"extensions-bullet-1\"&gt;\r\n              &lt;strong&gt;bullet point 1&lt;\/strong&gt;: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent nec pharetra sapien. Morbi dignissim massa justo, nec ultrices lacus hendrerit ac.\r\n          &lt;\/li&gt;\r\n\r\n          &lt;li class=\"slide\" id=\"extensions-bullet-2\"&gt;\r\n              &lt;strong&gt;bullet point 2&lt;\/strong&gt;: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent nec pharetra sapien. Morbi dignissim massa justo, nec ultrices lacus hendrerit ac.\r\n          &lt;\/li&gt;\r\n\r\n          &lt;li class=\"slide\" id=\"extensions-bullet-3\"&gt;\r\n              &lt;strong&gt;bullet point 3&lt;\/strong&gt;: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent nec pharetra sapien. Morbi dignissim massa justo, nec ultrices lacus hendrerit ac.\r\n          &lt;\/li&gt;\r\n      &lt;\/ul&gt;\r\n    &lt;\/section&gt;\r\n\r\n\t        &lt;section class=\"slide\" id=\"nested\"&gt;\r\n\t            &lt;h2&gt;Nested Slides&lt;\/h2&gt;\r\n\t            &lt;p&gt;That last slide had a few steps.  To create substeps in slides, just nest them:&lt;\/p&gt;\r\n\t            &lt;pre&gt;&lt;code&gt;&amp;lt;section class=&amp;quot;slide&amp;quot;&amp;gt;\r\n\t  &amp;lt;h2&amp;gt;Extensions&amp;lt;\/h2&amp;gt;\r\n\t  &amp;lt;p&amp;gt;Core gives you basic slide functionality...&amp;lt;\/p&amp;gt;\t\t\r\n\t  &amp;lt;ul&amp;gt;\r\n\t     &amp;lt;li class=&amp;quot;slide&amp;quot;&amp;gt;\r\n\t        &amp;lt;h3&amp;gt;deck.goto&amp;lt;\/h3&amp;gt;\r\n\t        &amp;lt;p&amp;gt;Adds a shortcut key to jump to any slide number...&amp;lt;\/p&amp;gt;\r\n\t     &amp;lt;\/li&amp;gt;\r\n\t     &amp;lt;li class=&amp;quot;slide&amp;quot;&amp;gt;...&amp;lt;\/li&amp;gt;\t\r\n\t     &amp;lt;li class=&amp;quot;slide&amp;quot;&amp;gt;...&amp;lt;\/li&amp;gt;\r\n\t     &amp;lt;li class=&amp;quot;slide&amp;quot;&amp;gt;...&amp;lt;\/li&amp;gt;\r\n\t  &amp;lt;\/ul&amp;gt;\r\n\t&amp;lt;\/section&amp;gt;&lt;\/code&gt;&lt;\/pre&gt;\r\n\t        &lt;\/section&gt;\r\n\r\n    &lt;!-- End slides. --&gt;\r\n\r\n    &lt;!-- Begin extension snippets. Add or remove as needed. --&gt;\r\n\r\n    &lt;!-- deck.navigation snippet --&gt;\r\n    &lt;div aria-role=\"navigation\"&gt;\r\n      &lt;a href=\"#\" class=\"deck-prev-link\" title=\"Previous\"&gt;&amp;lt;&lt;\/a&gt;\r\n      &lt;a href=\"#\" class=\"deck-next-link\" title=\"Next\"&gt;&amp;gt;&lt;\/a&gt;\r\n    &lt;\/div&gt;\r\n\r\n    &lt;!-- deck.status snippet --&gt;\r\n    &lt;p class=\"deck-status\" aria-role=\"status\"&gt;\r\n      &lt;span class=\"deck-status-current\"&gt;&lt;\/span&gt;\r\n      |\r\n      &lt;span class=\"deck-status-total\"&gt;&lt;\/span&gt;\r\n    &lt;\/p&gt;\r\n\r\n    &lt;!-- deck.goto snippet --&gt;\r\n    &lt;form action=\".\" method=\"get\" class=\"goto-form\"&gt;\r\n      &lt;label for=\"goto-slide\"&gt;Go to slide:&lt;\/label&gt;\r\n      &lt;input type=\"text\" name=\"slidenum\" id=\"goto-slide\" list=\"goto-datalist\"&gt;\r\n      &lt;datalist id=\"goto-datalist\"&gt;&lt;\/datalist&gt;\r\n      &lt;input type=\"submit\" value=\"Go\"&gt;\r\n    &lt;\/form&gt;\r\n\r\n    &lt;!-- End extension snippets. --&gt;\r\n  &lt;\/div&gt;\r\n\r\n&lt;!-- Required JS files. --&gt;\r\n&lt;script src=\"jquery.min.js\"&gt;&lt;\/script&gt;\r\n&lt;script src=\"core\/deck.core.js\"&gt;&lt;\/script&gt;\r\n\r\n&lt;!-- Extension JS files. Add or remove as needed. --&gt;\r\n&lt;script src=\"extensions\/menu\/deck.menu.js\"&gt;&lt;\/script&gt;\r\n&lt;script src=\"extensions\/goto\/deck.goto.js\"&gt;&lt;\/script&gt;\r\n&lt;script src=\"extensions\/status\/deck.status.js\"&gt;&lt;\/script&gt;\r\n&lt;script src=\"extensions\/navigation\/deck.navigation.js\"&gt;&lt;\/script&gt;\r\n&lt;script src=\"extensions\/scale\/deck.scale.js\"&gt;&lt;\/script&gt;\r\n\r\n&lt;!-- Initialize the deck. You can put this in an external file if desired. --&gt;\r\n&lt;script&gt;\r\n  $(function() {\r\n    $.deck(&#x27;.slide&#x27;);\r\n  });\r\n&lt;\/script&gt;\r\n&lt;\/body&gt;\r\n&lt;\/html&gt;\r\n\t\r\n\t\r\n<\/pre>\n<h2>En savoir plus<\/h2>\n<ul>\n<li>HTML Slides With Deck.js and Extensions<br \/><a href=\"http:\/\/home.heeere.com\/tech-deckjs-ext.html\" target=\"_blank\">http:\/\/home.heeere.com\/tech-deckjs-ext.html<\/a><\/li>\n<li>deck.js &raquo; Modern HTML Presentations<br \/><a href=\"http:\/\/imakewebthings.com\/deck.js\/#int\" target=\"_blank\">http:\/\/imakewebthings.com\/deck.js\/#int<\/a><\/li>\n<li>La documentation de deck.js<br \/><a href=\"http:\/\/imakewebthings.com\/deck.js\/docs\/\" target=\"_blank\">http:\/\/imakewebthings.com\/deck.js\/docs\/<\/a><\/li>\n<li>reveal.js &#8211; The HTML Presentation Framework<br \/><a href=\"http:\/\/lab.hakim.se\/reveal-js\/#\/\" target=\"_blank\">http:\/\/lab.hakim.se\/reveal-js\/#\/<\/a><\/li>\n<li>Un bestof de 12 12 javascript &amp; html5 presentation frameworks<br \/><a href=\"http:\/\/codecall.net\/2014\/02\/07\/best-javascript-html5-presentation-frameworks\/\" target=\"_blank\">http:\/\/codecall.net\/2014\/02\/07\/best-javascript-html5-presentation-frameworks\/<\/a><\/li>\n<li>Logiciel de pr\u00e9sentation | Outils de pr\u00e9sentation en ligne | Prezi<br \/><a href=\"https:\/\/prezi.com\/\" target=\"_blank\">https:\/\/prezi.com\/<\/a><\/li>\n<li>Un exemple parmi d&#8217;autres bas\u00e9 sur deck.js<br \/><a href=\"https:\/\/github.com\/silviapfeiffer\/lca_2014_webrtc\" target=\"_blank\">https:\/\/github.com\/silviapfeiffer\/lca_2014_webrtc<\/a><\/li>\n<li>Roundup of HTML-Based Slide Deck Toolkits<br \/><a href=\"http:\/\/www.impressivewebs.com\/html-slidedeck-toolkits\/\" target=\"_blank\">http:\/\/www.impressivewebs.com\/html-slidedeck-toolkits\/<\/a><\/li>\n<li>HTML5 Showcase for Web Developers: The Wow and the How<br \/><a href=\"http:\/\/www.htmlfivewow.com\/\" target=\"_blank\">http:\/\/www.htmlfivewow.com\/<\/a><\/li>\n<li>L&#8217;autre framework reveal.js<br \/><a href=\"https:\/\/github.com\/hakimel\/reveal.js\/\" target=\"_blank\">https:\/\/github.com\/hakimel\/reveal.js\/<\/a><\/li>\n<li>Theme Builder for Deck.js<br \/><a href=\"https:\/\/github.com\/twitwi\/deck.js-theme-builder\" target=\"_blank\">https:\/\/github.com\/twitwi\/deck.js-theme-builder<\/a><\/li>\n<\/ul>\n","protected":false},"excerpt":{"rendered":"<p>Tout le monde connait powerpoint ou keynote. Compte tenu du fait que le partage d&#8217;information et la communication \u00e9taient d\u00e9j\u00e0 pr\u00e9gnants dans le monde du&hellip; <\/p>\n<p class=\"text-center\"><a href=\"https:\/\/flaven.fr\/2015\/08\/deck-js-javascript-faire-une-presentation-avec-deck-js\/\" class=\"more-link\">Continue reading &rarr; <span class=\"screen-reader-text\">deck.js, JavaScript &#8211; Faire une pr\u00e9sentation avec deck.js<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":10573,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"bf_ai_meta_description":"Deck.js, JavaScript framework for creating dynamic, multi-platform presentations. Master tools for modern, shareable slides with local or cloud loading.","bf_ai_og_title":"","footnotes":"","jetpack_publicize_message":"","jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":true,"jetpack_social_options":{"image_generator_settings":{"template":"highway","default_image_id":0,"font":"","enabled":false},"version":2},"jetpack_post_was_ever_published":false},"categories":[3444,3447,3449,3450,3451,3435],"tags":[2179,2245,2176,1074,2185,226,2180,2177,2175,2178],"class_list":["post-10568","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-programming-databases","category-technology-trends","category-tutorials-how-to","category-ux-product-design","category-web-design-front-end","category-web-development","tag-animations","tag-css3","tag-deck-js","tag-hakim-el-hattab","tag-html5","tag-javascript","tag-ppt","tag-presentation","tag-reveal","tag-steve-jobs"],"jetpack_publicize_connections":[],"jetpack_sharing_enabled":true,"jetpack_shortlink":"https:\/\/wp.me\/p3Vuhl-2Ks","jetpack_featured_media_url":"https:\/\/flaven.fr\/wp-content\/uploads\/2015\/08\/prez_js_b.jpg","_links":{"self":[{"href":"https:\/\/flaven.fr\/happy-api\/wp\/v2\/posts\/10568","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/flaven.fr\/happy-api\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/flaven.fr\/happy-api\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/flaven.fr\/happy-api\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/flaven.fr\/happy-api\/wp\/v2\/comments?post=10568"}],"version-history":[{"count":3,"href":"https:\/\/flaven.fr\/happy-api\/wp\/v2\/posts\/10568\/revisions"}],"predecessor-version":[{"id":10575,"href":"https:\/\/flaven.fr\/happy-api\/wp\/v2\/posts\/10568\/revisions\/10575"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/flaven.fr\/happy-api\/wp\/v2\/media\/10573"}],"wp:attachment":[{"href":"https:\/\/flaven.fr\/happy-api\/wp\/v2\/media?parent=10568"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/flaven.fr\/happy-api\/wp\/v2\/categories?post=10568"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/flaven.fr\/happy-api\/wp\/v2\/tags?post=10568"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}