2024-01-01から1年間の記事一覧

WP カスタムフィールドを別のページで使う

固定ページのIDを取得し、the_fieldで指定する ID; ?> フロントページの場合

WP 固定ページ コンテンツエディター非表示

WordPress固定ページ編集画面のコンテンツエディターを非表示にする方法 すべての固定ページ編集画面 コンテンツエディターを非表示にするには、テーマのfanctions.phpに以下のように記述します。 add_filter('use_block_editor_for_post',function($use_blo…

WP カスタム投稿一覧での条件分岐

複数のカスタム投稿があり、一覧を作りたい時にarchiveで使う条件分岐 現在の投稿タイプが"chairman"かどうか 下記の記事を参考にさせて頂きました。 カスタム投稿タイプで使えるの条件分岐 #WordPress - Qiita

WP テンプレートファイルでメディア画像を読み込む場合

wp-content/uploadディレクトリまでのパスを取得する方法 画像を使いまわす際に、wp-content/uploadフォルダに画像を入れておいた方が、テーマフォルダに画像を入れておくよりも管理が楽だったりします。 その際、画像のURLをベタ打ちするよりも、下記のよう…

WP contact form7 確認画面の作成

1.確認画面を固定ページで作成 2.問い合わせのアクションのリダイレクトを確認画面に変更 3.「Contact Form 7 Multi-Step Forms(プラグイン)」をインストール 4.問い合わせの複製をして、確認画面用のフォームを作成 5.ショートコードを確認画面に貼り付け…

css オープンシャッター

css

html <div class="shutter"> <span class="logo"> <img src='<?php echo get_template_directory_uri(); ?>/img/mark.svg' alt=''> </span> </div> scss //------------------------------------------------------------------- // オープンシャッター //------------------------------------------------------------------- .shu…

inviewで順番に表示させるjs

$(function() { $('.js-inview').on('inview', function(event, isInView) { if (isInView) { $(this).find('li').each(function(i) { $(this).delay(100 * i).queue(function() { $(this).addClass('js-showed ').dequeue(); }); }); } }); }); qiita.com

円がぐにょぐにょ動くアニメーション(HTML/SVG)

css

switch.am

css スクロールバーのデザイン

css

.f-news { &__list { height: 500px; overflow-y: scroll; &::-webkit-scrollbar-thumb { background: #82c582; border-radius: 8px; border-right: 4px solid transparent; /* 透明なボーダーをつける */ border-left: 4px solid transparent; /* 透明なボ…

WP ACF PDFを表示させる

PDF Image GeneratorプラグインをインストールしてUP 下記から最新をダウンロード PDF Image Generator – WordPress plugin | WordPress.org ACFのファイルの戻り値は配列で設定をします テンプレートファイルに記述 'lunch_post', 'posts_per_page' => 1, …

WP カスタム投稿で1件目だけ表示を変えたいとき

'lunch_post', 'posts_per_page' => -1, 'order' => 'DESC', 'tax_query' => array( array( 'taxonomy' => 'lunch_cat', 'terms' => array('kashinomi'), 'field' => 'slug' ), ), ); $the_query = new WP_Query($args); ?> have_posts()) : while ($the_qu…

イラレ 線の太さを変える

線の幅を変更する - Illustratorの操作方法・使い方 | iPentec

ACF サブフィールドのショートコードを表示させる

一度、get_sub_field()でショートコードを取得し、echo do_shortcode($s);で表示させる

CSS同系色の文字をめだたせるテキストシャドウ

css

https://codepen.io/namho/pen/jEaXra

youtubu全幅で表示

css

<section id="home"> <div class="video-box overlay"> <div id="yt_player"></div> <div class="player-overlay"></div> </div> </section> JS footerに入れる ※mKM62XwyNjE は動画ID、入れる動画によって変えて <script> // YouTube APIの読み込み var tag = document.createElement('script'); tag.src = "https://www.youtube.com/iframe_api"; v…

css ページ内リンクズレ解消

css

よくある下記でページ内リンクのズレ解消が出来ない時は要素の上に空要素を追加して非表示にする #service { display: block; visibility: hidden; width: 100%; height: 100px; } #service { padding-top: 100px; margin-top: -100px; }

WP localでエラーが出る場合

「NONCE_SALT constant is missing from the wp-config.php file」というエラーは、WordPressの設定ファイル「wp-config.php」に「NONCE_SALT」定数が含まれていないことを示しています。 このエラーは、WordPressのセキュリティを強化するために使用される…

Gogle driveでPDFから文字を抽出

pdf.wondershare.jp

WP single.phpで特定のカテゴリ除外したpagenation(サムネ付き)

<nav class="page-nav"> <div class="prev-link"> ID)) : // 前の投稿に画像があ…</div></nav>

WP 年月のアーカイブをカテゴリで絞る方法

sidebar.phpに下記を記載する $cat_slug, 'posts_per_page' => -1 ); $archive_query = new WP_Query($args); while ($archive_query…

WP 特定のページにbasic認証をつける(カスタムフィールドでパスワードを設定)

ACFでオプションページの設定 functions.php にオプションページの記載をする if( function_exists('acf_add_options_page') ) { acf_add_options_page(array( 'page_title' => 'テストオプションページ', 'menu_title' => 'テストオプションページ', 'menu_…

WP スマートスライダーの高さ変更

.n2-ss-slide-backgrounds { height: 80vw !important; }

カスタム投稿の表示

'interview', 'posts_per_page' => -1, ) ); ?> have_posts()) : ?> have_posts()) : $query->the_post(); ?> <p><a href="<?php the_permalink(); ?>"></a></p>

JS 時間差で一回だけ実行する

https://www.javadrive.jp/javascript/webpage/index4.html

WP ACF PROで繰り返しの使い方

<div> <h3>メニュー</h3> <dl> <dt></dt> <dd>円</dd> </dl> </div> ACF PROの繰り返しフィールドの基本的な使い方と応用方法を紹介します | …

WP ギャラリー

プラグイン名:Responsive Lightbox & Gallery タイトルはクリックしないと表示されないので、上の画像の通りLightboxタグでタイトルには何を出すかを選択した後に、 jsで制御します。 $(".rl-gallery-item").each(function () { let title = $(this).find("…

WP RSSで表示する

1つ目:Simple Pieを利用する 2行目のfeedurlには、RSSのURLを入れます。 そして、WordPressの関数、fetch_feed()に渡すことで、アイテムを取得してくれますので、ループで表示を行います。 get_item_quantit…

WP カスタム投稿 個別ページのパンクずリスト

<nav id="breadcrumbs"> <ul> <li><a href="<?php echo home_url(); ?>">HOME</a></li> <li class="separator">&nbsp;&gt;&nbsp;</li> <li> term_id, 'menu_cat', array( 'separator' => '<…</li></ul></nav>

CSS 画像をマスクで切り抜き

css

<div class="masked"></div> .masked { width: 100px; height: 100px; background-color: #8cffa0; -webkit-mask-image: url(star.svg); mask-image: url(star.svg); mask-repeat: no-repeat; mask-position: 0 0; mask-size: 100%; } 変幻自在なグラフィック表現!CSS, SVG, Canvasで…

WP ショートコードをテンプレートファイルで使う

ショートコードをWPの管理画面ではなく、phpなどのテンプレートファイルで使いときは下記を使います。 WordPress テーマの PHP テンプレート上でショートコードを呼び出す方法