86223
投稿ページにてチェックボックスにチェックを入れたら表示という設定を「来館予約と資料請求」の両方表示だったものを個々に設定できるようにカスタムフィールドにて1つずつに修正し、下記HTMLも１つのものを2つに変更しましたが、来館予約の部分だけ文字で表示されます。  
改善点を教えていただけませんでしょうか。

担当エンジニアが現在事情で稼働できず簡易な修正のみやっている素人が質問しておりますので情報不足でしたら申し訳ございません。

【元のデータ】

```

    <?php $value = get_post_meta($post->ID, 'show', true);?>
     <?php if(empty($value)):?>
     <?php else:?>
     
     <div class="chapel-reserve">
      <div class="btm-reserve">
       <ul>
        <li><a href="/reservation/?post_id=<?php echo get_the_ID();?>"><span>来店予約をする</span></a></li>
        <li><a href="/inquiry/?post_id=<?php echo get_the_ID();?>"><span>資料請求をする</span></a></li>
       </ul>
       <div style="display: none;"><?php echo get_field('show'); ?></div>
      </div>
     </div><!--reserve-->
     <?php endif;?>
    
```

【書き換えたコード】

```

     <?php $value = get_post_meta($post->ID, 'show', true);?>
     <?php if(empty($value)):?>
     <?php else:?>
     
     <div class="chapel-reserve">
       <ul>
        <li><a href="/reservation/?post_id=<?php echo get_the_ID();?>"><span>来店予約をする</span></a></li>
       </ul>
       <div style="display: none;"><?php echo get_field('show'); ?></div>
      </div>
     </div><!--reserve-->
     <?php endif;?>
    
     <?php $value = get_post_meta($post->ID, 'show2', true);?>
     <?php if(empty($value)):?>
     <?php else:?>
     
     <div class="btm-reserve">
       <ul>
        <li><a href="/inquiry/?post_id=<?php echo get_the_ID();?>"><span>資料請求をする</span></a></li>
       </ul>
       <div style="display: none;"><?php echo get_field('show2'); ?></div>
      </div>
     </div><!--reserve-->
     <?php endif;?>
    
```

こちらが表示される画面です。資料請求と同じデザインで表示させたいです。

[![こちらが表示される画面です。資料請求と同じデザインで表示させたいです。](https://i.stack.imgur.com/oFNZ6.png)](https://i.stack.imgur.com/oFNZ6.png)

[![元々のコードで表示されていたデザインです。](https://i.stack.imgur.com/3cvKq.png)](https://i.stack.imgur.com/3cvKq.png)

追記<divを2つずつ設置したコード

```

         <?php $value = get_post_meta($post->ID, 'show', true);?>
     <?php if(empty($value)):?>
     <?php else:?>
    
    <div> 
     <div class="chapel-reserve">
       <ul>
        <li><a href="/reservation/?post_id=<?php echo get_the_ID();?>"><span>来店予約をする</span></a></li>
       </ul>
       <div style="display: none;"><?php echo get_field('show'); ?>
     </div><!--reserve-->
     <?php endif;?>
    
     <?php $value = get_post_meta($post->ID, 'show2', true);?>
     <?php if(empty($value)):?>
     <?php else:?>
     
    <div>
     <div class="btm-reserve">
       <ul>
        <li><a href="/inquiry/?post_id=<?php echo get_the_ID();?>"><span>資料請求をする</span></a></li>
       </ul>
       <div style="display: none;"><?php echo get_field('show2'); ?>
     </div><!--reserve-->
     <?php endif;?>
    
```

css ファイル

```

    @charset "utf-8";
    /* CSS Document */
    
    .eo-venue-combobox-select{display: none;}
    #eo-all-day,
    #eo-end-time,
    #eo-start-time,
    #eo-start-date,
    #eo-end-date{pointer-events: none;}
    
    img.acf-image-image{width: 150px;height: auto;}
    
```

[![片方に寄ってしまった今の状況](https://i.stack.imgur.com/pROmf.png)](https://i.stack.imgur.com/pROmf.png)
CC BY-SA 4.0
2022-02-08T10:37:33.977
86205
2022-02-09T04:53:08.660
2022-02-09T04:53:08.660
51327
51327
question
php html
カスタムフィールドにて設定したチェックボックスの条件分岐での表示について
【元のデータ】では, 以下のように並んでいます

```

    <div class="chapel-reserve">
      <div class="btm-reserve">
       <ul>
    
```

**仮に** それぞれの `div`を "《" と "｛" と置き換えると少し分かりやすいかもしれないので表現すると

  * 【元のデータ】では

《｛ 来館予約, 資料請求 ｝》

  * 【書き換えたコード】では

《 来館予約 》》  
｛ 資料請求 ｝》

  * そうではなく, この様に記述してはどうか？ … ということ

《｛ 来館予約 ｝》  
《｛ 資料請求 ｝》

CSSでどの様に設定してるかにより, 実際に望むように表示されるかどうかは不明だけれど, このような記述で可能かもしれない, ということです  
(【<divを2つずつ設置したコード】では `class=` 属性が取り除かれている)

```

    <?php $value = get_post_meta($post->ID, 'show', true);?>
     <?php if(empty($value)):?>
     <?php else:?>
     
     <div class="chapel-reserve">
      <div class="btm-reserve">
       <ul>
        <li><a href="/reservation/?post_id=<?php echo get_the_ID();?>"><span>来店予約をする</span></a></li>
       </ul>
       <div style="display: none;"><?php echo get_field('show'); ?></div>
      </div>
     </div><!--reserve-->
     <?php endif;?>
    
     <?php $value = get_post_meta($post->ID, 'show', true);?>
     <?php if(empty($value)):?>
     <?php else:?>
     
     <div class="chapel-reserve">
      <div class="btm-reserve">
       <ul>
        <li><a href="/inquiry/?post_id=<?php echo get_the_ID();?>"><span>資料請求をする</span></a></li>
       </ul>
       <div style="display: none;"><?php echo get_field('show'); ?></div>
      </div>
     </div><!--reserve-->
     <?php endif;?>
    
```

* * *

CSS 内に `.chapel-reserve` や `.btm-reserve` に関する記述があるはずで  
色付けや(もしあれば)相関関係が記されているはずです

HTMLの(上記の)修正でもうまく表示できないようであれば CSS見直す必要があります
CC BY-SA 4.0
2022-02-09T04:02:36.377
86223
2022-02-09T04:02:36.377
43025
86205
answer