Gutenberg で作る目次ブロック

gc44c9481f806e87b018ccaaa19eda94d0b9533f91989f711227e5aff28f32ad30c93502a4a9e9b26f3c6e29ada2823d3_1280-820390.jpg

私たちの運営する他のサイトの目次ブロックはエレメンタープロを使用しています。アストラとエレメンター、どちらもプロにすれば出来ることが格段と増えます。また、プラグインを追加すれば苦労せず目次ブロックが追加できます。ですがお […]

アストラの画像エフェクト(後編)

gc7af128b86ba5ba8bf18fd84d7964d9c1ba43f3a9ad4c68e6f1e06629029b6acf9da5c2a945a44651f9f8b4e3bb7dac1e82fbf164318ba2a5bcbab565dd2a926_1280-2587864.jpg

まず初めに。このサイトはワードプレス初心者のために、無料テーマ「アストラ」を使ったサイト製作についてお話をしています。基本的に初心者向けの解説となっていますのでご了承ください。 こちらがショップページのデザインとなります

アストラの画像エフェクト(前編)

gc7af128b86ba5ba8bf18fd84d7964d9c1ba43f3a9ad4c68e6f1e06629029b6acf9da5c2a945a44651f9f8b4e3bb7dac1e82fbf164318ba2a5bcbab565dd2a926_1280-2587864.jpg

このサイトはアストラの無料版で作っています。そしてプラグインをあまり使わないということにもこだわっています。プラグインを追加したり、アストラをプロにすれば出来ることも増えると思います。ですが、お金を一切かけずにプラグイン

CSS のコピペで簡単!見出しデザインの変更

pexels-photo-8755303-8755303.jpg

このホームページもだいぶ完成に近付きました。最初からの経緯を知らない方にサクッと説明します。このサイト自体がアストラとエレメンターのためのテストサイトです。サイトの作成には無料アイテムしか使っていません。 なので、サイト

ブロックエディターの使い方「初心者向け」

g64e27a9dc4080021ea37bbfa717a78595a1e0acf318a13bb5fcf2d6d8ed0058ad2d407985e177147d2d0defad32c0adbba81c466fd00fd14a68d175545d64d9d_1280-4582023.jpg

最初に。この記事は編集初心者向けに書いております。まず、この記事を読んでから次のステップに進むと分かりやすいと思います。 今回の記事は、ブロックエディターを使ったワードプレスの投稿作成方法です。この記事で言うブロックエデ

テーブル(表)のスマホ表示

pexels-photo-13676494-13676494.jpg

前回書いたテーブルデザインの記事。その時作ったテーブルはスマホ表示でも2カラムです。これをパソコンでは2カラム、スマホでは1カラムで表示するよう変更します。 画像1が投稿した時点のテーブルデザインです。パソコンでの表示は

テーブル(表)カスタマイズ

pexels-photo-6353746-6353746.jpg

Gutenberg はデフォルトで追加できるブロックにテーブルがあります。しかしそのデザインは選んだテーマによって変わります。テーマによっては表が見にくかったり、サイトのデザインに合わないことも少なくありません。 この章

タブ付き情報ボックスの作成

pexels-photo-5731905-5731905.jpg

ブロック編集(Gutenberg)のみでタブ付きの情報ボックスを作ります。手順は親ブロック(グループ)を作り、子ブロックとして段落を2段積みにするだけの簡単なものです。 この記事の目次 グループの作成 説明画像1は親ブロ

CSS で簡単!タイトルデザインの変更

g7cae2f64ea0ad1ceba3d97db9c35227deae993fa7f82bf4d936d8a09d085139b024ef1b50132680dbdc75d13dc2ebeeebdd5f1b30cfe62699fe8f2481019ee2f_1280-1868496.jpg

ワードプレスを触っていて最初に躓くこと。それはタイトルや見出しなどのデザイン変更ではないでしょうか? コピペだけで簡単と書かれた見出しのカスタマイズサイトはたくさんあります。ただその記載通り「h2」と書いてしまうと大変で

画像に枠線を付けるTIPS

pexels-photo-3949100-3949100.jpg

最初に結論からお話します。Gutenberg の成長により画像に枠線が付けられるようになりました。念のため説明しますと Gutenberg はワードプレス標準のブロックエディターです。プラグインの必要はありません。プラグ

お買い物カゴ
上部へスクロール