1.ヘッダーに動きのあるGIFを入れる方法
2.挿入する元画像を作る方法
3.Gif制作 無料オンラインアプリの紹介と方法
4.アメブロヘッダーにGifを挿入
5.注意点
1.ヘッダーに動きのあるGIFを入れる方法
只今、アメブロリメイク中です(;^ω^)
昨夜ヘッダーに動きのあるGIFを
入れてみたのでその方法をお伝えします
Photoshopなどのソフトで作ると
一枚一枚の切り替わりがもっとなめら
なのですが、今回は特別な技術もいらず
無料で出来る方法をお伝えします
使ったのはオンラインアプリ2つだけです
ではご覧ください。
2.挿入する元画像を作る方法
Canvaなどの画像加工アプリで
縦1120×横(300~400)の画像数枚を作ります。
これは画像加工アプリならどれでも大丈夫ですが、
私がCanvaを使う理由は、サイズ設定が楽だからです。
(Canvaの例)
ここに数字を入れてサイズを合わせます。
後は写真を選び文字を入れていき保存します。
この時にZipで保存されるので
開く時には展開または
入れたいフォルダがある場合は
参照をクリックして入れたいフォルダに保存してください
3.Gif制作
無料アプリの紹介と方法
私はこちらのオンラインアプリを使いました。
https://www.bannerkoubou.com/
右上の白い3本線をクリックすると
が表示されます。
あとは、サイトに書いてある順に従い、
画像の切り替わり時間を設定し
完成です。
出来上がりはパソコンの中にダウンロード♪
4.アメブロヘッダーにGIFを挿入
次はアメブロのヘッダーに作ったGifを挿入する方法です。
ここのピンクで示したところがカスタマイズの部分です。
★の部分に先ほどの「この画像のパス」を貼り付けます。
ヘッダーの高さは300~400の間で任意の数字を設定してください。
5.注意点
1.gif、jpg、pngのみ、5枚(各1MB以内)までアップロード可能
Gifのサイズが大きいとアップロードされません。
画像の切り替わりを可愛いのにしようと思い
動画ソフトでgifを作ってみたら
データが大きすぎてアップロードされませんでした(;^ω^)
2.エラー対策
挿入して保存したら
あれれ??崩れてる(;´Д`A ```
って事もあるかもしれないので、
新しいCSSを挿入する前にもとのCSSをコピーして、
Wordかメモ帳に貼り付けておきましょう!
そして保存を押す前に
その上にある「表示を確認」を押して
確認してみてくださいね
以上、後半駆け足でザックリでしたが、
アメブロヘッダーにGifを挿入する方法でした。
今日も読んで頂きありがとうございました
伴多洋美のアメブロ用
LINE公式アカウントのご案内
またはこちらからご登録できます
👇 👇 👇
https://lin.ee/8eYJpUd
LINEからID検索:@038ndwqp
ご提供メニュー
🔰スマホでかんたんオシャかわ動画編集
🔰ゼロ前からのLINE公式アカウント基本講座
動画編集
パソコン買換え相談
☕リアルお茶会