TIPS
-
WordPressのプラグイン「Preloader」でローディング画面を簡単に実装する方法
今回はWordPressでサクッとページのローディング画面を表示する方法を記載します。 プラグインをインストールする 「プラグイン」→「新規追加」から「Preloader」を検索します。 検索を行うと「Preloader」のプラグインが表示されますので「今すぐインストー…
-
【Illustrator10分レッスン】超初心者向き 実践型Illustratorの使い方講座その1 お花を描いてみる
初心者がIllustratorを勉強するにはどうしたらいいの? まったくの知識なしの状態からIllustratorを勉強したい、という人から、「何から練習したらいいの?」と聞かれることはとても多いです。 Illustratorは、Photoshopと違って直感的に操作しにくい…
-
Windows10でコントロールパネルの設定が保存されない時の原因は?
私は基本はGoogle IMEを使って、MS-IMEを使うことはないので入力方法から削除していたのですが、ある方にMS-IMEで登録している単語をGoogle IMEに移したいという質問を受けました。 調べてみたらエクスポートしてインポートするだけだったので、自分の環境でも…
-
ファイル(フォルダも可能)を比較して差分を表示するソフト「WinMerge」のインストールや便利な使い方をご紹介
ソフトウェアやシステムの修正を行う際に、稀に「先祖返り」(古いデータへの書き換え)が発生してしまう事があります。 こういったミスを回避する手段として、ファイルのバージョンを管理するシステム(Git等)を導入することが一般的とされています。 ですが、簡単に導入できるシステム…
-
IllustratorでWEBデザインのワイヤーフレームを切ってみた
「だいたいWEBデザインってPhotoshopでしょう?」 というのをこの間友人デザイナーに言われたので、 「いや、正直イラレの方が便利なんだ」 と答えたら 「相変わらずAI愛好者ね」 と言われました。 世の中「イラレよりフォトショの方がラク」…
-
JavaScriptとグーグルマップを組み合わせてコメントやリンクを設定したオリジナルマップを表示する方法
食べ歩きの感想やレビューを書いているブログで近所のお店が書かれていると、ついついお店を調べたりしちゃいますよね。 そんな時に、ブログの記事内にお店への地図と公式サイトへのリンクがまとまっていたら非常に便利なのになぁ とか思ったりしました。 ということで、今回は「JavaS…
-
キー入力の際にどこのキーボードを操作しているのか画面上で見える無料ソフト
動画でアドビ系のソフトのチュートリアルを作成しようとするとき、どうしてもショートカットキーを多用しがちです。 ですがそれだと「どこのキーボードで操作してるの……」となってしまうのではないか、と懸念がありました。 例えば、 プレゼンテーションや実地でのマニュア…
-
WEBデザインのフォントとテキストとグラフィックデザインのフォントとテキスト
みりみりきゅうは、というのを聞いたことのあるWEBデザイナーさんはどれくらいいるでしょうか……。 たまーに「どのくらいの文字の大きさなら読めるの?」と聞かれることがあるので、WEB上と紙媒体のフォントの違いをメモメモ。 WEBデザインにおけるフォントの基礎知識 主に…
-
3/14のAdobeソフトアップデート「XD」「Photoshop」「Illustrator」「InDesign」「DreamWeaver」のまとめ
アップデート入れている間にメモメモ。 PhotoshopがAdobeXDで開けるようになりました! イラレでWEBを作っていたタイプの人間としては「?」のような感じなのですが、アートボード機能が搭載されてからPhotoshopにおけるWEBデザインも進化してい…
-
MW WP FORMとzipaddr-jpを使って郵便番号を入力すると自動的に住所に変換されるメールフォームを実装する【2018年3月完全版】
毎回毎回迷うのでメモメモ。 MW WP FORMの基本的な設定の仕方 前に当社のT氏が記載してくれています基本的な設定の仕方と確認画面の作り方はこちら。 [blogcard url="https://incloop.com/%E5%88%9D%E3%82%81%E3%8…
-
「Visual Studio Code」をインストールしてPHPコードのデバッグ環境を設定する方法
今回は、弊社社長がPHPのコードをデバッグする際に「超便利!」と太鼓判を押す「Visual Studio Code」のインストール方法とデバッグ環境の設定方法について記載します。 「Visual Studio Code」とは? 30種類以上のプログラミング言語をサポートし…
-
Photoshopのレイヤースタイルで作る盛り盛りのテキストチュートリアル
最近スマホでムービーCMを見ることが多くなりました。 で、気づいたことがありまして、こういう飾ってある文字、見たことありませんか? どこが発祥かはわかりませんが、ぱちんこやスロット業界でよく見られたゴテゴテの飾り文字。なんかすごそうな雰囲気を出すときによく使われま…
-
CSSのコードをきれいに整形する便利ツールCSSCSSを導入してCSSをきれいにしてみる
世間様ではSCSSとかSassとかでCSSを書く方も多いのでしょうが、古代に生きているわたくしはいまだに古代よろしくCSSはぜーんぶ手打ちでございます。 何せ出身がプログラマではないのでプログラミングライクに記載していくSassのSASS記法とはもう致命的に相性が悪い。(と思い…
-
WordPressのバージョン4.9.3をお使いの方は4.9.4に「手動で」アップデートしましょう!
弊社はいくつかのサーバーを使用しているのですが、先日、とあるサーバー管理会社様からこんなメールが届きました。 「WordPressのバージョン4.9.3は自動更新が行われなくなる不具合を含んでおりますので、バージョン4.9.4への手動更新をお願いします。」 サーバー側からこう…
-
「この記事は約〇分で読めます。」をJavaScriptで実装する方法(ついでにWordPressのプラグインで実装する方法も記載します)
今回は他のサイト様でよく見かける「この記事は約〇分で読めます。」を実装する方法を記載します。 JavaScriptを使用して実装する まずはJavaScriptで実装する方法を記載します。 本プログラムで実装する際に、必要となる条件は下記となります。 ・記事を表示…
-
「aタグ(アンカータグ)だけでボタンを作りたい!」CSSの設定で高さと幅のあるボタンをaタグのみで作る方法
今回は意外と知らない人も居るaタグ(アンカータグ)だけで高さと幅のあるボタンの作り方をご紹介します。 そもそもaタグ(アンカータグ)だけでボタンは作れないのか? aタグだけでもボタンっぽいボタンを作ることは可能です。 ちょっとCSSを調整すれば下記のようなボタンを設置す…
-
「投稿画面が真っ白になっておかしい!」WordPressの投稿・編集画面が正常に表示されなくなったときの対処法
WordPressの本体の更新やプラグインの更新をした際に、稀に不具合が発生する場合があります。 今回はそのうちの一つ「記事の投稿・編集画面が正常に表示されなくなったとき」の対処方法を記載します。 「記事の投稿・編集画面が正常に表示されない」とはどんな状態か? 先日、W…
-
Adobe XDを使ってワイヤーフレームを作る その3【それぞれのツールの簡易的な説明とパネルの変化】
前回の記事はこちら [blogcard url="https://incloop.com/adobexd01/"] [blogcard url="https://incloop.com/adobexd02/"] この間自宅のMacでAdobeXDを操作したら普通にメニュ…
-
Webサイト制作に役立つGoogle Chromeの拡張機能「ColorPick」と「Page load time」の導入方法や操作方法
今回はWebサイト制作の際に個人的に重宝しているGoogle Chromeの拡張機能「ColorPick」と「Page load time」の導入方法と操作方法をご紹介致します。 「ColorPick」について 「ColorPick」はWebページの画面上のカラーコードを…
-
WordPressのプラグイン「Geo Mashup」で表示するGoogleMapのピン(旗)のアイコンを好きな画像に変更する方法
今回はWordPressのプラグイン「Geo Mashup」で表示するGoogleMapのピン(旗)のアイコンを好きな画像に変更する方法を記載します。 ※本記事は「Geo Mashup」のピンのカスタマイズに絞って記載しておりますので、プラグインの導入方法や使い方などは下記…