You are using a strange sort of a workflow IMO.
- If it was me I wouldn't resize anything, but I'd open the larger GIF and save with a new file name.
- I'd then open the smaller GIF > place all the layers into a group > and duplicate that group into the larger GIF.
- Select all the layers from the original GIF and place in a group.
Note: Read this step carefully
- Select All of the frames in the timeline, and Free Transform the group containing those layers to match the smaller GIF
- You'll now need to go through frame by frame and turn on the relevant layer from the imported Group (smaller GIF)
Combining frame animations can be a tricky process IME. Especially if they have a different number of frames. The most complex GIF I ever made had four separate areas of movement, and it took a lot of concentration to make it work nicely.
Photoshop want to retain an image files original pixels. Photoshop will not attempt the scale two files with different sizes and resolutions to a common scale size and resolution. You need to do that. I also would not use copy and past. I would start by first opening both animated Gifs into Photoshop. I would resize one so its resolution was the same as the other one without resampling. Once they have the same resolution. If the scale size of one was larger then the other I would the resample the larger to scale it for the size of the smaller one. So object are scaled to appear correctly relative to their real world physical size, I would then select all layers in both document create a group from layer in both documents. It would be best if both file had the same number of layers. Once you have the two group. You can drag a group from one of the layer pallets and drop it on the other document while holding the shift constrain key down. Make the canvas size what you want and position the two groups to where you want things to be positioned a frame. Next you need to open the frame animation timeline and reconcile what layers should be visible in each frame. A layer from each group should be visible is a frame. If you want the animations to play concurrently.
Thank you for your answer.
I should have mentioned the reason that I am resizing the images is because I'm designing this gif for Twitter. Which in my experience looks better at 560px. I capture images off of YouTube which are about 1200+ px. This size is way too large to be uploaded on social media especially with Twitter's restrictions of 5MB for a gif.
Thank you for replying. The reason I am resizing the images/gif is because it is for Twitter. Which only allows a certain size of gif to be uploaded. I capture images that are a little over 1200px off YouTube. Which need to be resized to lower the file size. My preference is 560px as a whole, which makes the 2 smaller gifs 280px to fit on one canvas.
Below is an example of what I am trying to achieve.
This is a gif I created last week and I cant remember if I downsampled or not but I definitely resized the images to my liking. Both gifs were the same size 280px with the same amount of frames to which I pasted onto a transparent canvas of 560px. I do not remember running into issues but I am now however unable to go through the same process.
Something like this seems simple enough so I may be taking the wrong approach.
EDIT** I think I've solved my own issue. I was not aware that editing the "Canvas Size" does not actually delete the pixels. So when I go to paste my resized gif, it just places the entire image. I think I will have better luck actually cropping the gif to my liking and not editing canvas size. I will give that a go. I am a beginner so you live and you learn.
Glad you got it figured out. Obviously final image size is important, so my point was to work at the best size possible right up to just before exporting the frame animation, and downsizing the entire thing at that stage, but always keeping a full size 'master document'. It makes for easier and nicer edits that way.