任意の要素にマウスの動きに合わせてパララックス効果を表現出来るスクリプト・「Tilt」Tiltは任意の要素にパララックス効果を与えられるスクリプトです。jQueryに依存しますので軽量なスクリプトとは言えないかもですが、本スクリプト自体は圧縮版で1.45kbほどのようです。オプションもいろいろ揃えられていました。まぁ使用頻度は高くならないでしょうけど、使い方次第ではうまくユーザーの注意を引けるかもしれませんね。ライセンスはMIT。 Tilt
【超簡単】Docker でモダンな PHP 開発環境を作る (PHP, MySQL, PHP-FPM, nginx, memcached) - koni blog
追記 (2018.12.30) PHP5.6, PHP7.1 に加えて、PHP7.2, PHP7.3 にも対応しました！ また、PHP から memcached につなぐサンプルを追加しました。 はじめに こんにちは。小西です。開発環境の構築って面倒ですよねー。 今回、PHP, MySQL, PHP-FPM, nginx, memcached のローカル開発環境を、Docker を使ってコマンド一発で作られるようにしたところ、あまりに簡単で驚いたので、その方法をご紹介します。 ソースコードをgithubにおいておきます ので、すぐに起動できます！ 開発環境構築のめんどくささ 僕はPHP+MySQL+nginx+PHP-FPMの環境をよく使うのですが、こういった構成をそれぞれのマシンで再現するのって結構面倒なんですよね。1プロジェクトならまだいいですが、大体プロジェクトによってそれぞれのバー
PHPMailerのリモートコード実行脆弱性(CVE-2016-10033)の影響範囲 - Qiita
今回の脆弱性 CVE-2016-10033 CVE-2016-10045 CVE-2016-10074(Swift Mailer) 追記 2016/12/28 14:15 Postfixを使っていて、sendmailコマンドの代わりにPostfixのsendmailコマンドを使っている場合は、Postfixのsendmailコマンドが -X オプションを無視するようですので大きな影響を受けないと思います。ただ、別のオプションで違う脆弱性が発生する可能性もあるので、PHPMailerはアップデートしたほうが良いですね。 2016/12/28 15:35 PHPMailer5.2.18の修正を回避する新しい攻撃が見つかり、 CVE-2016-10045として登録されその攻撃方法も公開されてます。こちらはPHPMailer5.2.21で対応されています。 この攻撃は、PHPMailer5.2.1
プラグインで AJAX を使う - WordPress Codex 日本語版
はじめに Ajax/en (Asynchronous JavaScript And XML)はWebページがページ全体を再読み込みすることなく、一部の情報だけを更新できるようにする技術です。これはWordPressの管理画面において、投稿編集時の自動保存や、新規カテゴリーの追加など、色んなことに使われています。WordPressプラグインの中には、投票機能や地図の更新などにAjaxを使っているものがあります。 この記事はプラグイン開発者を対象とし、プラグインにAjaxを追加する方法について説明します。この記事を読む前に、以下のことについて理解している必要があります: Ajax/en - 技術の概要 プラグインの作成 - プラグインの作成方法 プラグイン API - フィルターとアクション - それがなんであり、どうやって使うか WordPress内の意図したページ・投稿・画面にHTMLを追
わずか数分でWordPressの開発環境を構築できる「Cloud9」のアカウント開設方法
WordPressを使ったサイト制作で面倒なのが、開発環境の構築です。ローカルにサーバーをインストールしたり、レンタルサーバーを契約して設定をしたりするよりも、もっと手軽に環境を整えたい。そこで、開発環境をクラウド上に簡単に構築できて、ブラウザー上で直接コードが書ける「Cloud9」を使ってみましょう。 Cloud9（クラウド9）は、クラウドナインが提供する、クラウド統合開発環境（IDE）サービスです。Webアプリケーションの開発に必要な実行環境（OS、Webアプリケーションサーバー、データベースなど）とソースコードをブラウザー上で編集できるエディターが統合されており、要なフレームーワークをすばやくインストールしたり、ファイルをアップロードしたりもできます。 つまり、ブラウザーとネット環境さえあれば、すぐにコードを書いて動かすことができる、とても便利なサービスなのです。 Cloud9には無
「センスない」と言わせない！ 非デザイナーでもわかるUI配色のコツ
どんなに機能がイケてるアプリでも、デザインがイマイチだとなかなか使ってもらえません。そこで必要なのが、「色」の知識。もうセンスが悪いなんて言わせません。 Kissmetricsによると、製品の外観は消費者の購入決定判断に一番影響する要素です。最近では、マーケティングマネージャーがカラーコンサルタントを登用し、カスタマーを引きつける力のある色をどう選ぶべきかアドバイスを受けるのが通常になってきています。色が重要なマーケティングツールだと理解しているからです。モバイルアプリの開発者にとっても、そうした流れから学ぶべき、役立つことはたくさんあります。 カラーセオリーとは 3原色（赤、黄、青）を基本としたカラーホイールを芸術家が使うようになってから、もう何世紀もたちます。最初のカラーダイアグラムは350年前に誕生し、ニュートンによって開発されました。 最近使われるカラーホイールは、二次色（緑、オレ
構造化データを設置するのはどのページ？ モバイル向け？、PC向け？、AMP？
[レベル: 中〜上級] 構造化データはすべてのページ（PC向け・モバイル向け・AMP）に設定すべきなのでしょうか？ それとも、AMPページだけに設定すればいいのでしょうか？ こんな質問が、英語版のGoogleウェブマスター向け公式ヘルプフォーラムに投稿されました。 Google社員のコメントも参照しながら、一緒に考えてみましょう。 AMPカルーセル用はAMPページに。それ以外は、現在はPC向けページに、今後はモバイル向けページに 基本的には、どんなタイプの構造化データを実装するかによって変わってきます。 AMPカルーセル用はAMPページに モバイル検索では、AMPページがカルーセルに掲載されることがあります。 代表的なのはトップニュースのカルーセルです。 ※カルーセルではなくリスト形式で掲載されることもあります（キャプチャのカルーセルの上） 米Google (google.com) では、
wp-adminへのゼロデイ攻撃を防ぐ機能を追加 – IP Geo Block更新告知 | ゆっくりと…
2014年12月、NTTコミュニケーションズが「Zero day Attack Protection（仮称）」を開発、今年4月からのサービス開始を発表しましたが、我が WordPress プラグイン IP Geo Block も独自の仕組みにより一部の ゼロデイ攻撃 を防御する機能を追加しましたので、その告知とバグ出しの協力願いをしたいと思います 。 背景 拙作の「プラグイン作者必読！実例に学ぶ脆弱なWordPressプラグインの作り方、又はwp-adminを守る理由」では、脆弱性を持つプラグインの多くで「重要な処理」を行う際、「権限と nonce の検証」が欠落していることを明らかにしました。またその後も 同様の例 が後を絶ちません。 本来なら WordPress 自体が本質的にセキュアな仕組みで出来ていて、この手の脆弱性を作り込む余地がないのが理想でしょう。一方で、もしそんな作りになっ
WordCamp US 2016に行って感じたTokyoとの違い | 高橋文樹.com | Web制作
この投稿は 7年半 前に公開されました。いまではもう無効になった内容を含んでいるかもしれないことをご了承ください。 一昨日WordPress 4.7がリリースされましたね。僕もコアコントリビューターとして名前が載ったぞー！ 貢献の内容自体は大したものではありません というわけで、WordCamp US 2016に参加し、ちょうど昨日アメリカから帰ってきたわけので、その感想をば。ちなみにこの記事はWordPress Advent Calendar 2016の8日目の記事です。 WordCamp USに参加しようと思った理由 僕は今年のWordCamp Tokyo 2016の実行委員長だったのですが、諸事情ありまして立候補というよりは、なんか結果的にやることになったので、せっかく自分が関わるようになったイベントだから、本場のやつを見にこうと思ったわけであります。 あとは、以前WordPress
2017年に注目しておきたい、JavaScriptのライブラリのまとめ | コリス
数多くあるJavaScriptのライブラリの中で、どれを勉強すればいいか判断することはなかなか難しいものです。いくつかのライブラリは放置され衰退し、またいくつかは急速に成長し、広範囲に採用されることがあります。 jQueryやReactは多くの人が知っているでしょう。 2017年に注目しておきたい、急成長しているJavaScriptのライブラリを紹介します。 D3.js ビッグデータは成長産業で、データ ビジュアライゼーションも同じくらい重要になっています。グラフ作成やマッピングのライブラリはたくさんありますが、D3.jsほど目立つものはほとんどありません。このJavaScriptライブラリはSVGやCanvasの要素と連携して、Web上のグラフ、チャート、動的なビジュアライゼーションをレンダリングします。 D3.jsは完全に無料で、JavaScriptで構築された最も強力なビジュアライゼ
Webデザインでよく使うUI要素の名称・用語一覧 - Qiita
Overview Webサイトを作っているとよく出てくるUIの名称を、ざっくばらんにまとめました。 人や会社ごとで固有の呼び方があると思いますが、私の場合こんな感じです。 コミュニケーション円滑にな〜れ ※2016/11/28 はてブコメントなど参照させていただき、少し更新しました。 ポップアップ表示系 ▼ アラート JSのalertかブラウザのデフォルト機能で出るやつ。ダイアログとも。 ▼ モーダル・モーダルウィンドウ 閲覧中のページにカバーを重ねて表示させるやつ。 modalは「このページはいま入力モードだぜ」といった意味合いでmodeを形容詞化したことば。 ▼ ツールチップ・ポップアップ表示 マウスオーバーすると吹き出しとかで表示されるUI。 補足説明などで使用されることが多い。 ▼ ポップアップウィンドウ 閲覧中のウィンドウとは別に、勝手に立ち上がるウィンドウ。 スパイウェアなどの
AjaxでもURLを更新して履歴を作れるHTML5のpushState試してみた
Posted: 2011.06.20 / Category: javascript / Tag: Ajax, HTML5 高速なWebアプリケーションを作成するにはAjaxがなくてはならないものとなりました。AjaxにはURLが更新されず、そのためブラウザの戻るも使用でません。 このような問題を解決するためにHTML5で追加されたのが「pushState」です。 pushStateを使用していないサンプル jQueryのloadメソッドを使用したコンテンツ切り替えの簡単なサンプルです。 page1.html <!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8"> <title>page1</title> <link rel="stylesheet" href="style.css"> <script type="text
WordPressユーザーなら絶対チェック！あなたの知らない最新プラグイン6つ
古いやり方や面倒な作業を一気に変えてくれそうな最新のWordPressプラグインを厳選して紹介。WordPressユーザーなら要チェックです！ プラグインが好きな人もそうでない人も、たくさんの魅力的なプラグインがWordPressにたくさんあることを認めざるを得ないでしょう。豊富な機能を備えたEコマースWebサイトの構築からWebサイトへの小さな変更の追加に至るまで、Webサイト作成者にとってWordPressのプラグインは非常に役立つものです。 WordPressの人気は堅調なので、毎日のように新しいプラグインが開発・ローンチされています。しかし、常にこれらのプラグインを最新の状態に保つのは大変です。この記事ではWebサイトのトラフィックや売上を急増できる新しいプラグインを紹介します。 1. Duplicate Page 似たようなページや投稿を作成する時間を短縮する方法を探していません
Riot.js ことはじめ - Qiita
端的に結論を言うと、もうこれで良いじゃないかな、です。 背景 ちょっと前にこのへんとかを中心にWebのフロントエンドを作るのにフレームワークはいるかいらないかみたいな議論（適当）がありましたが、業務で静的データを使ったWebページ（サーバサイドの状態がフロントエンド側から変化しないページ）を作ることが多い自分としてはこう思いました。 確かにjQueryで直接DOMをいじるのは、いじる要素が片手で数えられるうちはいいが、それを超えるとうまく管理できなくなるからあんまり上手い方法でないのは同意できる かといってReactJSは確かに便利そうではあるが、正直ぱっと見ではよくわからないので、使うなら腰を入れて勉強する必要がありそう＝ミニマムスタートしにくそう ということでうまく折衷案的なものはないかと思っていたら riot.js というのを見つけたので試してみました。 Riot.jsの超入門 Ri
AWS + KUSANAGIのHTTPS環境にブログを移行した手順 | 経験知
※本ページはプロモーションが含まれています 作成:2016/02/13 更新:2016/09/29 このブログのPV増加に伴い、サーバ移転を検討していました。 サーバは、急なアクセス増加にもプランを変更することでサーバの処理能力を上げて手軽に対応できるAWS（Amazon Web Service）に決定し、ついでにHTTPSに対応しようといろいろな方法を模索しました。 HTTPSについてはこちらの記事で：「ブロガーのためのHTTPS（SSL証明書）入門 」 一からサーバを設定したり、AWSで簡単にWordPress環境が作れるAMIMOTOを検討しましたが、自分でサーバを設定するのは初期設定もメンテナンスも面倒臭いし、AMIMOTOは簡単で便利でしたが価格がネックになり導入をためらっていました。 関連：「AWSとAMIMOTOでHTTP/2対応の高速WordPress環境を構築する方法。も
「あとで読む」の実装例で学ぶ！Ajaxを使ったWordPressプラグイン開発の始め方
Ajaxを使ったWordPressプラグインの開発方法を学びましょう。独自の「あとで読む」機能を実装するプラグインの作り方を例に解説します。 急速に広まったWebテクノロジー「Ajax」は、ほとんどのWebサイトで使われています。Ajaxの重要な機能は、Webページをリロードせずにデータベースが操作できることです。つまり、ページを更新することなくデータベースからデータを取得してブラウザーに表示できるのです。 Ajaxは、素早くそしてスムーズにコンテンツを表示できるため、いまやさまざまな用途でWebサイトに使われるようになりました。たとえば、ブログコメントの投稿、記事間のリンク、ファイルのアップロードなどです。Webサイトを完全にAjax化して、サイトのどのページでも非同期で読み込めるようにすることさえも可能です。 この人気を受けて、大半の有力CMSがその仕組みにAjaxを取り入れています。
【決定版】デキるWebデザイナーのための「CSSフレームワーク」ベスト10
フレームワークの活用はWebデザインの現場において「当たり前」のものとなってきましたね。制作にかけられる時間・労力は決して無限ではありません。限られた資源（リソース）を効果的に分配するのもプロとして欠かせない姿勢です。今後もこうしたCSSのフレームワークを活用した流れは続くのではないでしょうか。 そこで本稿では制作の現場で使えるWebデザイナーのための「CSSフレームワーク」ベスト10をご紹介します！下記にご紹介するフレームワークをうまく活用して、ぜひ日々の業務の効率化にお役立てください。 そもそもフレームワークとは何か？ フレームワークとは、本来ファイルとフォルダを含むパッケージのことです。CSSフレームワークの場合だと標準化されたHTML、CSS、JSコードを含んだ機能群のことを指します。こうしたフレームワークを使うことで、一からフロントエンド開発を行うよりも飛躍的にWeb制作の生産性
Quick Start
Getting StartedQuick StartAjaxAPIClassContextDomEventsModuleOptionsServiceThemingModulesAlertBreadcrumbBreakpointButtonColorDropdownFormGridHelpersLabelLayoutMixinsModifiersNavbarOffcanvasPagerSpaceStickyTableTabsToggleTypographyServicesAppAnimateLangMessageModalModalFormModalElementProgressResponseUtilsAddonsAutocompleteCheckComboboxDatepickerEditableMagicQueryNumberSelectorSliderUploadValidateVi
レンタルサーバーを使ってるなら「WP Fastest Cache」プラグインが丁度よさそう
WordPressで使えるキャッシュプラグインは沢山ありますが、会員制サイトやモバイル対応などの理由で導入できなかったり、バージョンアップ時にトラブルが出たなどの話を色々聞いて、利用するのを控えている方もいるかもしれません。 大規模な(アクセスが多い)サイトの場合は、クラウドサーバーなどで複数構成や高機能な環境を組み込んで利用する場合もありますが、小規模サイトや予算の都合・スタートアップ等の場合は一般的なレンタルサーバーを使うケースが多いと思われます。 しかし レンタルサーバーはアクセスが多い状態に弱いことがあり、何らかの対策(キャッシュ等)方法があればいいな と思う時もあるでしょう。そんな時には「WP Fastest Cache」プラグインが丁度よさそうです。 WP Fastest Cache Premium | The Fastest WordPress Cache Plugin ht
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Bulma: Free, open source, and modern CSS framework based on Flexbox
