オープニングの画像(ロゴ)がフワーッと浮き上がる3D効果の動画を、

AviUtlで作ってみました。参考まで

今までHCZ TVのオープニングに登場していたロゴは、影が付いていただけのものでしたが、

動きを加えることで、奥行き感のある3D効果が可能になりました。

たまたま編集していたら、こうなってしまった。

備忘録　こんな感じに作りました。

※動画サイズは1280×720（HD）。

使用画像（ロゴ）サイズ　827×127　拡張子 PNG　透過

AviUtl　編集設定

背景(Layer1)には影を強調させる、白っぽい画像を使うのがポイント。

①の設定

②の設定

③の設定

以上

動画中ワンポイントとしてヨサゲなエフェクト見つけたので紹介します。

使うソフトはフリーのAviUtl。ってか、私はコレしか持ってないんだけど・・・

タイトルにもありますが、まさにそのまんま。

画像が起き上がって表示するアニメーション効果です。

私が使った画像は2つ。壁紙（サイズ：1280×720/jpg）とロゴ（300×300:png）

映像サイズは1280×720で、youtubeだと画質720Pで赤くHDど表示されるサイズ。

エフェクト法は簡単に画像で説明して行きます。

AviUtlを立ち上げる。

拡張編集上で右クリックし、新規プロジェクト

メディアオブジェクトの追加→画像ファイルを選ぶ

選ぶ画像は先ほどお話した2つ。

壁紙-002.jpg の設定は特にありませんが、好みでフェード使うとよさそう。

次にロゴ（300×300）pngで、ここでは仮にファイル名HCZとしてあります。

設定は

１.「＋」をクリックして「アニメーション効果」を選ぶ。

２.「起き上がって登場」を選ぶ　時間は3.0/勢いは4.0　に調整

以上です。

出来上がった動画をご覧下さい。

すみません。

コマーシャルが出現して見辛いですね。

見るコツは広告が出たら直ぐに動画を一時停止し、

その広告のバッテンをクリックしてから、再度再生すると見れます。

動画のエンディング4分50秒からです。

しまい

タテ長になってしまったブログ（ワードプレス）のトップページを、見やすく最新記事

だけを大きく表示させ、その他の記事はサムネイル（アイキャッチ画像）付きの見出し

だけにカスタマイズしました。

いじったのは自作のテーマだけど、汎用のPHPであればコピペで大体が

通用すると思う。

カスタマイズしたファイルは「home.php」。

変更前のｐｈｐコード

<?php if(have_posts()): while(have_posts()): the_post(); ?>
	<?php get_template_part('content'); ?>
<?php endwhile; endif; ?>

変更後phpコード

<?php if(have_posts()): while(have_posts()): the_post(); $counter++; ?>
	<?php if ($counter <= 1): ?>
	<?php get_template_part('content'); ?>
<?php else:?>

<?php get_template_part('content','excerpt'); ?>
<?php endif;?>

<?php endwhile; endif; ?>

変更後php、二行目に追加したコードは最新記事を判別する。

<?php if ($counter <= 1): ?>

６行目は最新記事以降の記事を表示させる。

<?php get_template_part('content','excerpt'); ?>

しまい

ワードプレス（WordPress）の最適化・高速化には、画像圧縮プラグイン

「EWWW Image Optimizer」が必須。

コンテンツが多くなると、表示スピードにストレスを感じ、改善を試みると、

たどり着くプラグインではないでしょうか。

現状バージョンは

EWWW Image Optimizer 2.5.0

一昨年ユーチューブのアイコン（プロフィール写真）を作り、

先月チャンネル名を変更しました。それから少し日数経ってしまいましたが、

その名の通り、新しいプロフィール写真に差し替えました。

そして、序にyoutube動画中の右上にある、「ブランディング」も同じものに変更。

ここの機能はクリックするとでチャンネル登録に誘導できるボタン。

ブランディングの設定は忘れない様に備忘録する。

※ 画像サイズは300×300 拡張子PNG

■ブランディングの設定

クリエイターツール＞ブランディング

説明省略　画像で理解せよ。

しまい

フェイスブックいけてませんです。

最近自サイトのリンクを記載すると画像が表示されません。

今日もそうでした。

通常ならリンク先ページ内の画像を取得し表示できるのに・・・

何とかならないかとググッて見ると、どうやら過去にフェイスブックでページをキャッ

シュしてる場合そうなるらしく、じゃどうしたらいいのかってのは、フェイスブック

