はにわまん

環境

webpackでEJSをコンパイルする方法

webpackでEJSをコンパイルする方法です!「Sassの出力をファイルを分離してCSSファイルを作成する」のように、webpackはHTMLファイルを生成することも可能となっています。 webpa…

はにわまん
環境

webpackで画像を圧縮する方法

webpackで画像を圧縮する方法です。流れとしては、公開用フォルダに移動させてそちらのファイルを圧縮するといった形となります。 拡張させるだけの簡単作業なのでぜひ取り入れて見てください! なお、we…

はにわまん
環境

【コーダー向け】webpackでSassをコンパイルする方法

webpackでSassをコンパイルする方法です。webpackはHTMLコーダーにあまり優しくない印象(偏見)がありましたが、結論から言うとやりたいことは十分にやらせてくれます。 具体的に実際にやっ…

はにわまん
WordPress

GutenbergのブロックをAdvanced Custom Fields的に使ってみる

Gutenbergにはテンプレート機能があり、利用するブロックを制限することが可能です。このテンプレート機能を使うことで、「Advanced Custom FieldsAdvanced Custom …

はにわまん
WordPress

webpackの基本的な使い方!最小構成で動作を試してみよう

webpackの基本的な使い方です。似たようなものにgulpがありますが、違いとしては以下のような認識です。 gulp・・・タスクランナー webpack・・・ビルドツール 利用者の属性で分けるなら、…

はにわまん
WordPress

Gutenbergにオリジナルなブロックを作成する方法(動的編)

テキスト等を入力、編集できるブロックを作成する方法です。ブロックの基本的な使い方については以下の記事で紹介しているので、まずはこちらを参考にしてください。 Gutenbergにオリジナルなブロックを作…

はにわまん
WordPress

Gutenbergにオリジナルなブロックを作成する方法(静的編)

Gutenbergにオリジナルなブロックを作成する方法です。公式のチュートリアルを参考にしながら、以下のようなpタグで囲まれた固定値のブロックを作っていきます。 汎用性は無いかもしれませんが、作り方の…

はにわまん
WordPress

WordPressで簡単メールマガジン!「Subscribe2」プラグインの使い方

WordPressでおそらく最もシンプルにメールマガジンを設置できる「Subscribe2」プラグインの紹介です。 投稿時に自動メールから、任意のタイミングでの一括送信など、シンプル設計で簡単に操作で…

はにわまん
WordPress

WordPressでAJAX通信する方法

WordPressでAJAX通信する方法です。WordPressの場合はアクション先のURLがあらかじめ決まっていて、fucntions.phpからフックすることによって実態の処理を実行するといった流…

はにわまん
CSS

【魔法のvw】画像のように拡大・縮小するレスポンシブを実現させるCSSの書き方

ウインドウ幅に連動して画像のように拡大・縮小するレスポンシブを実現させるCSSの書き方の紹介です。 特にPCとスマホの間の「よしな」に表現するときの強い見方となるので、覚えておいて損はありません! ウ…

はにわまん
1 2 33