かんた🌊SWELLマニア

IT業界歴22年 / WordPressでWebサイト制作する仕事しています 。 no…

かんた🌊SWELLマニア

IT業界歴22年 / WordPressでWebサイト制作する仕事しています 。 noteではWordPressのカスタマイズを紹介しています。XでもWeb制作者のリアルな情報発信をしております。ぜひフォローよろしくお願いします。 https://webrent.xsrv.jp/

マガジン

最近の記事

  • 固定された記事

【SWELL】ヘッダーの右上に電話番号・問い合わせボタンを追加表示するカスタマイズ方法

※2023年11月24日追記 SWELL最新バージョン(2.8.1)でも有効です。 WordPress有料テーマの「SWELL」のカスタマイズについてです。 企業サイトを作っていると、ヘッダーの右上部分に電話番号や営業時間を入れて欲しいといった要望を受けることがあります。 クライアントにヒアリングしてみると、以下の画像のような要望が多いなと感じます。 【企業サイト制作でよくある要望】 ・電話番号 ・営業時間 ・問い合わせフォーム SWELLの機能だけでこのレイアウト

¥10,000
    • 【SWELL】目次のタイトルを特定の記事や固定ページだけ変更するカスタマイズ方法

      SWELLマニアのかんた(@swell_mania)です。 WordPressテーマ「SWELL」のカスタマイズ備忘録をシェアします。今回は、コンテンツエリアに表示される「目次のタイトル」を特定のページだけ変更する方法です。 カスタマイザー上からは設定できない? 目次のタイトルはカスタマイザー上で任意の文字列に指定可能ですが、サイト内で共通です。個別の記事や固定ページごとに変更するオプションはカスタマイザー上にはありません。 本記事では「特定の記事だけ」「固定ページだけ

      • 【SWELL】LPにコメント欄を表示するカスタマイズ

        SWELLマニアの かんた(@swell_mania)です。 今回はWordPressテーマSWELLのLPページにコメント欄を表示する作業メモです。 標準だとSWELLのLP機能で作成したページにコメント欄は表示されません。カスタマイズでLPにコメント欄を付けてみたので備忘録を残します。 サンプルサイト →サンプルサイトを開く サンプルサイトの環境 LPにコメント欄を表示したサンプルサイト構成についてです。 【環境】 WordPress:6.5.4 SWE

        ¥4,980
        • 【JIN:R】コピーライトを編集する方法

          WordPressテーマJIN:Rのフッターカスタマイズメモです。 JIN:Rのフッターにはデフォルトでコピーライトが表示される仕様になっています↓ コピーライト部分は「(C)+西暦 + サイトのタイトル」というフォーマットなんですが、この部分はカスタマイザーから表示内容を変更できません。 (C)と西暦を外し、かつサイトのタイトルではない任意の文字列を表示させるカスタマイズを実装してみました。 本来だと 「(C)2024 サイトのタイトル」となる部分を、 「JIN:R

          ¥4,980
        • 固定された記事

        【SWELL】ヘッダーの右上に電話番号・問い合わせボタンを追加表示するカスタマイズ方法

        ¥10,000

        マガジン

        • SWELL
          76本
        • JIN
          14本
        • Cocoon
          5本
        • GOLD BLOG
          2本
        • Arkhe
          9本
        • Lightning
          4本

        記事

          CocoonのPVをSWELLに移設した作業メモ

          WordPressテーマをCocoonからSWELLに移行した工程の作業メモです。 こんにちは、SWELLマニアのかんた(@swell_mania)です。 仕事がらWordPressのテーマ乗り換え作業をする機会が多々あります。 その中で、切り替え前のテーマで使用していた一部データをテーマ切り替え後に再利用したいという要望を受けることがあります。 今回はCocoonで作成した記事のPVをSWELLのPVにコピーした作業備忘録をシェアします。 コピペで5秒で終わる

          ¥5,980

          CocoonのPVをSWELLに移設した作業メモ

          ¥5,980

          【SWELL】リッチカラムで画像を上にはみ出すカスタマイズ方法

          WordPressテーマSWELLのリッチカラムブロックのアレンジについてす。 ちょっとだけ独自のカスタマイズを加えて、オシャレなサイトに仕上げたい人向けです。 【パターン①】番号ちょいズレ →デモサイトを開く リッチカラムの上部に、罫線の上に重なるように番号を表示させるカスタマイズです。 【パターン②】画像ちょいズレ →デモサイトを開く リッチカラムから上部に画像をはみ出すカスタマイズです。ちょっと遊び心のあるデザインです。 【パターン①】背景+画像ちょいズ

          ¥5,980

          【SWELL】リッチカラムで画像を上にはみ出すカスタマイズ方法

          ¥5,980

          【GOLD BLOG】ヘッダー右上に電話番号+問い合わせボタンを表示するカスタマイズ

          WordPressテーマGOLD BLOGを使い、コーポレートのデモサイトを作成してみました。 →デモサイトを開く ヘッダーに電話番号と営業時間、問い合わせ系のボタンリンクを設置する独自カスタマイズをしてみました。 ファーストビューに電話番号や問い合わせボタンを設置することで、サイト訪問者がスムーズに問い合わせができるコーポレート系定番のレイアウト構成です。 本記事ではGOLD BLOGのヘッダー右上に、問い合わせ関連の情報を表示させるカスタマイズ方法をシェアします。

          ¥9,890

          【GOLD BLOG】ヘッダー右上に電話番号+問い合わせボタンを表示するカスタマイズ

          ¥9,890

          【GOLD BLOG】背景に固定動画を設定する方法

          最近リリースされたWordPressテーマ「GOLD BLOG」のカスタマイズメモです。 GOLD BLOGは絞り込み検索機能が付いている珍しいテーマ。 色々調べながらデモサイトを作りつつ勉強しています。 最近制作したデモサイトで背景に固定動画を設置するカスタマイズをしてみました↓ →デモサイトを開く サンプルサイトの構成 よりシンプルな構成にしたサンプルサイトを用意しました。GOLD BLOGを有効化した時点からのカスタマイズ方法をシェアします。 →サンプルサイト

          ¥6,980

          【GOLD BLOG】背景に固定動画を設定する方法

          ¥6,980

          【WordPress】埋め込み動画から「ダウンロード」を無くすカスタマイズ

          SWELLマニアのかんた(@swell_mania)です。 今回は、特定のテーマではなくWordPressコアブロックの1つ「動画ブロック」のカスタマイズについての記事になります。 動画ブロックで埋め込んだ動画は、標準の仕様だと「ダウンロード」というオプションが表示されます↓ このボタンだけでなく、動画上で右クリックを押しても、ダウンロードできてしまう仕様です↓ 名前の通りなんですがダウンロードをクリックすると、ユーザーが動画を自身の環境に保存できる仕組みになっていま

          【WordPress】埋め込み動画から「ダウンロード」を無くすカスタマイズ

          【SWELL】カスタム投稿のアーカイブページにブログパーツを設置しエディターで編集可能にする

          SWELLのカスタム投稿のアーカイブページのタイトル下に、ブログパーツを設置した作業メモです。 下記の画像の「対象スペース」部分です↓ →サンプルサイトを開く アーカイブページにブログパーツを配置することで、クライアントが自由に編集できるようにするのが目的です。 SWELLのカテゴリーのアーカイブにはブログパーツを設置できる機能があるんですが、カスタム投稿でもそれっぽいカスタマイズができないか調べた結果、テンプレートを編集しないでも実装できることが分かりました。 サ

          ¥5,980

          【SWELL】カスタム投稿のアーカイブページにブログパーツを設置しエディターで編集可能にする

          ¥5,980

          【SWELL】VK Filter Searchのフォームをモーダルで開くカスタマイズ

          SWELLマニアのかんた(@swell_mania)です。 SWELLとVK Filter Search Proを使ったカスタマイズの備忘録です。 VK Filter Search Proの絞り込み項目が多いと、当然ながらページが縦長になります。 デザインをスッキリさせたいと思い、絞り込み検索フォームをモーダルに格納しました。以下、サンプルサイトです↓ →サンプルサイトを開く トリガーとなるボタンをクリックすると、モーダルが表示される仕組みです。 開いたモーダルの「

          ¥10,000

          【SWELL】VK Filter Searchのフォームをモーダルで開くカスタマイズ

          ¥10,000

          【SWELL】2カラム化 | 左側に固定サイドバーを設置するカスタマイズ方法

          ※2024年4月7日更新しました。 WordPressテーマSWELLで「2カラムデザインにしつつ、左側に固定メニュー」を表示するカスタマイズを実装してみました。 →「和風なサイト」を開く ブレイクポイントは1,100px。 PCなどで閲覧時には、上記画像の通り左側に固定メニューが表示される仕様です。 サンプルサイト 解説用にシンプルなサンプルサイトを用意しました↓ →サンプルサイトを開く サンプルサイトの構成 【バージョン】 WordPress:6.5.2

          ¥6,980

          【SWELL】2カラム化 | 左側に固定サイドバーを設置するカスタマイズ方法

          ¥6,980

          【SWELL】リッチカラムを固定化しオシャレなパーツを作る方法

          SWELLマニアのかんた(@swell_mania)です。 WordPressテーマ「SWELL」のリッチカラムブロックを使ったオシャレなカスタマイズを紹介します↓ 2つカラム項目を並べて、片側を固定化するとアッという間にオシャレなパーツができてしまいます! 今回はこのオシャレかつ実用的なデザインの作り方をシェアします。 難易度は個人的にかなり低めだと思いますので、ぜひチャレンジしてみてください。 サンプルサイトの構成 【バージョン】 WordPress:6.4

          ¥6,980

          【SWELL】リッチカラムを固定化しオシャレなパーツを作る方法

          ¥6,980

          解決アプローチと注意事項について

          SWELLマニアのかんた(@swell_mania)です。 僕が紹介する有料記事部分内では、カスタマイズ方法だけでなく、ちょっとしたアレンジ方法やカスタマイズが上手く行かない場合の解決アプローチを記事の後半で紹介しています。 トラブルシューティングはおよそ共通なアプローチがあるので本記事にまとめておきます。 ちなみに記事内で紹介しているカスタマイズは、テスト環境上で動作確認した後、本番環境に実装するのがおすすめです。 基本的に、記事執筆時に利用可能な最新バージョンのW

          解決アプローチと注意事項について

          【SWELL】半透明な固定サイドバーを表示するカスタマイズ

          2023年12月4日更新 WordPressテーマSWELLで半透明な固定のサイドバーを配置してみました。SNSアイコンやナビゲーションになるアイコンを並べると、SWELLじゃないみたいに変化しました! →このサイトを開く 本記事では半透明でオシャレな固定サイドバーの作り方を紹介します。 ちなみに対象のサイドバーは下記画像内、右側にある赤線内エリアのことでです↓ サンプルサイト カスタマイズ解説用のサンプルサイトを用意しました↓ →サンプルサイトを開く トップペー

          ¥7,980

          【SWELL】半透明な固定サイドバーを表示するカスタマイズ

          ¥7,980

          【SWELL】LPのURL「LP」を別のディレクトリー名に変更するカスタマイズ方法

          WordPressテーマSWELLのカスタマイズ作業メモです。 SWELLにはLP(ランディングぺージ)を作成する専用のカスタム投稿機能が標準搭載されています。 標準の投稿や固定ページとは完全に分離しているので、LPが管理しやすいし仕組みです。 LP投稿で作成するURLは特に指定を変更しない限り次の通りです。 ドメイン名/lp/lp_01 ドメイン名/lp/lp_02 ドメイン名とページ名の間に「/lp/」というディレクトリー名が付きます。 本記事ではこのlp部

          ¥6,980

          【SWELL】LPのURL「LP」を別のディレクトリー名に変更するカスタマイズ方法

          ¥6,980