kdcsライブラリー

お気に入りボタンで、お気に入りに追加した時に「お気に入りに追加」、お気に入りから外した時に「お気に入りを削除」といったメッセージを画面に出す方法。

メッセージはcssで画面下部に設定、初期値display:noneで非表示。javascriptのjQuery「.fadeIn()」でdisplay: blockになり表示する。（表示時間をセットして、しばらく表示したら消えるという動き）
html

<div id="favoriteList"><div class="favoriteBox"><span class="favoriteMessage"></span><p class="favoriteText"><a href="<?php echo home_url(); ?>/favorite">お気に入りリストを見る</a></p></div></div>

javascript

$(function () {
  var timer = false;

  // Favorites 更新後イベント
  $(document).on('favorites-updated-single', function(event, favorites, post_id, site_id, status, button){

    // status は 'active' or 'inactive'
    if (status === 'active') {
      $('.favoriteMessage').text('アイテムを追加しました');
    } else {
      $('.favoriteMessage').text('アイテムを削除しました');
    }

    // 表示処理
    $('#favoriteList').fadeIn();

    if (timer !== false) {
      clearTimeout(timer);
    }

    timer = setTimeout(function () {
      $('#favoriteList').fadeOut();
    }, 5000);
  });
});

css

#favoriteList {
    display: none;
    width: 100%;
    position: fixed;
    bottom: 0;
    background: #fff;
    padding: 14px 0;
    opacity: 0.9;
    z-index: 100;
}

お気に入りを付けるプラグイン「Favorites」のバージョン2.3.3では、表示設定でカスタムマークアップを選択し、「お気に入り未設定・お気に入り済み」をそれぞれボタンのマークアップhtmlで設定できた。（但し、実際にはfooter.phpに直接javascriptを記述したのでここでの設定は無関係になる）

Favorites2.3.3での設定記述
◆Button Markup: Unfavorited（お気に入りされていない）

<span>お気に入り</span><i class="fa icon-heart-empty"></i>

◆Button Markup: Favorited（お気に入り済み）

<span>お気に入り</span><i class="fa icon-heart"></i>

Favorites2.3.6では、設定記述を行うとちゃんと入力されない
そこで、そもそもここの設定記述は無関係なので空白にしておく
※何も入力しないと何故か上手く設定が保存できないので、それぞれに半角スペースを入れて保存する

WordPress 6.9.4とFavorites2.3.6での検証では2.3.3から行っているfooterの記述でそのまま行ける事を確認済み
※このfooter.phpへの記述にオプション設定が含まれる（ハートの色付けのcssも）

footer.php

<?php /* お気に入りオプション設定・スクリプトここから------------------------------------- */ ?>
<script>
var favorites_data = {"ajaxurl":"<?php echo home_url(); ?>/wp-admin/admin-ajax.php","nonce":"cb6b8ba573","favorite":"<span>\u304a\u6c17\u306b\u5165\u308a<\/span><i class=\"fa icon-heart-empty\"><\/i>","favorited":"<span>\u304a\u6c17\u306b\u5165\u308a<\/span><i class=\"fa icon-heart\"><\/i>","includecount":"","indicate_loading":"","loading_text":"Loading","loading_image":"","loading_image_active":"","loading_image_preload":"","cache_enabled":"1","button_options":{"button_type":"custom","custom_colors":true,"box_shadow":false,"include_count":false,"default":{"background_default":false,"border_default":false,"text_default":false,"icon_default":"#666666","count_default":false},"active":{"background_active":false,"border_active":false,"text_active":false,"icon_active":"#dd3333","count_active":false}},"authentication_modal_content":"<p>Please login to add favorites.<\/p><p><a href=\"#\" data-favorites-modal-close>Dismiss this notice<\/a><\/p>","authentication_redirect":"","dev_mode":"","logged_in":"1","user_id":"1","authentication_redirect_url":"https:\/\/localhost\/wp540-bjfx\/wp-login.php"};
</script>
<script src='<?php echo home_url(); ?>/wp-content/plugins/favorites/assets/js/favorites.min.js?ver=2.3.2'></script>
<?php /* お気に入りオプション設定・スクリプトここまで------------------------------------- */ ?>

