コード– category –
-
TailWind CSSを使ってタブでコンテンツの切り替えをする
TailWind CSSはユーティリティファーストでレイアウトを少し変更したい場合などとても便利です。 しかし、TailWind CSSを使ってコンポーネント作る場合は、たくさんのクラスを組み合わせる必要があり、Bootstarapなどに比べると難易度が上がってしまいます... -
WordPressにカスタム投稿を作る
WordPressにカスタム投稿を作成する方法は プラグインを使うコードを使う の2通りあります。 この記事ではカスタム投稿をコードを使って追加する方法を紹介します。 プラグインでカスタム投稿を追加する場合は「Custom Post Type UI」プラグインをインスト... -
【時間を節約】tailwind CSSで爆速開発のためのツール集
tailwind CSSが大人気ですね！ 単一責任の原則でCSSの管理から解放されます。 tailwind CSSはユーティリティファーストなのでボタンを装飾するのにもたくさんのクラスをつける必要があります。 慣れていないとクラス名を調べる回数が多くなり、時間がかか... -
コピーボタンでテキストをコピー
ボタンをクリックするとクリップボードに対象のテキストをコピーするコピーボタン機能を紹介します。 今回はHTMLとjQueryを用いてテキストをコピーします。 コードをコピーして使用する場合はBootstrapなどのCSSできれいにして使ってください。 また、clip... -
shopifyで在庫以上に注文できてしまう
shopifyでは在庫以上に注文できてしまう場合があります。その場合は在庫が赤文字でマイナスと表示されます。 なぜこのようなことがおきるのか、原因と解決策をご紹介します。 【原因】 原因は購入者が外部決済サービスを利用しているからです。 shopifyの... -
DjangoでURLのGETパラメータをModelFormの初期値にする
【やりたいこと】 ModelFormで表示しているフォームにURLのGETパラメータを初期値として表示したい 【サンプルコード】 viewからformに渡す CreateViewを継承したクラスでModelFormにデータを渡すにはget_form_kwargsを使います。 get_form_kwargs() ここ... -
New schema is incompatible with the current setting value.
セクションのschemaを変更したら次のようなエラーが出た。 New schema is incompatible with the current setting value. Setting 'cols' must be a string.New schema is incompatible with the current setting value. エラーは 新しいスキーマ... -
twitterでブログ記事のサムネイルが表示されない
【wordpress とtwitterを連携】 twitterでブログ記事のサムネイルを表示させるにはwordpressとtwitterを連携して、wordpress側で設定する必要があります。 こちらの記事でwordpress とtwitterを連携をわかりやすく説明されています。 WordPress と Twitter... -
ワードプレスに容量の大きいPNG画像を上げるとJPGに変換される問題
【直したいこと】 容量の大きいPNG画像をメディアを通じてアップロードすると画像がJPGに勝手に変換されるので、この変換を止めたい。 【解決方法】 wp-config.phpに以下を追加 /** EWWW Image Optimizerプラグインが容量の大きいPNG画像をJPGに変換するの... -
【shopify】コレクションをタブで切り替えて表示
【完成形】 このようにコレクションをタブで切り替えてを表示したい。 【サンプルコード】 jsでイベントをフックするクラスはjs-*と命名しています。 既存のテンプレートをカスタマイズしやすいようにCSSはtailwindcssを使っています。 お使いのshopifyテ...
