【プロのノウハウを効率よく盗むコツ】

学校のホームページをWordPressでリニューアルしている 生徒さん。 WordPressのことは他のスクールで学んだけれど、 途中で行き詰ってしまったそうです。 今、マンツーマンレッスンで困っているところだけ ピンポイントでお教えしているのですが、 CSSが苦手のようにお見受けしました。 誰でも苦手はありますので、 レッスンの時間を使って1からじっくり見て学ぶよりも 講師に作業依頼をして、出来上がったものを見ながら 重要な考え方やテクニックを要する部分だけを後日 レッスンで復習していただいたほうが良い場合もあります。 一人では何日かかってもできそうにないことは、 思いきって講師に依頼してし…

【プラグインの動作を抑止するスクリプト】

WordPressにjQueryのプラグインを導入して、 スタイリッシュな検索動作をサイトに組み込んでいる 生徒さん。 ユーザーの使い勝手を考えて、プラグインの動作を 一部変更することになりました。 「どこをどう書き換えればよいのか？」 この答えにたどり着くために、 ・プラグインが動作する仕組み ・プログラム同士のつながり をしっかりと理解することが必要でした。 仕組みがわかれば、どこをどうやったらいいのかを 予想することができるからです。 PR CODEMYのマンツーマンレッスンでは、WordPressや HTML5やCSS3を基礎からしっかり学びたい方のために、 コース学習の中でカリキュラ…

【JavaScriptでHTMLを自由に読み取るレッスン】

ぐるなび風のレストラン検索サイトを教材として、 検索ボタンを押したときの動作をJavaScriptで作る レッスンをしました。 プログラミングは、小さな命令の組み合わせで作ります。 「検索ボタンのプログラム」 という、決まりきった答えがあるのではありません。 まずは、JavaScriptをどこに書いたらどんな順番で どんなタイミングで処理が実行されるのかを理解し、 その上で、JavaScriptでHTMLの内容を読み書きする 書き方を学んでいくことになります。 「JavaScriptでHTMLにアクセスする」 という感覚がつかめてくれば半分ぐらいマスター したのも同然です。 PR CODEMY…

【WordPressでプラグインが動かない原因の多くはjQuery】

一般的によく使われているプラグインなのに、 「私のWordPressでは動かないんです…」 これ、経験したことある方多いかと思います。 多くの場合、 ・お使いのテーマ ・お使いの（他の）プラグイン ・自分が改造したコード のいずれか、または組み合わせが原因です。 ちょっと厄介なのは、 原因を突き止めたり直し方がわかるためには やや突っ込んだ知識が必要だということ。 キーワードは、 ・コンフリクト ・即時関数 ・jQueryが動く仕組み ・バージョン PR CODEMYのマンツーマンレッスンでは、WordPressや HTML5やCSS3を基礎からしっかり学びたい方のために、 コース学習の中でカ…

【WordPressで絞り込み検索に使えるプラグイン】

isotope.jsというjQueryのプラグイン。 ↓使い方が載っているサイト on-ze.com検索対象をグリッド状に自動で並べるだけでなく、 フィルターによる絞り込み機能が使えます。 グリッドレイアウトだけならmasonry.jsも有名ですが、 フィルター機能がありません。 というわけでイチオシのisotope.jsですが、 商用利用は有料（1ライセンス$25）です。 フィルター機能を自作するのは大変なので、 商用のWordPressサイトなら、購入しても 全く損はないプラグインです。↓isotopeダウンロードサイト isotope.metafizzy.co PR CODEMYのマンツ…

【プロから学ぶべきは「着眼点」である】

ドラえもんの名言のひとつに こういうのがあります。 ～～～～～～～～～～～～～～～ 人にできて、きみだけにできない なんてことあるもんか。 ～～～～～～～～～～～～～～～ いい言葉ですよね。 今すぐにはできないことでも、 どうすれば克服できるかがわかれば 本人の努力次第でできるようになる。 考えてもみれば、天才なんてのは ほんの一握りしかいなくて、 ほとんどは長年の経験や専門性の 違いや努力の質と量による差だと 思います。 だから、その分野のプロから学ぶ ことに意義があるんですよね。 一人で迷走するよりも効率的に、 正しい順路を示してもらえるので、 本当なら何日も何ヶ月も何年も かかってできる…

