{"id":7326,"date":"2012-06-04T12:13:09","date_gmt":"2012-06-04T10:13:09","guid":{"rendered":"http:\/\/flaven.fr\/?p=7326"},"modified":"2012-06-04T12:13:09","modified_gmt":"2012-06-04T10:13:09","slug":"ajouter-un-style-a-une-piste","status":"publish","type":"post","link":"https:\/\/flaven.fr\/2012\/06\/ajouter-un-style-a-une-piste\/","title":{"rendered":"Ajouter un style \u00e0 une piste"},"content":{"rendered":"<p><!-- 3WDOC - Aide - Gestion du style - Ajouter un style \u00e0 une piste  --><\/p>\n<p><!-- style, piste, timeline, effet d'entr\u00e9e, effet de sortie, \u00c9v\u00e9nement, HTML5, \u00e9v\u00e9nement, apparition, show, jQuery, rich-media, Cloud, webdoc, s\u00e9quence, m\u00e9dias, 3WDOC, compte, action, l'article, audio, nuage, codec, CSS, CSS3, domaine, HTML5, Jquery, m\u00e9dias, mp4, Photos, SEO, diaporama, style, jQuery --><\/p>\n<p>Le style et l&#8217;apparence d&#8217;une cr\u00e9ation sont essentiels dans la finalisation d&#8217;un projet. C&#8217;est la raison pour laquelle, 3WDOC a mis \u00e0 disposition un puissant \u00e9diteur de style qui rend chaque piste personnalisable graphiquement. C&#8217;est enfin l&#8217;assurance qu&#8217;aucune production faite avec 3WDOC soit d&#8217;un point de vue graphique identique \u00e0 une autre. Tout est donc entre vos mains pour faire des cr\u00e9ations uniques !<\/p>\n<p>C&#8217;est l&#8217;objet de cet article, qui est une introduction rapide \u00e0 la notion de style au sein de 3WDOC.<\/p>\n<p>Tout d&#8217;abord, deux d\u00e9finitions s&#8217;imposent :<\/p>\n<ul>\n<li><code>STYLEMOUSELEAVE<\/code> d\u00e9finit l&#8217;aspect graphique par d\u00e9faut de la piste.<\/li>\n<li><code>STYLEMOUSEENTER<\/code> d\u00e9finit l&#8217;aspect graphique par d\u00e9faut lorsque la souris de l&#8217;utilisateur passe sur cet piste.<\/li>\n<\/ul>\n<p><iframe loading=\"lazy\" src=\"http:\/\/player.vimeo.com\/video\/42619987?title=0&amp;portrait=0&amp;color=ff0179\" width=\"960\" height=\"601\" frameborder=\"0\" webkitAllowFullScreen mozallowfullscreen allowFullScreen><\/iframe><\/p>\n<p><b>Dans cette exemple, nous allons attacher un style \u00e0 une piste <code>article<\/code>. Evidemment, vous pouvez affecter autant de style que vous le souhaitez \u00e0 des pistes identiques ou \u00e0 d&#8217;autres pistes comme des images par exemple. La proc\u00e9dure d&#8217;ajout d&#8217;un style est identique quelque soit le type de piste.<\/b><\/p>\n<p><b>Tout d&#8217;abord, nous allons cr\u00e9er une piste <code>article<\/code> afin d&#8217;y ajouter un style.<\/b><br \/>\n<a href=\"https:\/\/flaven.fr\/wp-content\/uploads\/2012\/05\/012_add_and_style_an_article_1_960.jpg\" title=\"3WDOC - Aide - Gestion du style - Ajouter un style \u00e0 une piste\" rel=\"gallery\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter\" src=\"https:\/\/flaven.fr\/wp-content\/uploads\/2012\/05\/012_add_and_style_an_article_1_960.jpg\" alt=\"3WDOC - Aide - Gestion du style - Ajouter un style \u00e0 une piste\" width=\"960\" height=\"600\" \/><\/a><\/p>\n<p><b>En faisant un glisser-d\u00e9poser sur le <code>player<\/code> en mode \u00e9dition, une piste <code>article<\/code> se cr\u00e9e automatiquement. A cette piste est automatiquement attach\u00e9 un style par d\u00e9faut et au survol de la souris.<\/b><br \/>\n<a href=\"https:\/\/flaven.fr\/wp-content\/uploads\/2012\/05\/012_add_and_style_an_article_2_960.jpg\" title=\"3WDOC - Aide - Gestion du style - Ajouter un style \u00e0 une piste\" rel=\"gallery\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter\" src=\"https:\/\/flaven.fr\/wp-content\/uploads\/2012\/05\/012_add_and_style_an_article_2_960.jpg\" alt=\"3WDOC - Aide - Gestion du style - Ajouter un style \u00e0 une piste\" width=\"960\" height=\"600\" \/><\/a><\/p>\n<p><b>Vous pouvez d\u00e8s \u00e0 pr\u00e9sent, positionner correctement votre piste <code>article<\/code><\/b><br \/>\n<a href=\"https:\/\/flaven.fr\/wp-content\/uploads\/2012\/05\/012_add_and_style_an_article_3_960.jpg\" title=\"3WDOC - Aide - Gestion du style - Ajouter un style \u00e0 une piste\" rel=\"gallery\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter\" src=\"https:\/\/flaven.fr\/wp-content\/uploads\/2012\/05\/012_add_and_style_an_article_3_960.jpg\" alt=\"3WDOC - Aide - Gestion du style - Ajouter un style \u00e0 une piste\" width=\"960\" height=\"600\" \/><\/a><\/p>\n<p><b>En s\u00e9lectionnant la piste <code>article<\/code> via le <code>player<\/code>, on acc\u00e8de ensuite aux diff\u00e9rents onglets de param\u00e9trage de cette piste. Il suffit ensuite de se placer sur l&#8217;onglet <code>Style<\/code>, puis on clique sur l&#8217;encart <code>STYLEMOUSELEAVE<\/code>, on va donc travailler sur l&#8217;aspect graphique par d\u00e9faut de la piste. Pour l&#8217;aspect graphique au passage de la souris de sortie, il suffirait alors de cliquer sur l&#8217;encart <code>STYLEMOUSEENTER<\/code><\/b><br \/>\n<a href=\"https:\/\/flaven.fr\/wp-content\/uploads\/2012\/05\/012_add_and_style_an_article_4_960.jpg\" title=\"3WDOC - Aide - Gestion du style - Ajouter un style \u00e0 une piste\" rel=\"gallery\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter\" src=\"https:\/\/flaven.fr\/wp-content\/uploads\/2012\/05\/012_add_and_style_an_article_4_960.jpg\" alt=\"3WDOC - Aide - Gestion du style - Ajouter un style \u00e0 une piste\" width=\"960\" height=\"600\" \/><\/a><\/p>\n<p><b>Dans la boite de dialogue, 3WDOC a mis \u00e0 disposition un certain nombre de param\u00e8tres de style relatifs \u00e0 la piste. Il s&#8217;agit des param\u00e8tres CSS de la piste. Vous pouvez changer tout ou partie du style, de la couleur, \u00e0 la police en passant par la forme.<\/b><br \/>\n<a href=\"https:\/\/flaven.fr\/wp-content\/uploads\/2012\/05\/012_add_and_style_an_article_5_960.jpg\" title=\"3WDOC - Aide - Gestion du style - Ajouter un style \u00e0 une piste\" rel=\"gallery\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter\" src=\"https:\/\/flaven.fr\/wp-content\/uploads\/2012\/05\/012_add_and_style_an_article_5_960.jpg\" alt=\"3WDOC - Aide - Gestion du style - Ajouter un style \u00e0 une piste\" width=\"960\" height=\"600\" \/><\/a><\/p>\n<p><b>Une fois, la boite de dialogue ferm\u00e9e. Les caract\u00e9ristiques du style vous sont rappel\u00e9es dans l&#8217;encart <code>STYLEMOUSELEAVE<\/code> et dans l&#8217;encart<code>STYLEMOUSEENTER<\/code>.<\/b><br \/>\n<a href=\"https:\/\/flaven.fr\/wp-content\/uploads\/2012\/05\/012_add_and_style_an_article_6_960.jpg\" title=\"3WDOC - Aide - Gestion du style - Ajouter un style \u00e0 une piste\" rel=\"gallery\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter\" src=\"https:\/\/flaven.fr\/wp-content\/uploads\/2012\/05\/012_add_and_style_an_article_6_960.jpg\" alt=\"3WDOC - Aide - Gestion du style - Ajouter un style \u00e0 une piste\" width=\"960\" height=\"600\" \/><\/a><\/p>\n<p><b>En passant du mode \u00e9diteur au mode player et en jouant votre s\u00e9quence, vous pourrez voir le style d\u00e9fini sur votre piste.<\/b><\/p>\n<h4>Qu&#8217;est-ce que 3WDOC<\/h4>\n<p>En savoir plus sur 3WDOC<\/p>\n<blockquote><p>3WDOC, un outil de montage universel, dont tout le monde peut d\u00e9sormais se servir pour raconter des histoires interactives pour les diffuser partout sur le web, sur tout type de plate-forme mobile ou prochainement sur la TV connect\u00e9e.<\/p>\n<p>3WDOC est une approche r\u00e9volutionnaire pour la communication digitale. Con\u00e7u pour faciliter la cr\u00e9ation de sites et de webdocs d&#8217;excellence, 3WDOC est la meilleure exp\u00e9rience rich-media et interactive possible, pr\u00e9vue pour toutes les audiences : web, mobile et t\u00e9l\u00e9.<\/p><\/blockquote>\n<h2>Plus d&#8217;informations<\/h2>\n<ul>\n<li>INSCRIPCION (Spanish)<br \/>\n<a href=\"http:\/\/app.3wdoc.com\/account\/signup\/es\" target=\"_blank\">http:\/\/app.3wdoc.com\/account\/signup\/es<\/a><\/li>\n<li>INSCRIPTION (French)<br \/>\n<a href=\"http:\/\/app.3wdoc.com\/account\/signup\/fr\" target=\"_blank\">http:\/\/app.3wdoc.com\/account\/signup\/fr<\/a><\/li>\n<li>SIGNUP (English)<br \/>\n<a href=\"http:\/\/app.3wdoc.com\/account\/signup\/en\" target=\"_blank\">http:\/\/app.3wdoc.com\/account\/signup\/en<\/a><\/li>\n<\/ul>\n","protected":false},"excerpt":{"rendered":"<p>Le style et l&#8217;apparence d&#8217;une cr\u00e9ation sont essentiels dans la finalisation d&#8217;un projet. C&#8217;est la raison pour laquelle, 3WDOC a mis \u00e0 disposition un puissant \u00e9diteur de style qui rend chaque piste personnalisable graphiquement.<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"bf_ai_meta_description":"3WDOC offre un \u00e9diteur de style pour personnaliser graphiquement chaque piste. Ma\u00eetrisez STYLEMOUSELEAVE et STYLEMOUSEENTER pour des cr\u00e9ations uniques.","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":[3433,3451],"tags":[578,502,1651,325,2200,670,1111,209,2245,1142,112,1657,1658,450,2266,2185,2267,799,2190,1645,338,324,1646,154,1144,398,44,1110,1652,606,1130,1660,2263],"class_list":["post-7326","post","type-post","status-publish","format-standard","hentry","category-3wdoc-tutorials","category-web-design-front-end","tag-3wdoc","tag-action","tag-apparition","tag-audio","tag-cloud","tag-codec","tag-compte","tag-css","tag-css3","tag-diaporama","tag-domaine","tag-effet-dentree","tag-effet-de-sortie","tag-evenement","tag-experiences","tag-html5","tag-interactif","tag-interactives","tag-jquery","tag-larticle","tag-medias","tag-mp4","tag-nuage","tag-photos","tag-piste","tag-rich-media","tag-seo","tag-sequence","tag-show","tag-storytelling","tag-style","tag-timeline","tag-webdoc"],"jetpack_publicize_connections":[],"jetpack_sharing_enabled":true,"jetpack_shortlink":"https:\/\/wp.me\/p3Vuhl-1Ua","jetpack_featured_media_url":"","_links":{"self":[{"href":"https:\/\/flaven.fr\/happy-api\/wp\/v2\/posts\/7326","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=7326"}],"version-history":[{"count":0,"href":"https:\/\/flaven.fr\/happy-api\/wp\/v2\/posts\/7326\/revisions"}],"wp:attachment":[{"href":"https:\/\/flaven.fr\/happy-api\/wp\/v2\/media?parent=7326"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/flaven.fr\/happy-api\/wp\/v2\/categories?post=7326"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/flaven.fr\/happy-api\/wp\/v2\/tags?post=7326"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}