サクサク読めて、アプリ限定の機能も多数!
トップへ戻る
アメリカ大統領選
blog.photosynthesic.jp
こんにちは、みみです。 WordPressのデザインの話をそろそろガチでしたい WordPressのブロックエディタが実装されて早2年になります。カスタムブロックの作り方については良く話題になる気がしますが、ガラッと変わった設計に応じた新しいワークフローやデザイン手法などについてはそんなに話が上がらない気がします。 一通りのカスタムブロックプラグインが出揃った今だと尚更に、それよりもブロックエディタ時代のWordPressのデザイン手法についてみんな考えあぐねているのでは無いかと思うのです。 20日に出た5.8でのWordPressの進化を眺めていて、そろそろ誰かとそういう語りがしたくなってきたので、試しにひとつ書いてみようと思います。Webの4割を占めるWordPressのデザインの話、もっとあってもいいと思うんですよね。 ワークフローとしてウォーターフォール型では全く機能しなくなる、み
こんにちは、みみです。 車の中から書いています。移動の車の中でできる事ってないかなあと思って、ブログ更新をば。しかし間が空いてしまって書き方を忘れていますね。というかiPhoneからだとうまく書けないかも…。いや車の中だからか…。 閑話休題、先日、LibSassとDartSassの戦いに終止符が打たれたとか聞いたので、久々に #npmライブラリをおさらい をしてみたいなというお話。 何かというと、Sassの公式ブログで、LibSassは非推奨宣言されまして。 Sass: LibSass is Deprecated ぽやんとした頭(大体いつもそう)で読んでて最初は、ちょっと前から個人的にはPostCSSに完全移行していたのでまあスルーでいいかと思ったんですが、よく考えたらまだまだnode-sass使い倒してるリポジトリ一杯あったな…と思いまして。 そちらはPostCSS完全移行でSassファ
WordPressのブロックエディターでカスタムカラーを一元管理するスニペット Snow Monkeyの場合と自作テーマの場合 こんにちは、みみです。 カスタムカラーに色が多すぎる問題ありませんか。選択肢が多すぎるとユーザーは困ると思うのですよ。というか勝手気ままに色を使われるのも中々困るケースがありますよね。 というわけで、Snow Monkeyでカスタムカラーを変更する(のとeditor-styleの読み込み)にちょっと手間取ったのでメモしておきます。ついでに、カスタムカラーをJSONで一元管理するスニペットをざっと書き出してみました。普通のテーマの場合のソースも一応書き出しておきました。誰のためでもなく未来の自分のために。 何をやっているか color-config.jsonの設定をnpm run color_configで書き出して_color_config.scssを生成してそれ
こんにちは、みみです。 最近はペライチなdocker composerでお手軽WordPressローカル環境を作成していたのですが、WordPress公式がwp-envライブラリを仕上げてきていたので、喜んでいそいそ引っ越しをしました、其のメモです。 こんな記事より先に読むべき公式ドキュメントはこちら あとdockerが必要です。 インストール $ npm -g i @wordpress/env macなら ~/.wp-env/ というディレクトリが出来ていると思います。 取り敢えずデフォルトのWordPressを立ち上げるなら 適当なディレクトリを作成して $ mkdir YOU_LIKE_DIR_NAME $ cd YOU_LIKE_DIR_NAME .wp-env.json というファイルを作成して、ファイルの中に以下のJSONを書いて保存。 { "core": null } 以下の
こんにちは、やすです。 ブログを書くのは何年ぶりかな。。 WordPressはPHPで動的に動作する為、大量なアクセスを捌く為には色々な工夫が必要になります。 そのため、Wordpressの記事をS3+Cloudfrontで静的ホスティングは有効な手段の一つかと思います。 但し、この場合、静的HTMLとなるため、セッション認証のような認証機構を使う事が出来ません。 それを解決する為にCloudfrontの署名付きCookieを利用したサイトを構築しました。 全体の流れは下記のような感じですので、詳細はそれぞれ説明していきます。 WordPressの記事を静的HTMLとして出力出力した静的HTMLをS3へのアップロードS3に配置した静的HTMLをCloudfront経由で配信認証機構をもたせる為にCloudfrontの署名付きCookieを利用 WordPressの静的HTML化(プラグイン
こんにちは、みみです。 冬休みの独り言として、WordPress5で正式導入された新エディター(Gutenberg)へのテーマでの対応をどうするのか、という事を書いてみようと思います。 ・・・とはいえ、この半年ほどWordPressコミュニティに参加させて貰ってきて感じたのは、テーマをイチから作ってる人はあんまり居ないっぽいし、需要もそんなに無いっぽいので「独り言」としてみました。 何に対応すれば良いのか? そもそも現時点で言うところのテーマでのGutenberg対応ってなんぞ?という話なのですが、兎にも角にも先ずは各種ブロックを使用した場合の表示に対応する、というのが基本中の基本な気がします。テーマに合わせたカスタムブロックを作るとかエディタ側の表示を揃えるのはその次のフェーズな気がするのだけども、もうこの時点でめっちゃ大変かなと。だって、ブロックの組み合わせを全チェックしていくのめんど
Google web starter kit を触っていて、gulpとstyledoccoという素敵ツールを知ったのでhtml5 boilerplateをベースにsassとgulpを導入してstyledoccoでstyleguideも自動生成する、というのを作ってみました。(・・・Google web starter kitをベースにする方が早い気もするのですが、モジュールやらコンポーネントの内容やSassの構成とかがイマイチ凡人には理解しかねたので今後のアップデートに超期待しています。) といっても、ほぼGoogle web starter kit のgulpfile.jsをぱく・・・参照させていただいております。ディレクトリを変えて、styledoccoのためのソースを加えただけ。 手順 前準備:gulpは公式を参照に予めインストールしているとして。 1. 先ずはHTML5 boile
PHPでは、error_reportingの設定により出力するメッセージを変更可能ですが、PHP5.4からE_ALLにE_STRICTが含まれるようになりました。 通常、E_ALLからE_STRICTを除いてエラーを出力したい場合、php.iniで error_reporting = E_ALL & ~E_STRICT とすることで制御可能になります。 エラーレベルについては、マニュアル参照 http://www.php.net/manual/ja/errorfunc.constants.php 但し、CakePHPでは、フレームワーク中でerror_reportingを定義している為、php.iniの設定が反映されません。 その設定が、 cakephp/lib/Cake/bootstrap.php の error_reporting(E_ALL & ~E_DEPRECATED); で設定
Sassは知っていたけれど、 いちいちコンパイルするほど大規模サイトやらないし、と思って使っていませんでしたが。 そんなついつい黒い画面を避けちゃうあなたに朗報、 なCodeKitの存在を知って早速(っていうか今頃)導入してみました。 導入の流れをおさらいします。 0. そもそも何それ? SassはCSSの入力を構造的にし、変数などを使ってより書きやすくしてくれるツールです。 Rubyで出来ていますが、Rubyを知らなくても使えます。 CompassはSassを拡張し、より便利にしてくれるツールです。 というわけでWebのフロントをやる人にはとてもステキなツールなのですが、 いかんせんコマンドラインベースなので Sassのファイルを書く→保存する→コンパイルする→ブラウザで見る という流れが CSSを修正→Codaで即確認 という流れよりもどうしても助長に感じてしまう 小規模サイト開発者(
peclのssh2ライブラリを導入すると、WordpressでsFTP経由の自動アップデートが出来が利用可能になります。 まずlibssh2のインストール。 # wget http://surfnet.dl.sourceforge.net/sourceforge/libssh2/libssh2-1.0.tar.gz # tar -zxvf libssh2-1.0.tar.gz # cd libssh2-1.0/ # ./configure # make # make install libssh2のインストールが出来たらpecl-ssh2のインストール pecl install -f ssh2 /etc/php.iniで、 extension=ssh2.so を有効化し、Apacheの再起動 /etc/init.d/httpd restart で完了。 これで、プラグイン、テーマ、word
このページを最初にブックマークしてみませんか?
『Photosynthesic blog』の新着エントリーを見る
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く