【動画講座JavaScript編｜受講生の感想】

JavaScript編を受講されている生徒さんから 講座への感想をいただきました。 ～～～～～～～～～～～～～～ プログラムをデバッグする方法というのは その概念も知りませんでしたし、 ネットや書籍では独学が難しいので、 とてもためになりました。 こういう素人が気づかなくて 独学が難しい実践的な技術を これからも配信していただきたいです。 ～～～～～～～～～～～～～～ CODEMYの動画講座では、 HTML・CSS・JavaScriptの基本が学べますが、 ネットに載っている「書き方」だけでなく、 ネットに載っていない「考え方」や、 実用のプログラムが作れるために必要な 「ネットでは得られない…

【WordPressでモバイル対応のページを作る方法】

今日のレッスンでは、 ページビルダー系のプラグインの使い方と、 カスタムテンプレートの作り方 をお教えしました。 WordPressにはモバイル対応済みのテーマが多いので、 レスポンシブ対応のページが簡単に作れそうに思えます。 しかし、実際はそんな甘くありません。 WordPressの編集画面にはビジュアルモードがあるので、 HTMLやCSSの知識がなくても写真や文章を載せることは 簡単にできます。 でも、 『写真を左に配置して、右側に文章を載せたい。』 とか、 『写真を横に3つ等間隔で並べたい。』 というように、単純な縦並びではないレイアウトに しようと思うと、タグの知識がなければできません…

【HTMLをWordPressへ載せ替えるサポート】

とある公共機関のホームページを WordPressに載せ替えるサポートを レッスンとして行っています。 レンタルサーバーの選び方や、 サーバー会社に事前確認すべき内容、 WordPressのインストール方法、 初期設定で気を付けるべきポイント、 などを初回レッスンでアドバイスし、 その後は生徒さんが行き詰ったときや、 解決できない疑問が出てきたときに ピンポイントでレッスンをしています。 PR CODEMYのマンツーマンレッスンでは、WordPressや HTML5やCSS3を基礎からしっかり学びたい方のために、 コース学習の中でカリキュラムをご提案致します。 ▼無料相談をお気軽にご利用くださ…

【ウェブページで外部のリソースを借りるには？】

添付のようなアイコンは、 画像として配布されているものもあれば、 ウェブフォントとして配布されているもの もあります。 画像の場合は、色が変更できませんし、 CSSで大きさを変更するため引き伸ばすと 画像がひどく荒れてしまいます。 しかしウェブフォントの場合は、 「あ」や「漢」のように、1つ1つの アイコンが文字として登録されているので、 CSSで色を変更することもできますし、 CSSで大きさを変えても荒れません。 特に、画像ソフトを使わなくても 自分のサイトにアイコンを設置できる 手軽さは最大のメリットだと思います。 さて、 このようなウェブフォントは、 WordPressをインストールした…

【WordPressでウェブアイコンを使う方法】

FontAwesome（フォントオーサム）という 無料のウェブアイコンをWordPressで使う方法を レッスンしました。 ウェブアイコンというと何か特殊な印象を 受けるかもしれませんが、 Googleフォントに代表される、 ウェブフォントを利用する場合の方法と、 考え方は本質的に同じです。 要は、アイコンやフォントのデータである ネット上のCSSファイルを自分のサイトから リンクさせれば利用できるようになります。 CSSをサイトにリンクさせる方法といえば、 HTMLの head タグの中に link タグを 記述するのが一般的です。 WordPressは、テンプレートはPHPで出来ていますが…

【プログラムは文法の知識だけでは作れない】

ジグソーパズルの遊び方は 誰でもご存知でしょう。 パズルの絵柄がどうであろうと、 総ピース数がどうであろうと、 平面だろうと立体だろうと、 「ピースの凹凸がぴったり合えば正解」 という根本的なルールだけで 成り立っていると言えますよね？ でも、 ジグソーパズルが得意な人もいれば 苦手な人もいるわけです。 たぶん、得意な人は何らかの 自分ルールみたいなものを持っていて、 それに従って解いていくと思います。 例えば、 ・一番外側の枠から組んでいく ・同じ色のピースから組んでいく といったテクニックです。 こういうテクニックが身に付いている人は、 なぜそのやり方が良いのかという理由を 理解しています…

