Tips

「Webサイト制作AI活用入門科」が開講のお知らせ

平成31年2月20日より開講する「Webサイト制作AI活用入門科」を担当します。 今回の講座の目玉はAI入門のカリキュラムを実施することです。データーサイエンスの基礎からディープラーニングを学習してAIの基礎力を付け、さ  >>続きを読む

CSSグリッドを可変レイアウトにする方法

CSSグリッドでレイアウトしたのはいいが、固定サイズはできたけれどもリキッドレイアウトにならないと頭を抱え込んでいませんか。 CSSグリッドは慣れると紙のデザインをやっていた人には馴染みやすいかもしれませんが、あまり細か  >>続きを読む

Gutenbergで気になるポイント3〜WordPress

WP Multibyte Patchプラグインの導入 WordPress5.01になってGutenbergが採用されましたが、それと同時にプラグインのWP Multibyte Patchがデフォルトでインストールされなく  >>続きを読む

Gutenbergで気になるポイント2〜WordPress

グーテンベルグに変わってどのように活用しているでしょうか。色々問題点を挙げてグダグダ言うよりも、積極的に使って使いこなす方が良いと思っています。 「下書きへの切り替え」機能 記事を一旦公開した後に、何らか記事を更新した時  >>続きを読む

Gutenbergで気になるポイント1〜WordPress

CSS Gridの導入 「ブロックをインタラクションのパラダイム (枠組み) として受け入れる」と本家がいうようにブロックでレイアウトしていくことができます。その辺の仕組みは多くのライターの人が書くでしょうからそちらを見  >>続きを読む

click()の使い方〜JavaScript

jQueryでクリックイベントを設置するには、on()を使ったりclick()を使ったりします。 今回はclick()の使い方の説明です。 通常、click()は次のような記述をします。jQuery基礎で学ぶおなじみの書  >>続きを読む

chart.jsで描いた円グラフにラベルと値を表示する方法

chart.jsを使うと簡単にグラフが描けます。 chart.js公式ページ ところで、どういうわけかグラフ上にラベルの表示ができないようになっています。 デフォルトの円グラフ ラベルと値を追加した円グラフ ラベルと値を  >>続きを読む

Twitterのタイムラインをホームページに埋め込む方法〜2018年更新版

2018年夏に埋め込みタイムラインをtwitter.comのアカウント設定で管理することはできなくなりました。 代わりに、publish.twitter.comで埋め込みコンテンツを設定するようになっています。 publ  >>続きを読む

CSSのbackground-clipでテキストをグラデーションに

CSSのbackground-clipでテキストをグラデーション加工することができます。 本来は「background-clip」プロパティは、要素の背景がcolor又はimageの時、境界の下まで拡張するかどうかを指定  >>続きを読む

CSS グリッドレイアウトでコーディングするならFirefoxを使おう〜display:grid

display:gridでレイアウトするのが標準になる日も近いと思います。 さて、開発する際の検証はChromeを使う場合が多いと思いますが、グリッドレイアウトに限ってはFirefoxが強力です。 一度試してみると良いで  >>続きを読む

簡単にローカルなSASS環境構築

SASSを毎日使用するような人は自分にあった環境を作り込んでいると思います。けれども時々使いたい場合、Gulpで環境作るのは面倒だし、エディタに設定していたはずのものがなぜかうまく動かないなどと困った場合に、手軽にローカ  >>続きを読む

WatsonのAssistant機能をDogRoboにつけました

IBM WatsonのAssistant機能をDogRoboにつけました。 まだテスト運用で色々なことはできませんが、試してみてください。

ヒアドキュメント と Nowdoc

PHPでヒアドキュメントは頻繁に見かけますが、Nowdocはあまり見ないですね。 使う機会も少ないかもしれませんが、知っておいて損はないでしょう。 ヒアドキュメントがダブルクォーテーションと同じ扱いで変数を展開するなら、  >>続きを読む

以上・以下・未満・超える

「以上」、「以下」、「未満」、「超える」の使い分けを明確にしておきましょう。以下の用語は法律用語として使われているようですから、これを使えば問題はなさそうです。 以上 「以上」は対象の値を含めた数より大きい数 PHPの例  >>続きを読む

デザインカンプからコーディングで重宝するツール

デザインカンプと1pxも違わないコーディングを行うには細かな確認が必要になります。 そんな時に役立つツールの紹介です。ただし、MAC専用です。 LayerX psd形式を含めた画像ファイルを透明化してコーディングしたペー  >>続きを読む

