皆さまごきげんよう。
サイトのどこかに小さな動きがあると一瞬目を惹きますよね。
本日はcssで文字を点滅させてみようと思います。
1.CSS animationを使って文字を点滅させる
まず、このサイトのヘッダー部分のタイトルをご覧ください。実際に実装してみましたよ。cssはこんな感じです。
“cssアニメーションで文字を点滅させてみよう” の続きを読む
cssアニメーションで文字を点滅させてみよう
ワードプレスをカスタマイズする方法
皆さま、ごきげんよう。
ワードプレスのカスタマイズといえば色々な方法があると思いますが、本日は私のカスタマイズの仕方について語ってみたいと思います。
twenty seventeenをベースにしたこのブログをカスタマイズした時の注意点や、調べ方についての備忘録です。
ベースとなるテーマを決める
illustratorとphotoshopで写真を背景イラスト風に加工してみよう
皆さまごきげんよう♪
今日は写真を背景イラスト風に加工してみよう、第2弾です。
前回の記事はこちら → photoshopで写真を背景イラスト風に加工してみるの巻
1.イラストレーターでイラスト風加工
pixivの3Dキャラ作成ツール「VRoid Studio」を試す、の巻
皆さまご機嫌よう。
VRに興味津々な今日この頃、最近ではヴァーチャルオフィスなるものも登場し、これからはアバターも3Dだ！さてどうしよう？と思っていたところ、タイムリーに公開されたpixivによる無料の3Dキャラ作成ツール、「VRoid Studio」。早速使ってみましたよ♪
まずはこちらからVRoidをダウンロードします。
VRoid Studio
VRoid Studioを開きます。
編集画面は 顔、髪型、体型、衣装、撮影のタブに分かれており、左側のツールパネル、中央のカメラパネル、右側のプロパティパネルの3分割画面で構成されています。
“pixivの3Dキャラ作成ツール「VRoid Studio」を試す、の巻” の続きを読む
position: sticky; がスクロールで要素を固定するのに便利すぎた件
皆さまごきげんよう!
今日はCSSのposition: sticky; がとても便利だったので備忘録としてご紹介します(^^)
ちょっと前に当ブログでご紹介したプラグインQ2W3 Fixed Widgetですが、ワードプレスの更新をして以降、ページにエラー表示が出る様になってしまいまして(´ω｀。)
プラグインは便利ですが、何かの更新の度に必ずしも互換性が保たれる保証はありませんし、プラグインを頼らずに何か出来ないかと調べたところ…とても簡単にほぼ同じことが出来てしまうcssがあったんです！
それがposition: sticky;です！
“position: sticky; がスクロールで要素を固定するのに便利すぎた件” の続きを読む
画像を守るワードプレスプラグイン No Right Click Images Plugin、Easy WaterMark、Image Watermark
明けましておめでとうございます。
今年はもっと更新頻度を上げていくことを目標に（と毎年言っている感(；＿△＿)=3 ﾄﾞﾃｯ) どうぞよろしくお願いいたします。
さて、本日は今年最初にインストールしたプラグインをご紹介したいと思います。
もしサイトにUPした絵や写真などを知らず知らずに盗用されていた、なんてことになっていたら気分悪いですよね。
最近は画像の上で右クリックしたり、ドラッグアンドドロップが出来ないサイトも増えてきたように思います。
せっかく苦労して作った画像や写真を盗用されないためにも、自分で出来る最低限の防衛対策はとっておきたいもの。それがプラグインをインストールするだけで簡単に出来ますのでぜひ取り入れてみて下さい♪
“画像を守るワードプレスプラグイン No Right Click Images Plugin、Easy WaterMark、Image Watermark” の続きを読む
ロリポップでワードプレスをhttps化しよう
皆さまこんにちは♪
本日はロリポップサーバーで独自SSLの設定をしてみます！
今や個人のブログであっても、SSL化していないサイトでは接続するのが心配…と思われてしまいますよね。。
今まではサイトをSSL化するには追加料金を払わなければならなかったのが、今年の7月に無料の独自SSL「Let’s Encrypt」を、基本のご利用料金のみで全プランで常時SSL化が可能、とのこと！
ということで、遅ればせながら早速ロリポップでワードプレスのサイトを無料でSSL化してみます。
（ちなみに私のワードプレスはマルチサイトになっておりますので、その手順で書いております。）
“ロリポップでワードプレスをhttps化しよう” の続きを読む
photoshopで写真を背景イラスト風に加工してみるの巻
皆さまごきげんよう♪
最近家電屋さんにて、かねてから気になっていたwacomの液タブを実際に触ってみまして…あまりの好感触に、思い切って買ってしまおうか？！と頭を悩ませている今日この頃でございます(^^;
さて、背景画を一から描くのってかなり大変ですよね。。
そこで今日はphotoshopを使って写真をサクッとイラスト風に加工してみたいと思います！
最近入れてみたワードプレスプラグイン、Q2W3 Fixed Widget、Yet Another Related Posts Plugin
皆さま、新年明けましておめでとうございます！今年はもう少し更新頻度を上げていくことを目標に、ユルく頑張ります(笑)
どうぞよろしくお願いいたします m(__)m
さて、ワードプレスの今年のテーマ、twenty seventeenが出ましたね〜！
当サイトはこれまでtwenty fourteenの子テーマでずっとやってきたのですが、2017を試してみると…これがシンプルかつトレンドも押さえてあったりと、なかなか使い勝手が良さそうなので、暫くこちらのテーマに変えて色々カスタマイズしてみようと思っています。
ということで本日はテーマの変更に伴い、最近入れてみたプラグイン2種類をレビューいたします。
“最近入れてみたワードプレスプラグイン、Q2W3 Fixed Widget、Yet Another Related Posts Plugin” の続きを読む
フォトショップでシネマグラフを作ってみよう、の巻
皆さまごきげんよう(^^)ゞ
今年は秋に入ってからも毎週のように来る台風、晴れない、暑い、など過ごしにくい日が多かったですが、ようやく気温も下がり一気に秋らしくなってまいりました。皆さまいかがお過ごしでしょうか？
さて、本日は”動く静止画”こと、シネマグラフをフォトショップでサクッと作ってみたいと思います♪
1.シネマグラフとは？
簡単に言うと、動画の上に一部を透明にした静止画を被せて、透明の部分から下の動画の一部が見えるようになっているGIFアニメ画像です。時が止まった中、一部だけが動き続けているという不思議な感じが出せるんです。それでは早速作ってみましょう。
“フォトショップでシネマグラフを作ってみよう、の巻” の続きを読む
イラストレーターでシームレスなパターンを作ろう
皆さまごきげんよう。
厳しい残暑が続いておりますがですがいかがお過ごしでしょうか？まだまだ日中は暑いとはいえ日の入りが早くなってきて、季節は着々と秋に向かっているのだなぁ..と嬉しいような寂しいような今日この頃です。
さて、本日はイラストレーターでシームレスなパターンを作ってみようと思います♪
“イラストレーターでシームレスなパターンを作ろう” の続きを読む
スマホでもパララックスを実装してみよう、の巻
皆さまごきげんよう！梅雨も明けいよいよ夏本番、いかがお過ごしでしょうか？
皆さまも、部屋でお仕事や勉強をしている時にBGMをかけたりすると思うのですが、集中力を高めるのにホワイトノイズがいいらしい、ということで私、久々に使ってみて良かったのがこちら、noisliです。説明するまでもないですが、アイコンをクリックして表示されるバーを動かして音量調節します。直感的に操作できるシンプルさと、自分で好きなように音をミックスできるところがいいんです。聞いているだけで心落ち着きますし、ほんとお勧めです。ぜひお試しあれ♪
さて、本日はスマートフォンでのパララックス(視差)的な動きを、cssを使って演出してみようと思います。
“スマホでもパララックスを実装してみよう、の巻” の続きを読む