【jQueryで検索処理の組み立て方を学ぼう】

HTMLとCSSをしっかり学び、レスポンシブなサイトが 構築できるようになった生徒さんが、次のステップ 「jQuery」の習得に励んでおられます。 レッスンでは、架空のイタリアンレストランのコース 検索ページを用意し、検索ボタンの動作をjQueryで 作成できるようなるための「考え方」からスタート しました。 一言に「検索処理」といっても、 具体的に何をどのような順番で処理を組み立てれば 目的通りの動作になるのかという道筋が日本語で 説明できなければ、プログラムに置き換えることは ゼッタイにできません。 なぜなら、 プログラムとは日本語で書いた筋書を、 コンピューターに理解できる文法に置き換え…

【なぜこの方法が正しいのか？】

eastcoder.com WordPressでjQueryのプラグインとか bootstrapなどのフレームワークとか、 とにかく、CSSやJavaScriptをリンク させたいとき、2つの方法があります。 方法1． テンプレートに直接リンクを埋め込む。 方法2． アクションフックを使う。 シェアした記事は方法2の方法を 解説しています。 「ああ、これが正しいやり方なんだ」 で終わるのと、 「なぜこれが正しいんだろう？」 と疑問や興味を持つのとで、 身に付くスキルの幅も深さも 大きく変わってくると思います。 PR CODEMYのマンツーマンレッスンでは、WordPressや HTML5やCS…

【「自動化したい」について】

何かを自動化するニーズって、 かなり多いと思います。 誰だってそうですよね？ 毎月末の請求処理とか、 特に事務処理的な単純作業は 誰もが楽をしたいと思ってるはずです。 それを解決する1つの手段として プログラミングがあるわけですが、 そこに広告とか販売チャンスとか、 目的にお金が絡んでくると、 不正プログラムが横行して、 大問題になりますよね。 だから、 TwitterやInstagramなどのSNSや、 Amazonなどが公開しているAPIのうち ・他人のアカウントに関する情報の取得 ・他人にDMを送信する機能 ・自動で投稿する機能 などといった、グレーな目的にも 利用できてしまいかねない情…

【新規ツール開発の事前調査】

「極秘ツールが期間限定で公開」 「完全自動で収益が上がる」 みたいな怪しいツールの情報が 出回っているせいで、 よく誤解されるんですよね。 「同じようなツール作れませんか？」 って。 例えばAmazonが公開している APIを使ってプログラムを作れば、 ・特定の出品者の情報 ・特定の商品の再安値や在庫数 ・特定の商品の売れ筋ランキング などを、自動で取得したりできます。 しかし、本来AmazonがAPIを 公開している目的は、 「手作業でもできる出品作業などを プログラムで省力化できますよ。」 だったと思うんです。 もちろん、リサーチのために必要な 情報を自動で検索するというのも APIの活用…

【JavaScript動画講座受講生へのメールサポート】

JavaScriptの動画講座を受講している 生徒さんから質問が届きました。 早速、補講メールを作成して 配信スタンバイ完了。 質問すればするほど、 より深い基礎知識に基いた回答が 得られるので、 スキルアップが加速します。 PR CODEMYのマンツーマンレッスンでは、WordPressや HTML5やCSS3を基礎からしっかり学びたい方のために、 コース学習の中でカリキュラムをご提案致します。 ▼無料相談をお気軽にご利用ください。 http://codemy-lesson.office-ing.net/contact ━━━━━━━━━━━━━━━━━━ 講師が執筆した本が発売されました …

【ネットユーザーのニーズを調べる方法】

特定の商品をブログで紹介するにあたって、 インターネットユーザーの興味関心を リサーチした上で記事を書くことは とても有効なことです。 リサーチの1つの手段に、 『アンケートをとる』 ことが挙げられます。 ネットでどうやってアンケートをとるの？ と思われるかもしれませんが、 1．アンケートが投稿できる無料サイトを使う 2．自分のサイトにアンケートページを作る という方法があります。 1は、そういうサイトがあるということを 知っていればGoogle検索ですぐ見つかります。 2は、WordPressならプラグインでできますし、 フリーのCGIプログラムを利用する方法でも 作ることができます。 今日…