Theme My Loginは会員サイト用のログインページを作ってくれるプラグインだが、6系から7系で大きく変わり、ほぼ有料版でないと機能しない状態になっている。旧6系を使っているとphp8.1以上で「Deprecated 警告」が出る（wordpressデバッグモード）ので応急処置で対応。

Deprecated 警告

Deprecated:  parse_str(): Passing null to parameter #1 ($string) of type string is deprecated in C:\xampp\htdocs\wp662-xxxx\wp-content\plugins\theme-my-login\includes\class-theme-my-login.php on line 745

これに該当する箇所を修正する

修正後

parse_str( parse_url( $url, PHP_URL_QUERY ) ?? '', $query );

修正前

parse_str( parse_url( $url, PHP_URL_QUERY ), $query );

advanced custom fieldsでテキストエリアの内容をリストタグで出力する方法

<?php
// ACFのフィールド名を指定
$text = get_field('your_field_name');

if ($text) {
    // 改行で分割（Windows環境なども考慮して\r\nも含める）
    $lines = preg_split('/\r\n|\r|\n/', $text);

    echo '<ul>';
    foreach ($lines as $line) {
        // 空行を除外し、余分な空白を除去してエスケープ
        if (trim($line) !== '') {
            echo '<li>' . esc_html(trim($line)) . '</li>';
        }
    }
    echo '</ul>';
}
?>

「preg_split(‘/\r\n|\r|\n/’, $text)」：改行コードの違いに対応（Windows, macOS, Linux）

「trim($line) !== ”」：空行を除外

「esc_html()」：HTMLエスケープで安全に出力

「ul」タグでリスト化

Advanced Custom Fieldsのテキストエリアをテーブルとして使う方法

PHP 8.3では、null を文字列関数に渡すことが非推奨になっているので「null チェック」を入れる必要がある

テーブルはthとtdの2列だけで、行は何行になってもOK。thとtdの値は半角の@（アットマーク）で区切る
※当初：（コロン）で区切っていたが時間表示でコロンが使われる可能性があるので＠に変更した

<?php
// データを取得（nullの可能性がある）
$field = get_field('catering_option') ?? '';

// 連続した改行を1つの改行にまとめる
$field = preg_replace('/(\n|\r|\r\n)+/us', '\n', $field);
// もし全角の：があれば半角の:に変換する
$field = str_replace('＠', '@', $field);

// 1行ごとに<tr>、「＠」で<th>と<td>に区切る
echo '<table>
    <tr>
        <th>' .
        str_replace(
            array('\n', '@'),
            array('</td></tr><tr><th>', '</th><td>'),
            $field
        ) .
        '</td>
    </tr>
</table>';
?>

これに以下の処理を追加
・＠を付けない行はテーブルのセルtdを結合する処理を行う（colspan=”2″）
・結合したtdにclass=”td_comment”を付ける
・空の行は無視する

<?php
$field = get_field('catering_info') ?? '';
$field = preg_replace('/(\n|\r|\r\n)+/us', "\n", $field);
$field = str_replace('＠', '@', $field);

$lines = explode("\n", $field);
echo '<table>';
foreach ($lines as $line) {
    $line = trim($line);
    if ($line === '') {
        continue;
    }

    echo '<tr>';
    if (strpos($line, '@') !== false) {
        list($th, $td) = explode('@', $line, 2);
        echo '<th>' . htmlspecialchars($th) . '</th>';
        echo '<td>' . htmlspecialchars($td) . '</td>';
    } else {
        // class="td_comment" を追加
        echo '<td colspan="2" class="td_comment">' . htmlspecialchars($line) . '</td>';
    }
    echo '</tr>';
}
echo '</table>';
?>