ツールで、デバッカー：https://developers.facebook.com/tools/debug

キャッシュをクリアすれば問題ないらしいと、いろんなところで書かれてる。

で、やってみた。やっぱ駄目じゃん・・・（怒

無料だからって文句は言いたかないけど、いけてませんね。

スマホを買い替えして間もない私ですが、自分の作ったホームページを見てみたんで

す。そしたらトップページの下の部分にみょーにバックグランドが表示されてる。

でしょ。

パソコンでも、以前のスマホでもこんなことはなかったのですが、多分スマホ画面が

大きめの5インチになったことで、普段見えないところが出てきちゃんでしょうね。

そこで少し改良をしました。真ん中辺りのバックグラウンド（ゼファーの画像）↓を、

メインに使っているＢＧに差し替えました。この画像は４年半前に作ったもので、

お気に入りでしたが、今後どこかのページに使おうと思います。

あと私の新しいスマホには元々Flash Playerがインストールされていないので、

トップページの俺のＫが表示されません。近々インストールしなきゃ。

ワードプレスの小技ネタです。

記事内に画像を入れて公開したら「画像と文章の上下マージンが狭くない？」

って経験ないですか。じゃ改行を入れ隙間を作る対処を・・・

いちいちそんな事をしなくても、スタイルシートに画像のマージンを指定すれば

対処出来ます。

いじるファイルはテーマフォルダ内のstyle.css と、content.php　の2つ。

まず　content.php　の「　<?php the_content(); ?>　」を

ボックス「<div class=”content”>」で囲む。

<div class="content">
<?php the_content(); ?>
</div>

次にstyle.cssにこう記述。

div.content img {
margin-top:36px;
margin-bottom:36px;
border: solid 4px #ffffff;
-moz-box-shadow: 0px 0px 16px #777777;
-webkit-box-shadow: 0px 0px 16px #777777;
box-shadow: 0px 0px 16px #777777;
/*IE 7 AND 8 DO NOT SUPPORT BLUR PROPERTY OF SHADOWS*/
}

※　margin-top/margin-bottom は、自分の好みで増減してください。

また４行目以下は画像に枠を付け影を装飾しました。必要なければ削除してください。

先々月、知人のリクエストでカーボン柄のメーターパネルを制作し、

あぁ！　ＦＢのＨ25年4月17日のやつです。

文字サイズとか色々微調整したものを

見事取り付けできたらしく、その画像を頂きました。

ステキ！に取付できた見たいですが、当人LED効果で「明り過ぎて見辛くね？」

ってことで、「15ＷのCRDを割り込ませ減光したらい～感じなった」と

喜んでました。

確かに数字が見やすくなってるぅ。

その内「俺のＫ」にも投稿してくれるんでしょう。

ねっ　やん○ぃさん

しまい

XREA・CORESERVER.JP編

ＷＰをインストールし、早速新規投稿してみたら・・・

あれあれ？画像がアップロードできない。

そんな方、多いのではないでしょうか？

「親ディレクトリのアクセス権はサーバーによる書き込みを許可していますか? 」

「XREA」や「CORESERVER.JP」は

サーバーがセーフモードなので、その対処をしてあげないと

投稿はできても画像をアップロードして挿入することは出来ません。

対処として属性（パーミッション）？と思われがちですが

そんないじっても駄目です。

こ難しい話は抜きとして

.htaccess ファイルをサーバー内の wp-admin内に設置するだけです。

.htaccess ファイルの作り方は

テキストエディター（メモ帳など）で

こう記述し　↓

<files async-upload.php>
AddHandler application/x-httpd-phpcgi .php
</files>
<Files update.php>
AddHandler application/x-httpd-phpcgi .php
</Files>
<Files update-core.php>
AddHandler application/x-httpd-phpcgi .php
</Files>

文字コードを「UTF-8」で保存。

保存する時、ファイル名は何でも構いませんが

後で、ファイル名を「.htaccess」に変更しＦＴＰ等でアップロードてください。

アップロード先ディレクトリは

/public_html/チョメチョメ/チョメチョメ/wp-admin　　みたいなところです。

ん・・・

そんなんもめんどい方は

私の作ったファイルをダウンロードして使ってください。

ダウンロードファイル（.htaccess.zip）

まぁ、間違わないと思いますが、ＤＬファイルは圧縮してあります。

解凍してから使用してくだせぇ。