MAMP設定〜2018年版 Claud機能が追加されたが設定はどこで?

2018年にMAMPのCloud機能が追加されました。共同作業をMAMPで行う場合は便利かと思いますが、PHPやWordPressの学習のためには必要無いものです。 MAMP(旧バージョン)の新規インストールの方法はこち  >>続きを読む

Twitterユーザータイムラインを自分のホームページに表示

ここで紹介した方法は現在中止されています。 Twitterのタイムラインをホームページに埋め込む方法〜2018年更新版を参考にしてください。 Twitterのユーザータイムラインを自分のホームページに表示する方法は他のS  >>続きを読む

Instagramの「accessToken」と「userid」を取得する方法〜2018年4月版

InstagramのAPI使用方法 Instagramの投稿内容を自分のホームページで表示するには、面倒な手続きが必要です。 それは「accessToken」と「userid」を取得することから始めます。 なお、2018  >>続きを読む

inline要素のpaddingを使う場合の注意点

display:inlineに設定された要素にpaddingをつけた場合の注意点です。padding-leftの指定を行っても、行の終端でインライン要素が折り返された場合には、次の行の先頭にはpadding-leftが付  >>続きを読む

Illustratorで作成したオブジェクトをPhotoshopで使う

Illustratorで作成したオブジェクトをPhotoshopで使うにはIllustratorで作成したオブジェクトをコピーしてPhotoshopの画像にペーストするだけです。 ペーストする際に次のようなboxが表示さ  >>続きを読む

Illustrator環境設定〜角度の制限

Illustratorの環境設定から「一般」の中に「角度の制限」は通常「0」になっています。 この値を変更するとテキストを挿入したりオブジェクトを作成した場合に指定した角度になります。 角度の制限を30度にした例 よっぽ  >>続きを読む

OSXを10.13(macOS High Sierra)にアップデートしてSASSのコンパイルがうまくいかない時の対処法

MAC OS High SierraにアップデートしたらDreamweaverのSASSのコンパイルに失敗するようになりました。 対処方法として下記リンクの通りで動きました。どうやらXCodeコマンドラインツールのアップ  >>続きを読む

AngularJSのDirectiveについて(2)

AngularJSのよく使うdirectiveの紹介です。 今回は「ng-if」、「ng-class」、「ng-repeat」、「ng-click」、「ng-cloak」を紹介していますが、他にも便利なdirective  >>続きを読む

AngularJSのDirectiveについて(1)

AngularJSのDirectiveは、HTMLでどのようにDOMを組み立てるか命令するものです。Directiveは例えば「ng-app」のようにHTMLのカスタム属性を使って記述していきます。 ここでは、「ng-m  >>続きを読む

AngularJSのインターポレーションについて

インターポレーション(interpolation)とは、書き入れ、書き入れられた語句、補間法などの意味があります。 プログラムにおけるインターポレーションとは文字列補完を行うことで、もっと簡単に言うと変数展開になります。  >>続きを読む

AngularJSにおけるminify化の問題点

minify化(ファイル圧縮)とは、改行や空白、コメントなどを取り除きファイルサイズを削減することです。一般的にはminify化でファイルのダウンロードを高速化するねらいで活用されるものです。 minify化は色々なサイ  >>続きを読む

Dependency Injection〜依存性の注入

Dependency Injection(依存性の注入)とは関数(コンストラクターを含む)にオブジェクトを渡すことです。 関数の中にオブジェクトを生成するとその関数は生成したオブジェクトに依存してしまい、大規模なプロジェ  >>続きを読む

Adobe Character Animatorの使い方

Adobe Character Animatorでキャラクターにアニメーションを設定します。 Adobeが用意しているサンプルを自分が作成したキャラクターに入れ替える方法で、できるだけ簡単にとりあえず動けば良いというかな  >>続きを読む

変数宣言の巻き上げ〜JavaScriptの不思議な決まりごと

JavaScriptには変数宣言の巻き上げ(hoisting)という決まりごとがあります。これはグローバル変数、ローカル変数どちらにもあてはまる決まりごとです。 他の多くの言語はプログラムは上から順に解釈されていき、変数  >>続きを読む

WordPressの子テーマ編集でfunctions.phpを上書きする方法

WordPressで既存のテンプレートを使う場合は、子テーマを作成して子テーマにカスタマイズを施します。 子テーマの作り方はこちらのページを参考にしてください。 さて、子テーマを作成していて困る点は親テーマのfuncti  >>続きを読む