ブログ一覧
-
【CSS/JAVA】予約ボタンを表示させたい
.reserve { position: fixed; bottom: 20vh; right: 0; writing-mode: vertical-lr; text-orientation: mixed; background-color: #AD3814; color: #fff; padding: 20px 10px; font-size: 20px; font-weight: bold; cursor: pointer; z-index: 999 !import... -
【Arkhe】投稿リストの日付を横並びにしたい
.arkhe-svg-posted{ display: none; } .p-postList__body{ display: flex; align-items: center; } .p-postList__times time{ color: #c39e81 !important; font-size: 1rem; font-weight: bold; margin-right: 20px; } .p-postList .p-postList__title{ li... -
【SWELL】投稿リストの日付をおしゃれに表示したい
.icon-posted::before { display: none; } .news-list .p-postList.-type-simple{ border-top:none; } .news-list .-type-simple .p-postList__link{ border-bottom:none; } .news-list .p-postList__body { display: flex; align-items: center; gap: 1em... -
【Arkhe】投稿ページの見出しにだけデザインを付けたい
.single h2:not(.section-title2):not(.c-bottomSection__title) { padding: 1rem 2rem; border-top: 6px double #000; border-bottom: 6px double #000; } .single h3 { padding: 1rem 2rem; border-left: 4px solid #000; } -
「codoc(コードク)」導入時のレイアウト調整メモ
こんにちは!今回は、WordPressで有料記事を実現できるプラグイン「codoc(コードク)」を導入した際に起きたレイアウト崩れの解決方法についてシェアします。 有料記事の行間が詰まって見える問題が発生 実際に有料記事を書いてみると、購入者から見ると... -
【CSS】文字の左に横線を引く方法
備忘録で、文字の左に横線をひくCSSを残します。 .left-line { position: relative; } .left-line::before { content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 20vh; /* 線の長さ */ height: 1px; bac... -
【Arkhe】スライダーを画面いっぱいに表示するCSSカスタマイズ(アルケー)
Arkheのスライダーを画面いっぱいに表示されるようにしたい… .ark-block-slider.height .ark-block-slider__inner { height: 100vh; } -
【Arkhe】ヘッダーメニューにホバーすると白い下線が引かれるCSSカスタマイズ(アルケー)
ホバーで白い下線が引かれるようにしたい、、、 WordPressテーマ「Arkhe(アルケー)」では、デフォルト設定でヘッダーメニューにホバーするとテーマのメインカラーにフォントカラーが変更されるようになっています。 今回は、ヘッダーメニューにホバーす... -
【Arkhe】カテゴリーラベルの色を変更
/* 元々のラベルのパディングや色を削除 */ .p-postList__category, .c-postTerms__item { background: none; position: relative; padding: 0; } /* spanの方をボタン形状にする */ .p-postList__category span, .c-postTerms__item a { display: inline-... -
【Arkheカスタマイズ】スマホメニュー上部にロゴ画像を表示させる方法【簡単PHPコード付き】
スマホ開閉メニューの上部に画像を入れてみたい・・・ WordPressテーマ「Arkhe(アルケー)」は、シンプルで使いやすく、カスタマイズ性にも優れています。今回は、スマホ用ドロワーメニューの上部に画像(例:ロゴ)を挿入する方法をご紹介します。 「メ... -
【Contact form7】メールアドレスの確認入力欄を作る
Contact Form7で、メールアドレスを入力してもらう際に、間違いがないように確認用入力欄を作ることが出来ます。 私は以下のブログ記事を参考に作成することが出来ました! -
【SWELL】固定ページのサブタイトルの線とスペースを消したい
サブタイトルのデザインをカスタマイズしたい・・・ WordPressの人気テーマ「SWELL」では、固定ページのサブタイトルを設定することができ、自動的にページタイトルの右側に設定されます。 配置や文字の大きさはCSSでカスタマイズ可能ですが、サブタイトル...