Hiroshi AOKI

WooCommerceの使い方

• 2020.08.11
• WordPress

 WordPressプラグイン「WooCommerce」は、ECサイトを作るための代表的なプラグインです。 この記事ではWooCommerceを使い、商品の登録や税の設定、決済方法の設定など、ユーザーがショッピングを行えるようになるまでの最低限の使い方を解説します。 WooCommerceとは Woo …

Contact Form 7による問合せフォーム作成

• 2020.08.04
• WordPress

 サイトを閲覧しているユーザーとコミュニケーションをとるための機能として問い合わせフォームを設置したいという要望は、サイトを作る際、もしくは運用している際に自然に考えることだと思います。 しかし実際に問い合わせフォームを自力で設置しようとする場合、フォームの見た目をだけではなく裏側で動く仕組みを作り、 …

レスポンシブサイト用ブレイクポイント考察！時代に適するサイズとは？

• 2019.07.19
• CSS
• レスポンシブ

 こんにちは、開発チームの青木です。普段はレスポンシブと同様のマルチデバイス対応を実現する「GeneCode（ジーンコード）」に携わっています。今回は、レスポンシブサイト用のブレイクポイントについてお話していきます。 2019年発売のスマホ端末の状況も鑑みて、今年の適切なブレイクポイントは480px/ …

レスポンシブ対応ページの簡単な作り方！導入部分を解説します。

• 2019.07.17
• HTML
• レスポンシブ

 こんにちは、開発チームの青木です。普段はレスポンシブと同様のマルチデバイス対応を実現する「GeneCode（ジーンコード）」に携わっています。 今回は、レスポンシブ対応ページの簡単な作り方についてお話していきます。 ウェブページをどう手を加えればレスポンシブ対応したことになるのでしょうか。これにはい …

レスポンシブ対応のためのJavaScriptによる2つの切替手法

• 2019.07.17
• JavaScript
• レスポンシブ

 こんにちは、開発チームの青木です。普段はレスポンシブと同様のマルチデバイス対応を実現する「GeneCode（ジーンコード）」に携わっています。 今回は、レスポンシブ対応のためのJavaScriptによる2つの切替手法についてお話していきます。 レスポンシブウェブデザインのページで、CSSではメディア …

レスポンシブの画像切り替えができるsrcset属性

• 2019.07.12
• HTML
• レスポンシブ

 こんにちは、開発チームの青木です。普段はレスポンシブと同様のマルチデバイス対応を実現する「GeneCode（ジーンコード）」に携わっています。 今回は、レスポンシブの画像出し分けを適切に行うことができるsrcset属性についてお話していきます。 レスポンシブデザインのウェブサイトで使用される画像につ …

レスポンシブ対応メニューを作るための簡単なCSSライブラリ Bulma

• 2019.07.10
• CSS
• レスポンシブ

 こんにちは、開発チームの青木です。普段はレスポンシブと同様のマルチデバイス対応を実現する「GeneCode（ジーンコード）」に携わっています。 本記事はBulmaを用いたナビゲーションメニューバーの作成方法についてのご紹介となります。 もちろんPC表示、スマホ表示で見た目が変わるレスポンシブデザイン …

CSS グリッドレイアウトでレスポンシブ対応

• 2019.07.10
• CSS
• レスポンシブ

 こんにちは、開発チームの青木です。 普段はレスポンシブと同様のマルチデバイス対応を実現する「GeneCode（ジーンコード）」に携わっています。 本記事は比較的新しい機能であるCSS Grid Layoutのご紹介をいたします。 CSS Grid Layoutとは、floatやflexboxと異なり …