【コピペ厳禁！Youtube動画のレスポンシブ埋め込みコード】

Youtube動画のページで共有ボタンを押して 埋め込み用のコードをコピーします。 <iframe width="560" height="315" src="...."></iframe> これをブログやホームページに埋め込むと src="..." で指定された動画がページに表示 されますが、スマホで表示すると横幅が 画面をはみ出したり、縦と横のサイズの バランスが崩れたりします。 上記のタグに、縦横のサイズが固定で 記述されているためです。 そこで、スマホの画面サイズに応じて 縦横のサイズが自動で縮小するように、 スタイルシート（CSS）を使って 上記のタグに記述されたサイズを 「上書き補…

【WordPressのセキュリティ対策レッスン】

WordPressは世界シェアナンバーワンのCMSなので、 利用者が多い反面、攻撃の対象にもなりやすいです。 これはどうしようもない事実です。 私たち個人ができるセキュリティ対策としては、 1．どんな攻撃方法があるのかを知っておくこと。 2．どんな対策方法があるのかを知っておくこと。 3．具体的な対策を設定しておくこと。 の3点が重要です。 今日のマンツーマンレッスンでは、 ・ブルートフォールスアタックとは？ ・WordPressで攻撃されやすい場所とは？ ・どんなプラグインで何が対策できるか？ ・具体的な設定方法とは？ をお教えしました。 PR CODEMYのマンツーマンレッスンでは、Wor…

【WPのDB移行で思わぬエラー】

同じレンタルサーバー同士の 移転なので、単純に Export→Import で取り込めると思ったら MySQLのバージョン非互換で 内部文字コードのエラー。 kngy.net 結局、DBのダンプファイルを テキストエディタで直接修正し、 正常にImportできました。 サーバーもそうですが、 データベース周りのことって、 やってみないとどんなエラーに 遭遇するかわかりません。 何もかもわかっていることを 手順通りにやるだけなら 見込み通りに終わるのですが。 現実は試行錯誤の連続です。 遭遇するエラーを、 いかに自己解決していけるかが 重要。

【クラウド型ウェブツール開発】

ツール開発の打診があったので、 実現の可否を見極めるために 開発ソフトで技術調査の真っ最中。 1．データベースの利用 アプリケーションからレンタルサーバーの DB（MySQL）に接続できること。 2．WebAPIの利用 サードパーティーのWebAPIを使って、 データの取得ができること。 この2点がクリアできることを 確認できれば、 手間とコストがかかっても、 ご希望のツールが実現可能という ことは言えます。 執筆の仕事も併行するので、 半年はかかる気がしますが。 受注できれば、クライアント様の 業界へ大々的に宣伝してもらって 販売したいところです。

【スタイルシートで簡単にグラフが描ける方法】

世論調査のようなアンケートページを 作成中の生徒さんから質問がありました。 「アンケートの結果をグラフみたいに 表示したいのですが、できますか？」 中級者以上なら、 ・HTML5のCanvasタグ ・JavaScript この2つを組み合わせれば グラフが描けることを ご存知かもしれませんね。 しかし、どのみちJavaScriptで グラフの座標や長さを計算する プログラムを書かなければなりませんので、 「できればコードを書くのは避けたい」 という方にはハードルが 高いかと思います。 そこで今日のレッスンでは、 『とっても仕組みが簡単なので 初心者でもすぐ理解できる方法』 をお教えしました。 …

【レストランの検索ページでjavascriptのレッスン】

今夜のマンツーマンレッスンの準備で、 架空のイタリアンレストランの検索ページを 作成しました。 レッスンの目標は2点。 ・javascriptを使って入力内容を取得する ・javascriptを使ってHTMLを自由に変更する 高度なことを実現するには、 単純なことを仕組みから理解して プログラムの組み立て方を発想できる力を 身に付けることが大事です。 PR CODEMYのマンツーマンレッスンでは、WordPressや HTML5やCSS3を基礎からしっかり学びたい方のために、 コース学習の中でカリキュラムをご提案致します。 ▼無料相談をお気軽にご利用ください。 http://codemy-le…

【150万PV・VPSへサーバー移転】

