トップ
サービス
事例
コラム
会社概要
お問い合わせ
トップ
サービス
事例
コラム
会社概要
お問い合わせ
Column
コラム
TOP
コラム一覧
年:
2023年
の一覧
カテゴリーから探す
CSS
EC
Tips
WordPress
アーカイブから探す
2023年
2022年
2021年
2015年
2023.01.30
CSS
明奈
レスポンシブなフォントサイズに設定できるCSSのclamp()関数が便利
clamp()関数とは clamp()関数には最小値、推奨値、最大値の3つの値を設定することができ、その中の条件に合うものが適用されます。 フォントサイズや横幅をスマートフォン用にいちいち設定しなくても、幅に合わせて最適なサイズにしてくれます。 clamp(最小値,推奨値,最大値) 推奨値:要素の大きさ最小値と最大値の間である限り推奨値が適用 最小値:最も小さい値で、推奨値が
READ MORE
2023.01.27
CSS
明奈
重なった要素の後側にリンクを効かせる方法
今回は、pointer-eventsプロパティを使用して、重なった要素の後側にリンクを効かせる方法を紹介します! また、下記の記事のではスマートフォン、タブレットのみに効かせる方法としても紹介しました! 気になる方は併せてご覧ください! HTMLで電話番号のリンクを設定する方法 – スマートフォンのみの設定方法も紹介 pointer-eventsプロパティとは ホバーやクリックなどのマ
READ MORE
2023.01.24
Tips
明奈
Flexbox の右側に出来る余白を子要素に振り分ける方法
Flexboxで要素を横並びにした際、子要素の幅が短いと右側に余白ができます。 この余白は、flex-growプロパティで、子要素に振り分ける事ができます。 flex-growとは Flexを使用した、親要素の余白を子要素に追加するプロパティです。[フレックスアイテム(子要素)の伸び率を指定するプロパティです。] まずは、Flexで要素を横並びにし、その子要素に[flex-grow
READ MORE
2023.01.23
CSS
明奈
SwiperとCSSを使用し、スライダーの背景画像をズームしながらふわっと切り替えする方法
今回は、JavaScriptライブラリ「Swiper」とCSSを使用し、背景画像をズームしながらふわっと切り替えるスライドショーを作成したいと思います。 まずは実装デモがこちら。 デモ内[Result]の[Run Pen]をクリックしてください。 See the Pen Untitled by 林 (@hayashi-akina) on CodePen.
READ MORE
2023.01.20
Tips
明奈
HTMLで電話番号のリンクを設定する方法 – スマートフォンのみの設定方法も紹介
今回は、HTMLで電話番号のリンクを設定する方法を紹介します。 電話番号のリンクを設定するとどうなる? リンクを設定した場所をタップするだけで直接電話を発信することができるようになるため、ユーザーにとって使いやすいサイトになります。 電話番号のリンク設定方法は? 設定は簡単です。[a href=""]に[tel:]を入れるだけです。 ※番号は任意の番号を入れてください。ハイフンはなしでも
READ MORE
Tips
Reina
Podioの構成|リモートワークには必須、プロジェクト管理ツール「Podio」とは?
オートプロジェクトが利用しているプロジェクト管理ツール「Podio」。 リモートワークには必須、プロジェクト管理ツール「Podio」とは? Podioは下記の構成で成り立っています。 Podioを構成する3つの要素、「ワークスペース」「アプリケーション」「トピック」の各役割は、以下のようになっています。 ワークスペース こちらで参加メンバーの管理を行います。
READ MORE
2023.01.18
CSS
明奈
CSSのみで文章の行数を指定し、省略する方法
以前、[text-overflow]を使用して文章を省略する方法を書きましたが、この場合ですと、一行のみで行数を指定して省略することはできません。 行数を指定したい場合は、CSSの[line-clamp]が便利です。 line-clampとは [line-clamp]は、文章を指定した行数に制限することができるプロパティになります。 また、[line-clamp]は拡張機能を実装するベ
READ MORE
2023.01.13
WordPress
みわ
WordPress|Meta Keyがなくてもカスタムフィールドの値でソートさせる方法
WordPressでカスタムフィールドでソートしたい場合、下記の方法が一般的です。 $args = array( 'post_type' => 'post', 'meta_key' => 'メタキー', 'orderby' => 'meta_value_num', 'order' => 'DESC' ); ただ、この方法だと過去記事に meta_key
READ MORE
2023.01.12
Tips
Reina
リモートワークには必須、プロジェクト管理ツール「Podio」とは?
オートプロジェクトでは、プロジェクト管理ツールとしてCitrix Systems, Inc.が提供する「Podio」を利用しています。 [caption id="attachment_1714" align="aligncenter" width="800"] Citrix Podio[/caption] Podioの公式ページは英語ですが、実際に利用するサービスでは日本語が用意され
READ MORE
EC
みわ
独自性の高いカートシステムが作れるWordPressプラグイン「WooCommerce」のメリットとは?
WooCommerce(ウーコマース)は、WordPressにインストールすることでECサイトを開設することができる無料のプラグインです。 WooCommerce – WordPress プラグイン | WordPress.org 日本語 WooCommerceのメリットとしてまず挙げられるのが、「高いカスタマイズ性」です。 たとえば、こちらの商品ページ。 G-SQUARE アイウェア
READ MORE
1
2
>