Vill du lära dig hur du skapar och add to Cinemagraphs i dina posts i WordPress? Cinemagraphs är images där en del eller ett area rör sig medan resten av imagen står stilla. Dessa images är mycket engagerande och adderar ett berättande element till dina artiklar. I den här artikeln visar vi dig hur du enkelt skapar och add to cinemagraphs i WordPress.
Vad är cinemagraphs?
Cinemagraphs är vanligtvis GIF-bilder där en liten del av bilden rör sig medan resten av den förblir stilla. De ser väldigt filmiska ut, därav namnet cinemagraphs.
De add to ett berättande element till images vilket gör att de ser mer engagerande ut. De är viss användbara när de ackompanjerar longform content, podcast-avsnitt eller en ljud story.
Att skapa cinemagraphs är lite annorlunda än vanliga GIF-filer. Men om du har rätt tools kommer du med lite ansträngning och lite övning att kunna skapa fantastiska cinemagraphs från dina egna videoklipp.
Med detta sagt, låt oss ta en titt på hur du enkelt kan skapa och add to cinemagraphs i WordPress.
Skapa filmsekvenser från videoklipp
För att komma igång behöver du följande objekt:
- Ett litet videoklipp som du vill konvertera till en cinemagraph
- Adobe Photoshop
- Your time, patience, and creativity
Låt oss komma igång.
Först måste du göra klart ditt videoklipp. Du kan använda ett videoredigeringsverktyg som iMovie för att trimma videoklippet till bara det minimalistiska klipp som du behöver för filmgrafen.
Därefter måste du öppna Photoshop och importera ditt videoklipp till lager genom att clicka på menyn File ” Import ” Video Frames to Layers.
Välj ditt videoklipp och klicka sedan på knappen OK för att fortsätta. Beroende på hur stort ditt videoklipp är kan det ta en liten stund innan det är helt importerat.
När ditt videoklipp har importerats kommer du att se videoramar som lager under panelen Lager.
Nu måste du selecta alla lager utom det allra första lagret (Lager 1).
Gå till menyn Lager ” New ” Gruppera från lager eller tryck på Command + G (CTRL+G i Windows) för att lägga till lager i en grupp.
Därefter måste du välja gruppen och gå till Layer ” Layer Mask ” Reveal All för att add to en mask till gruppen.
När du har lagt till masken trycker du på Command + I (Ctrl + I på Windows) för att invertera maskens färg.
Ställ nu in förgrundsfärgen på vit och klicka sedan på penselverktyget. Du måste använda penselverktyget för att markera det area du vill visa i slingan.
Därefter går du till Fönster ” Timeline för att öppna alla dina lager i ett animationsformat.
You will notice all frames appear transparent in the timeline except for the first frame.
För att ändra detta väljer du det första lagret (Lager 1) i panelen Lager och klickar på ikonen Unfiy Layer Visibility och trycker sedan på knappen Matcha.
Klicka sedan på ikonen toggle i Timeline och välj all frames. Därefter klickar du på knappen Toggle igen för att välja Copy Frames.
När du har kopierat ramarna klickar du på knappen toggle och väljer alternativet ”Paste Frames”.
Du kommer att bli ombedd att välja en klistrametod. Select ”Paste After Selection” och tryck på OK-knappen.
Därefter måste du klicka på Timeline toggle icon en gång till och välja alternativet ”Reverse Frames”.
Your cinemagraph animation är nästan klar.
För att spara den på din dator, gå till File ” Save for Web alternativ. Detta kommer att visa en popup där du måste välja GIF-format och klicka på knappen save.
That’s all your Cinematograph är klar.
Du kan lägga till den på din site som du gillar att lägga till andra GIF:ar i WordPress. Du behöver bara editera det post eller den page där du vill add to cinemagrafen och clicka på knappen add media.
Detta kommer att visa popupen för media uppladdaren, klicka på knappen select files för att uploada GIF-filen från din dator.
När den är uppladdad klickar du på knappen ”Insert into post” för att fortsätta.
Du kommer nu att se imagen i din WordPress post editor.
Glöm inte att save eller updating posten. Du kan nu klicka på knappen Preview för att se filmsekvensen i action. Här är den cinemagraph som vi skapade under denna tutorial.
Vi hoppas att den här artikeln hjälpte dig att lära dig hur du skapar och add to cinemagraphs i WordPress. Du kanske också vill se vår lista över webbplatser som erbjuder gratis royaltyfria images för WordPress användare.
Om du gillade den här artikeln, vänligen prenumerera på vår YouTube-kanal för WordPress video tutorials. Du kan också hitta oss på Twitter och Facebook.
Syed Balkhi
Hey WPBeginner readers,
Did you know you can win exciting prizes by commenting on WPBeginner?
Every month, our top blog commenters will win HUGE rewards, including premium WordPress plugin licenses and cash prizes.
You can get more details about the contest from here.
Start sharing your thoughts below to stand a chance to win!
Gary Stenzel
I have been making cinemagraphs with a free editor from Microsoft called ”Cliplets”. It works really good and is easy to use.
It’s a whole lot less complicated than using Photoshop.
You should give it a try.