マンツーマンレッスンで知り合った 起業家さんが運営していらっしゃる 月間150万PV越えの超人気メディア。 アクセス数が多く、 ピーク時に何度もサーバーダウン。 サイトの今後の成長を見据えて、 共用型のレンタルサーバーから VPSへの移転を提案しました。 ただ、VPSはサーバー管理を自分で しなければならないので、ある程度 専門知識がないと、VPSのメリットを 十分に引き出すことができません。 一般的には、月額いくらという形で サーバー管理に詳しい専門の会社に 管理を委託することが多いのですが、 本件は私個人にサポートのご相談を いただいたので、チャットワークで いつでも連絡・相談ができる体制…

【ドメインのお引越し（移管）】

長年ウェブサイトを運営していると、 あっちで取得したドメインや こっちで取得したドメインが、 あっちのサーバーで使っていたり こっちのサーバーで使っていたり、 情報がバラバラになってきて ややこしいですよね。 「一箇所にまとめて管理したい」 そんなときに行うのが ドメインの移管（お引越し）。 レンタルサーバーをお使いの方は、 サーバーを契約するときにドメインも 一緒にお申し込みをされることが 多いかと思います。 その場合は、同じサーバー会社で サーバースペースとドメインの両方を 管理していることになるので楽です。 しかし、本当はドメインとサーバーは 別々のものなので、 ドメイン → お名前ドッ…

【ウェブサイトをSSL化するレッスン】

現在、少数の生徒さんを動画講座や マンツーマンレッスンで継続的に お教えしていますが、 ひとりひとり目標も違えば、 毎回お教えする内容も違うので、 ちょうどいい人数と感じています。 明日は、ウェブ予約システムの設置を お教えした生徒さんに、 サイトのSSL化をレッスンする予定。 ・独自SSL/共用SSLの違いとは？ ・SSLの目的、メリット、デメリット？ ・ワードプレス側の設定方法は？ という内容を扱う予定です。 PR CODEMYのマンツーマンレッスンでは、WordPressや HTML5やCSS3を基礎からしっかり学びたい方のために、 コース学習の中でカリキュラムをご提案致します。 ▼無料…

【ウェブ予約システムを設置するレッスン】

・予約状況を見ることができる ・カレンダーから選択できる ・日付と時間帯が選択できる ・予約完了ページが開く ・予約メールが届く ・自動返信メールが届く そんなウェブ予約システムを ホームページに設置するレッスンを行いました。 英語のプラグインって、 見た目は難しそうに感じますが、 「英語はニガテだからイヤだ！」 なんて毛嫌いしないで、 公式サイトのマニュアルを見ましょう。 だってそこに詳しい使い方や 設定方法が書いてあるんだから。 やってみる前に諦めるから 難しく感じるのです。 やってみると、思ってたほど 難しくはないことがわかります。 PR CODEMYのマンツーマンレッスンでは、Word…

【スタイルシートを学んで表現のバリエーションを増やそう】

いろんなサイトを見て、 「自分でもこういうサイトを作れるようになりたい」 ということから、マンツーマンレッスンで HTMLとCSSを学んでおられる生徒さん。 『ホームページ作成のツボとコツがゼッタイにわかる本』 http://amzn.to/2bXJkbs を購入されて自習をしつつ、 レッスンでは目標とするサイトを目指して 「こういう表示をするためには 何をどのように考えればいいのか？」 を学んでおられます。 約6時間のマンツーマンレッスンで学んだことを 活用して、ここからはしばらく自分でサイト制作を 進めてみるとのことでした。 しっかりと1つ1つの構文や意味についても 疑問に感じたことはレッ…

【伝えない希望は叶わない】

たとえ仕事を依頼する相手のほうが その分野のことに詳しくても、 「こうして欲しい」 を具体的に伝えることができなければ、 期待通りのモノは出来上がってこない。 なぜなら、 作る側は、提供された情報で作るから。 言われてもいないことを、 想像で作ったり、 良かれと思って余計な機能を 付けたりすると、 「ちょっとイメージと違うんですが・・」 「あの、これは要らないんですが・・・」 ということになる。 10を作っても、1しか要らなかった なんてことになるのは徒労だと思う。 もちろん、 依頼主も制作側も人間だし、 他人同士なのだから、 心の中まで見通せるわけではない。 だからこそ、 「伝えようと思った…