WooCommerceログアウトページのショートコードを作成する方法

公開: 2020-08-22

WooCommerceログアウトページのショートコードを作成 WooCommerceサイトのどこでも使用できるWooCommerceログアウトページのショートコードを作成しますか? WooCommerceのログアウトページのショートコードで実際に機能する簡単な例を探している場合、この例を使用すると、これを実行する方法を簡単に理解できます。

ショートコードを使用すると、WooCommerceストアの所有者は、コーディングせずに、または最小限のコーディングスキルでサイトをすばやくカスタマイズすることが容易になります。

今日は、 WooCommerceのログアウトページのショートコードを作成してサイトのどこにでも展開し、ボタンを1回クリックするだけでユーザーがログアウトできる、すばやく簡単ですばらしい方法を紹介します。

いつものように、ストアのテーマにコードを簡単に追加できるようにするために、コードがどのように機能するかを段階的に説明します。 あなたが新しいWordPress開発者または新人のWooCommerce開発者である場合

WooCommerceログアウトエンドポイント

デフォルトでは、WooCommerceは、ログアウトURLの作成に使用できるログアウトのデフォルトエンドポイントをユーザーに提供し、以下の画像で共有されているWooCommerce設定でアクセスできます。

WooCommerceログアウトエンドポイント

この記事– WooCommerceエンドポイントのカスタマイズで説明されているように、このエンドポイントを好みに合わせてカスタマイズできます。

WooCommerceログアウトエンドポイントの他に、WooCommerce URLをカスタマイズするために使用できるエンドポイントがいくつかあり、それらにはチェックアウトページとマイアカウントページのエンドポイントが含まれます。

チェックアウトエンドポイント

次のエンドポイントは、チェックアウト関連の機能に使用され、/ checkoutページのURLに追加されます。

  • 支払いページ– /order-pay/{ORDER_ID}
  • 受注(ありがとう)– /order-received/
  • 支払い方法の追加– /add-payment-method/
  • 支払い方法の削除– /delete-payment-method/
  • デフォルトの支払い方法を設定する– /set-default-payment-method/

アカウントエンドポイント

次のエンドポイントはアカウント関連の機能に使用され、/ my-accountページのURLに追加されます。

  • 注文– /orders/
  • 注文の表示– /view-order/{ORDER_ID}
  • ダウンロード– /downloads/
  • アカウントの編集(およびパスワードの変更)– /edit-account/
  • アドレス– /edit-address/
  • お支払い方法– /payment-methods/
  • パスワードを紛失した– /lost-password/
  • ログアウト– /customer-logout/

WooCommerceログアウトページのショートコードを作成する

WooCommerceログアウトエンドポイントを使用してユーザーをログアウトし、ショートコードボタンにコードを追加します。

WooCommerceのログアウトエンドポイントは– /customer-logout/ URL attribute =trueを追加して、ログアウトボタンで使用するログアウトURLを作成します。

完全なURL構造は次のようになりますsite_url/?logout-endpoint=true

WooCommerceログアウトショートコードを作成する

これまでにWordPressまたはWooCommerceショートコードを作成したことがない場合は、WordPressショートコードの作成方法を学ぶのに役立つ優れたガイドを作成しました。 –ここでチェックしてください。

ここで、WooCommerceログアウトページのショートコードを段階的に作成しましょう。

  • ステップ1ログアウトページのショートコードのアクションフック関数とコールバック関数を作成します– fまたは例として、次のように作成できますadd_shortcode( 'wc_logout_shortcode', 'njengah_wc_logout_shortcode' ); 。 コールバック関数は、次のように作成することもできfunction njengah_wc_logout_shortcode(){ }
  • ステップ2:このチュートリアルで共有したコードを使用してユーザーがログインしているかどうかを確認する–ユーザーがWordPressにログインしているかどうかを確認する方法: if (is_user_logged_in())
  • ステップ3:ログアウトURL変数を作成し、次のようにWooCommerceエンドポイントからビルドできます: $wc_shortcode_logout_url = site_url() . '/?customer-logout=true'; $wc_shortcode_logout_url = site_url() . '/?customer-logout=true';
  • ステップ4:ボタンコードを作成し、クラスを追加して、WooCommerceテーマの配色に合わせてすばやくスタイルを設定できるようにします。 <button class="wc_logout_shortcode_btn"><a href="<?php echo $wc_shortcode_logout_url; ?>">Log Out</a></button>
  • ステップ5:このコードをまとめて、 functions.phpファイルを介してテーマにコードを追加するか、カスタムWooCommerceプラグイン開発にコードを含めることができます。 ショートコードをfunctions.phpwoocommerceに追加します
  • ステップ6:ページまたは投稿の任意の場所でショートコード[wc_logout_shortcode]テストするか、ショートコードをサポートするWordPressウィジェットでさえテストすると、ショートコードを追加する場所にWooCommerceログアウトボタンが表示されます。

以下は、functions.phpに追加してWooCommerceログアウトページのショートコードを作成できる完全なコードスニペットです。

 / **
 * WooCommerceログアウトページのショートコードボタンを追加
 * /

//ショートコードアクションフック 

add_shortcode( 'wc_logout_shortcode'、 'njengah_wc_logout_shortcode');

// 折り返し電話 

関数njengah_wc_logout_shortcode(){
	
    ob_start();
    //ユーザーがログインしているかどうかを確認します 
    if(is_user_logged_in()){ 
          // url変数を作成します 
	   $ wc_shortcode_logout_url = site_url()。 '/?customer-logout = true';?>
	    <button class = "wc_logout_shortcode_btn"> <a href="<?php echo $wc_shortcode_logout_url;?> ">ログアウト</a> </ button> 
        <?php 
	}

    ob_get_clean();を返します。
}

これで、下の画像に示すように、ショートコードを新しいページまたは投稿に追加してテストできます。フロントエンドにボタンが表示されます。

woocommerceログアウトページのショートコード

ページのWooCommerceログアウトショートコードボタンをテストする

最後に、フロントエンドでログアウトボタンをテストし、下の画像に示すように機能するかどうかを確認する必要があります。 すべての手順を実行した場合、WooCommerceのログアウトショートコードは以下の例に示すように機能するはずです。

woocommerceログアウトショートコードの例

結論

この投稿では、WooCommerceのログアウト機能のショートコードを作成する方法を紹介しました。 確認メッセージがポップアップせずにログアウトしたい場合は、WooCommerceのログアウト確認メッセージを削除する方法についての優れたガイドを作成しました。

簡単にまとめると、WooCommerceログアウトショートコードを作成するには、デフォルトのWooCommerceログアウトエンドポイントを利用する必要があります。 このエンドポイントURLを任意の変数に変更してコードに追加することもでき、それが機能します。

同様の記事