{"id":7165,"date":"2017-03-27T18:57:44","date_gmt":"2017-03-27T13:27:44","guid":{"rendered":"https:\/\/email.uplers.com\/blogs\/?p=7165"},"modified":"2020-07-31T00:05:20","modified_gmt":"2020-07-30T18:35:20","slug":"make-cinemagraph-email","status":"publish","type":"post","link":"https:\/\/email.uplers.com\/blog\/make-cinemagraph-email\/","title":{"rendered":"How to Create a Cinemagraph in Email?"},"content":{"rendered":"<p><span style=\"font-size: inherit;\">Cinemagraph is a unique tableau with meticulously added cinematic effects. It is truly a revolution among revolutions. Hope you have read about the popularity and potential of cinemagraphs in email in our <a href=\"https:\/\/email.uplers.com\/blog\/cinemagraph-gif-email-campaign\/\" target=\"_blank\" rel=\"noopener noreferrer\">previous post<\/a>. Uplers take you a step ahead now with insights into how to create a cinemagraph.<\/span><\/p>\n<p>Let\u2019s start!<\/p>\n<h3>Creating a Cinemagraph \u2013 The Prerequisites<\/h3>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-7173 size-full\" title=\"cinemagraph requisites\" src=\"https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2017\/03\/cinemagraph-requisites.jpg\" alt=\"cinemagraph requisites\" width=\"345\" height=\"339\" \/><\/p>\n<p>Now, how will you proceed to prepare the cinemagraph?<\/p>\n<h2>1. Look for a great idea<\/h2>\n<ul>\n<li>An <strong>idea<\/strong> is the first step to creating a cinemagraph. Look around for an idea and craft a plan.<\/li>\n<li>Choose your <strong>subject and the action<\/strong> that you want to capture in the video.<\/li>\n<li>Figure out the parts that should move and the parts that should remain still.<\/li>\n<\/ul>\n<div class=\"banner_wrapper\" style=\"\"><div class=\"banner  banner-17407 bottom vert custom-banners-theme-default_style\" style=\"\"><a class=\"custom_banners_big_link\"  target=\"_blank\"  href=\"https:\/\/email.uplers.com\/custom-email-templates-design-coding\/\"><img loading=\"lazy\" decoding=\"async\" width=\"800\" height=\"200\" src=\"https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2018\/04\/custom-email-design-coding.jpg\" class=\"attachment-full size-full\" alt=\"\" srcset=\"https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2018\/04\/custom-email-design-coding.jpg 800w, https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2018\/04\/custom-email-design-coding-300x75.jpg 300w, https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2018\/04\/custom-email-design-coding-768x192.jpg 768w, https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2018\/04\/custom-email-design-coding-624x156.jpg 624w\" sizes=\"auto, (max-width: 800px) 100vw, 800px\" \/><\/a><\/div><\/div>\n<p>Make sure you keep minimum movement in the cinemagraph and maintain its finesse.<\/p>\n<p>An idea gives way to another idea. Here are some that can inspire you for more.<\/p>\n<ol>\n<li><em>Steam coming out of a mouthwatering dish: Food Industry<\/em><\/li>\n<li><em>Convey birthday wishes through a delicious cake with a candle flame in action: Retail\/Ecommerce Industry.<\/em><\/li>\n<li><em>A particular scene from a show for promotion: Telecommunications Industry<\/em><\/li>\n<li><em>Shimmering on an accessory: Fashion Industry<\/em><\/li>\n<\/ol>\n<p><!-- end HubSpot Call-to-Action Code --><\/p>\n<h2>2. Record the video<\/h2>\n<p>Once you have zeroed down on an idea, go ahead and record the video. So, how do you record a good video?<\/p>\n<ul>\n<li>The primary requirement for recording a good video is having <strong><em>sufficient light<\/em><\/strong>. If you shoot out in the open, you\u2019ll easily get good lighting.<\/li>\n<li>Keep the recording stable with the help of a tripod. While you are recording the video, your subject should have the least possible movement.<\/li>\n<li>You should record your video for 10 to 15 seconds to ensure that you can have a working space in the video with steady movements in the subject.<\/li>\n<\/ul>\n<div class=\"banner_wrapper\" style=\"\"><div class=\"banner  banner-17419 bottom vert custom-banners-theme-default_style\" style=\"\"><a class=\"custom_banners_big_link\"  target=\"_blank\"  href=\"https:\/\/email.uplers.com\/interactive-email-templates\/\"><img loading=\"lazy\" decoding=\"async\" width=\"800\" height=\"200\" src=\"https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2019\/07\/rich-media.jpg\" class=\"attachment-full size-full\" alt=\"\" srcset=\"https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2019\/07\/rich-media.jpg 800w, https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2019\/07\/rich-media-300x75.jpg 300w, https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2019\/07\/rich-media-768x192.jpg 768w, https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2019\/07\/rich-media-624x156.jpg 624w\" sizes=\"auto, (max-width: 800px) 100vw, 800px\" \/><\/a><\/div><\/div>\n<h2>3. Import and clip<\/h2>\n<p>Import the video to Photoshop by choosing \u201cVideo Frames to Layers\u201d in the \u201cImport\u201d option of \u201cFile\u201d menu. Make sure you import only the necessary part of the video.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-7187 size-large\" title=\"step 1 - make cinemagraph\" src=\"https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2017\/03\/01-1024x560.jpg\" alt=\"step 1 - make cinemagraph\" width=\"625\" height=\"342\" \/><\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-7188 size-large\" title=\"step 2 - make cinemagraph\" src=\"https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2017\/03\/02-1024x560.jpg\" alt=\"step 2 - make cinemagraph\" width=\"625\" height=\"342\" \/><\/p>\n<p>You will see a dialog box that lets you clip the video.<\/p>\n<p>This is an important step because it allows you to cut down the number of video frames to work on. It will give you an option to limit the video frames too, but it is advisable that you do not limit the frame rate if you want enough frames to work on.<\/p>\n<p>You should be able to see the Timeline when you choose \u201cTimeline\u201d in the \u201cWindow\u201d menu. However, make sure that you do not mix it up with the Video Timeline of Photoshop.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-7189 size-large\" title=\"step 3 - make cinemagraph\" src=\"https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2017\/03\/03-1024x560.jpg\" alt=\"step 3 - make cinemagraph\" width=\"625\" height=\"342\" \/><\/p>\n<p>After the video is imported, all the imported frames in your Timeline will be visible to you at the bottom of the Photoshop window.<\/p>\n<div class=\"banner_wrapper\" style=\"\"><div class=\"banner  banner-17420 bottom vert custom-banners-theme-default_style\" style=\"\"><a class=\"custom_banners_big_link\"  target=\"_blank\"  href=\"https:\/\/email.uplers.com\/portfolio\/\"><img loading=\"lazy\" decoding=\"async\" width=\"800\" height=\"200\" src=\"https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2018\/07\/sample-email-template-NL-LP.jpg\" class=\"attachment-full size-full\" alt=\"\" srcset=\"https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2018\/07\/sample-email-template-NL-LP.jpg 800w, https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2018\/07\/sample-email-template-NL-LP-300x75.jpg 300w, https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2018\/07\/sample-email-template-NL-LP-768x192.jpg 768w, https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2018\/07\/sample-email-template-NL-LP-624x156.jpg 624w\" sizes=\"auto, (max-width: 800px) 100vw, 800px\" \/><\/a><\/div><\/div>\n<p>Go to the Timeline and select the speed at which you want your video to play. Make the right choice according to the kind of cinemagraph you wish to create. It should neither be too slow nor too fast.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-7193 size-large\" title=\"step 4 - make cinemagraph\" src=\"https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2017\/03\/07-1024x560.jpg\" alt=\"step 4 - make cinemagraph\" width=\"625\" height=\"342\" \/><\/p>\n<p>To create an infinite loop, set the Timeline to repeat \u201cForever\u201d.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-7191 size-large\" title=\"step 5 - make cinemagraph\" src=\"https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2017\/03\/05-1024x560.jpg\" alt=\"step 5 - make cinemagraph\" width=\"625\" height=\"342\" \/><\/p>\n<p>The next step is to play the video in Photoshop and delete the frames other than the ones you wish to show.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-7192 size-large\" title=\"step 6 - make cinemagraph\" src=\"https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2017\/03\/06-1024x560.jpg\" alt=\"step 6 - make cinemagraph\" width=\"625\" height=\"342\" \/><\/p>\n<h2>4. Create a mask<\/h2>\n<p>Assuming that you have a video just the way you wanted it to be, let\u2019s proceed to creating a cinemagraph.<\/p>\n<p>You will need a layer to mask the layers on each frame and cover up all the areas except the one where you need movement.<\/p>\n<p>Choose the first frame in your Timeline, and in the Layers panel, duplicate the layer that you can see in the frame. Bring it up above all the remaining layers ensuring that it\u2019s visible. This is known as \u201clayer mask\u201d. You can rename it the way you want.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-7194 size-large\" title=\"step 7 - make cinemagraph\" src=\"https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2017\/03\/08-1024x560.jpg\" alt=\"step 7 - make cinemagraph\" width=\"625\" height=\"342\" \/><\/p>\n<p>At this point of time, your video will not show any movement as the \u201cmask\u201d has covered it. This implies that you have frozen your video. To create a cinemagraph, all you need to do is unfreeze the area.<\/p>\n<h2>5. Edit the mask<\/h2>\n<p>Go to the layer panel and select the mask layer. At the bottom of the panel, you will be able to see \u201cAdd Layer Mask\u201d icon.<\/p>\n<p>Just select the new white mask layer, and not the image layer.<\/p>\n<p>Start to paint the areas where you wish to see movement. Use Brush tool rather than the Eraser tool. Contrary to using Eraser, you can easily edit masks if you have masked a wrong area by mistake.<\/p>\n<div class=\"banner_wrapper\" style=\"\"><div class=\"banner  banner-17430 bottom vert custom-banners-theme-default_style\" style=\"\"><a class=\"custom_banners_big_link\"  target=\"_blank\"  href=\"https:\/\/email.uplers.com\/email-design-template-audit\/\"><img loading=\"lazy\" decoding=\"async\" width=\"800\" height=\"200\" src=\"https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2019\/09\/email-audit.jpg\" class=\"attachment-full size-full\" alt=\"\" srcset=\"https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2019\/09\/email-audit.jpg 800w, https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2019\/09\/email-audit-300x75.jpg 300w, https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2019\/09\/email-audit-768x192.jpg 768w, https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2019\/09\/email-audit-624x156.jpg 624w\" sizes=\"auto, (max-width: 800px) 100vw, 800px\" \/><\/a><\/div><\/div>\n<h2>6. Determine whether you want to reverse<\/h2>\n<p>After you are done with masking, you should decide whether you want to reverse the cinemagraph.<\/p>\n<p>If you decide to reverse the cinemagraph, you can select the frames in your Timeline and then reverse them after duplicating the frames.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-7195 size-large\" title=\"step 8 - make cinemagraph\" src=\"https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2017\/03\/09-1024x560.jpg\" alt=\"step 8 - make cinemagraph\" width=\"625\" height=\"342\" \/><a href=\"https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2017\/03\/09.jpg\" target=\"_blank\" rel=\"noopener noreferrer\"><br \/>\n<\/a><\/p>\n<h2>7. Export the cinemagraph<\/h2>\n<p>Go to \u201cFile\u201d menu and choose the \u201cSave for web\u201d option to export the final cinemagraph. There are several options in the dialog box out of which the most important one is to save your file in GIF format. Before saving, resize the image so that it performs well on your website or blog from the \u201cImage Size\u201d option. In case you are unable to resize the image to an optimum level, you can even do so with the help of online GIF resizing tools.<\/p>\n<p>You can preview the GIF in the dialog box and click \u201cSAVE\u201d only after you feel content with your creation.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-7221 size-full\" src=\"https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2017\/03\/Cinemagraph-2-1.gif\" alt=\"Cinemagraph in email\" width=\"625\" height=\"264\" \/><\/p>\n<blockquote>\n<p style=\"text-align: center;\"><span style=\"color: #ffcc00;\">BINGO! You can flaunt off your original cinemagraph now!<\/span><\/p>\n<\/blockquote>\n<h2>How to add the cinemagraph in email?<\/h2>\n<p>After you are ready with the cinemagraph, follow the steps given below to include it in your email.<\/p>\n<ol>\n<li>Upload the cinemagraph to the server that usually stores all your images.<\/li>\n<li>Copy the full URL of that file.<\/li>\n<li>Use the \u201cimg src\u201d HTML code to insert the source code of HTML as below.<br \/>\n&lt;img src=\u201c\/wp-content\/uploads\/yourfile.gif\u201d&gt;<\/li>\n<\/ol>\n<div class=\"banner_wrapper\" style=\"\"><div class=\"banner  banner-17416 bottom vert custom-banners-theme-default_style\" style=\"\"><a class=\"custom_banners_big_link\"  target=\"_blank\"  href=\"https:\/\/email.uplers.com\/psd-to-email-html-conversion-service\/\"><img loading=\"lazy\" decoding=\"async\" width=\"768\" height=\"192\" src=\"https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2020\/01\/html-email-coding-768x192-1.jpg\" class=\"attachment-full size-full\" alt=\"\" srcset=\"https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2020\/01\/html-email-coding-768x192-1.jpg 768w, https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2020\/01\/html-email-coding-768x192-1-300x75.jpg 300w, https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2020\/01\/html-email-coding-768x192-1-624x156.jpg 624w\" sizes=\"auto, (max-width: 768px) 100vw, 768px\" \/><\/a><\/div><\/div>\n<ol start=\"4\">\n<li>The last step is to make sure that your cinemagraph works well in the email by testing the <a href=\"https:\/\/email.uplers.com\/email-marketing-campaign-management-services\/\">email campaign<\/a>.<\/li>\n<li>Keep in mind that Outlook and Lotus <a href=\"https:\/\/email.uplers.com\/infographics\/email-client-hacks\/\">email clients<\/a> display the first frame of the animation as fallback. You can include a \u201cView in Browser\u201d link in the email so that those subscribers don\u2019t miss out on seeing your awesome cinemagraph.<\/li>\n<\/ol>\n<p style=\"text-align: center;\"><strong><em>Except Outlook and Lotus, all the email clients support cinemagraphs in email.<\/em><\/strong><\/p>\n<p><em>Are you looking to try out interactive emails and integrate cinemagraphs in them? Contact us.<\/em><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Cinemagraph is a unique tableau with meticulously added cinematic effects. It is truly a revolution among revolutions. Hope you have read about the popularity and potential of cinemagraphs in email in our previous post. Uplers take you a step ahead now with insights into how to create a cinemagraph. Let\u2019s start! Creating a Cinemagraph \u2013 [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":7215,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[382,381],"tags":[588,589,590,696,697],"class_list":["post-7165","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-email-coding","category-email-design","tag-cinemagraph-gif","tag-cinemagraphs","tag-cinemagraphs-in-emails","tag-how-to-make-cinemagraphs","tag-make-cinemagraphs"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v24.5 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>How to Make Cinemagraph and Add in Email?<\/title>\n<meta name=\"description\" content=\"What will you need to create an awesome cinemagraph GIF in email and how will you do it? Read the blog to know more on how to add cinemagraphs in emails.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/email.uplers.com\/blog\/make-cinemagraph-email\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"How to Make Cinemagraph and Add in Email?\" \/>\n<meta property=\"og:description\" content=\"What will you need to create an awesome cinemagraph GIF in email and how will you do it? Read the blog to know more on how to add cinemagraphs in emails.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/email.uplers.com\/blog\/make-cinemagraph-email\/\" \/>\n<meta property=\"og:site_name\" content=\"Email Uplers\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/email.uplers\/\" \/>\n<meta property=\"article:published_time\" content=\"2017-03-27T13:27:44+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2020-07-30T18:35:20+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2017\/03\/Cinemagraph-1170X428.gif\" \/>\n\t<meta property=\"og:image:width\" content=\"540\" \/>\n\t<meta property=\"og:image:height\" content=\"198\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/gif\" \/>\n<meta name=\"author\" content=\"Kevin George\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@email_uplers\" \/>\n<meta name=\"twitter:site\" content=\"@email_uplers\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Kevin George\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"5 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/email.uplers.com\/blog\/make-cinemagraph-email\/\",\"url\":\"https:\/\/email.uplers.com\/blog\/make-cinemagraph-email\/\",\"name\":\"How to Make Cinemagraph and Add in Email?\",\"isPartOf\":{\"@id\":\"https:\/\/email.uplers.com\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/email.uplers.com\/blog\/make-cinemagraph-email\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/email.uplers.com\/blog\/make-cinemagraph-email\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2017\/03\/Cinemagraph-1170X428.gif\",\"author\":{\"@id\":\"https:\/\/email.uplers.com\/blog\/#\/schema\/person\/7ffa431167e8be5eb07b050cd5c663fa\"},\"description\":\"What will you need to create an awesome cinemagraph GIF in email and how will you do it? Read the blog to know more on how to add cinemagraphs in emails.\",\"breadcrumb\":{\"@id\":\"https:\/\/email.uplers.com\/blog\/make-cinemagraph-email\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/email.uplers.com\/blog\/make-cinemagraph-email\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/email.uplers.com\/blog\/make-cinemagraph-email\/#primaryimage\",\"url\":\"https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2017\/03\/Cinemagraph-1170X428.gif\",\"contentUrl\":\"https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2017\/03\/Cinemagraph-1170X428.gif\",\"width\":\"1170\",\"height\":\"428\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/email.uplers.com\/blog\/make-cinemagraph-email\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/email.uplers.com\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"How to Create a Cinemagraph in Email?\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/email.uplers.com\/blog\/#website\",\"url\":\"https:\/\/email.uplers.com\/blog\/\",\"name\":\"Email Uplers\",\"description\":\"Email Marketing Blog\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/email.uplers.com\/blog\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/email.uplers.com\/blog\/#\/schema\/person\/7ffa431167e8be5eb07b050cd5c663fa\",\"name\":\"Kevin George\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/email.uplers.com\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2019\/03\/Img-96x96.png\",\"contentUrl\":\"https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2019\/03\/Img-96x96.png\",\"caption\":\"Kevin George\"},\"description\":\"Kevin is the Head of Marketing at Email Uplers, one of the fastest-growing full-service email marketing companies. He is an email enthusiast at heart and loves to pen down email marketing content. You can reach him at kevin.g@uplers.com or connect with him on LinkedIn.\",\"sameAs\":[\"https:\/\/www.linkedin.com\/in\/kevin-george-email\/\"]}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"How to Make Cinemagraph and Add in Email?","description":"What will you need to create an awesome cinemagraph GIF in email and how will you do it? Read the blog to know more on how to add cinemagraphs in emails.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/email.uplers.com\/blog\/make-cinemagraph-email\/","og_locale":"en_US","og_type":"article","og_title":"How to Make Cinemagraph and Add in Email?","og_description":"What will you need to create an awesome cinemagraph GIF in email and how will you do it? Read the blog to know more on how to add cinemagraphs in emails.","og_url":"https:\/\/email.uplers.com\/blog\/make-cinemagraph-email\/","og_site_name":"Email Uplers","article_publisher":"https:\/\/www.facebook.com\/email.uplers\/","article_published_time":"2017-03-27T13:27:44+00:00","article_modified_time":"2020-07-30T18:35:20+00:00","og_image":[{"url":"https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2017\/03\/Cinemagraph-1170X428.gif","width":540,"height":198,"type":"image\/gif"}],"author":"Kevin George","twitter_card":"summary_large_image","twitter_creator":"@email_uplers","twitter_site":"@email_uplers","twitter_misc":{"Written by":"Kevin George","Est. reading time":"5 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/email.uplers.com\/blog\/make-cinemagraph-email\/","url":"https:\/\/email.uplers.com\/blog\/make-cinemagraph-email\/","name":"How to Make Cinemagraph and Add in Email?","isPartOf":{"@id":"https:\/\/email.uplers.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/email.uplers.com\/blog\/make-cinemagraph-email\/#primaryimage"},"image":{"@id":"https:\/\/email.uplers.com\/blog\/make-cinemagraph-email\/#primaryimage"},"thumbnailUrl":"https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2017\/03\/Cinemagraph-1170X428.gif","author":{"@id":"https:\/\/email.uplers.com\/blog\/#\/schema\/person\/7ffa431167e8be5eb07b050cd5c663fa"},"description":"What will you need to create an awesome cinemagraph GIF in email and how will you do it? Read the blog to know more on how to add cinemagraphs in emails.","breadcrumb":{"@id":"https:\/\/email.uplers.com\/blog\/make-cinemagraph-email\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/email.uplers.com\/blog\/make-cinemagraph-email\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/email.uplers.com\/blog\/make-cinemagraph-email\/#primaryimage","url":"https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2017\/03\/Cinemagraph-1170X428.gif","contentUrl":"https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2017\/03\/Cinemagraph-1170X428.gif","width":"1170","height":"428"},{"@type":"BreadcrumbList","@id":"https:\/\/email.uplers.com\/blog\/make-cinemagraph-email\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/email.uplers.com\/blog\/"},{"@type":"ListItem","position":2,"name":"How to Create a Cinemagraph in Email?"}]},{"@type":"WebSite","@id":"https:\/\/email.uplers.com\/blog\/#website","url":"https:\/\/email.uplers.com\/blog\/","name":"Email Uplers","description":"Email Marketing Blog","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/email.uplers.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Person","@id":"https:\/\/email.uplers.com\/blog\/#\/schema\/person\/7ffa431167e8be5eb07b050cd5c663fa","name":"Kevin George","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/email.uplers.com\/blog\/#\/schema\/person\/image\/","url":"https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2019\/03\/Img-96x96.png","contentUrl":"https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2019\/03\/Img-96x96.png","caption":"Kevin George"},"description":"Kevin is the Head of Marketing at Email Uplers, one of the fastest-growing full-service email marketing companies. He is an email enthusiast at heart and loves to pen down email marketing content. You can reach him at kevin.g@uplers.com or connect with him on LinkedIn.","sameAs":["https:\/\/www.linkedin.com\/in\/kevin-george-email\/"]}]}},"amp_enabled":true,"_links":{"self":[{"href":"https:\/\/email.uplers.com\/blog\/wp-json\/wp\/v2\/posts\/7165","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/email.uplers.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/email.uplers.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/email.uplers.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/email.uplers.com\/blog\/wp-json\/wp\/v2\/comments?post=7165"}],"version-history":[{"count":54,"href":"https:\/\/email.uplers.com\/blog\/wp-json\/wp\/v2\/posts\/7165\/revisions"}],"predecessor-version":[{"id":21295,"href":"https:\/\/email.uplers.com\/blog\/wp-json\/wp\/v2\/posts\/7165\/revisions\/21295"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/email.uplers.com\/blog\/wp-json\/wp\/v2\/media\/7215"}],"wp:attachment":[{"href":"https:\/\/email.uplers.com\/blog\/wp-json\/wp\/v2\/media?parent=7165"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/email.uplers.com\/blog\/wp-json\/wp\/v2\/categories?post=7165"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/email.uplers.com\/blog\/wp-json\/wp\/v2\/tags?post=7165"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}