> ## Documentation Index
> Fetch the complete documentation index at: https://moengage.com/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# プッシュテンプレート

> Notification Content Extension を使用して、iOS アプリにカスタムプッシュ通知テンプレートを追加します。

Notification Content Extension を使用すると、展開モードでの通知の外観をカスタマイズできます。ダッシュボードでテンプレートを使用してキャンペーンを作成する方法については、[こちら](https://www.moengage.com/docs/user-guide/campaigns-and-channels/mobile-push/create/push-templates)のリンクを参照してください。

![Pushtemp1](https://mintcdn.com/moengage/Jtvf10ggM77HdKvB/images/pushtemp1.gif?s=7390182b986c633c0d03a28e6071c268)

> [!NOTE]
>
> **前提条件**
>
> 以下の手順に進む前に、プロジェクトでリッチプッシュをサポートするための [App Target](https://www.moengage.com/docs/developer-guide/ios-sdk/push/basic/ios-push-integration-tutorial#step-1-implement-notification-service-extension-nse) と [Notification Service Extension](https://www.moengage.com/docs/developer-guide/ios-sdk/push/basic/ios-push-integration-tutorial#Optional) の実装が完了していることを確認してください。

Notification Service Extension は、テンプレートで使用される画像、音声、または動画をダウンロードします。転送、形式、サイズの要件については、[メディア要件](/docs/ja/developer-guide/ios-sdk/push/basic/ios-push-integration-tutorial#media-requirements)を参照してください。

# 手順:

これらのカスタムプッシュテンプレートをサポートするには、プロジェクトに Notification Content Extension が必要です。以下の手順に従って Content Extension を作成し、MoEngage テンプレートをサポートするように設定します。

## 1. Notification Content Extension を作成する

![Pushtemp2](https://mintcdn.com/moengage/Jtvf10ggM77HdKvB/images/pushtemp2.png?fit=max\&auto=format\&n=Jtvf10ggM77HdKvB\&q=85\&s=0df3ab46ac4cfa8b7b3bf775bcfc867c)

ターゲットが作成されたら、プロンプトが表示された際に Extension のスキームをアクティブにします。

![Pushtemp3](https://mintcdn.com/moengage/Jtvf10ggM77HdKvB/images/pushtemp3.png?fit=max\&auto=format\&n=Jtvf10ggM77HdKvB\&q=85\&s=8f99bc4aceec5496218a0e3bf6c2eddd)

これで拡張機能がプロジェクトに追加され、作成時に指定した拡張機能名のクラスと、それに関連付けられた .plist ファイルが表示されます。

## 2. デプロイメントターゲットを設定する

デプロイメントターゲットをメインアプリのターゲットと同じに設定します。

## 3. 必要な Capabilities を追加する

Capabilities セクションで **App Groups** を追加し、App ターゲットと Notification Service Extension ターゲットで構成したものと同じ App Group ID を選択します。

![Pushtemp4](https://mintcdn.com/moengage/Jtvf10ggM77HdKvB/images/pushtemp4.png?fit=max\&auto=format\&n=Jtvf10ggM77HdKvB\&q=85\&s=f1301bb83c9974f83505b653097719ef)

メインターゲットでの App Group ID の設定の詳細については、[ドキュメント](https://www.moengage.com/docs/developer-guide/ios-sdk/push/basic/ios-push-integration-tutorial#step-1-implement-notification-service-extension-nse)の **Set AppGroup ID** セクションを参照してください。

## 4. Info.plist の変更

![Pushtemp5](https://mintcdn.com/moengage/Jtvf10ggM77HdKvB/images/pushtemp5.png?fit=max\&auto=format\&n=Jtvf10ggM77HdKvB\&q=85\&s=0f0ea7a822e7a51b3de8129957941e64)

上記のように Notification Content Extension の `Info.plist` を変更し、NSExtensionAttributes を以下のように設定します。

| 属性 | 属性値 |
| :- | :- |
| UNNotificationExtensionCategory | MOE\_PUSH\_TEMPLATE |
| UNNotificationExtensionInitialContentSizeRatio | 1.2 |
| UNNotificationExtensionDefaultContentHidden | YES |
| UNNotificationExtensionUserInteractionEnabled | YES |

> [!NOTE]
>
> **注意**
>
> 宣言したカテゴリに応じて、UNNotificationExtensionCategory を必要な値に更新してください。

## 5. Storyboard の変更

以下のように、Content Extension の ***MainInterface.storyboard*** を選択し、配置されているデフォルトのラベルを削除して、ビューの背景色をクリアカラーに設定します。

![Pushtemp6](https://mintcdn.com/moengage/Jtvf10ggM77HdKvB/images/pushtemp6.png?fit=max\&auto=format\&n=Jtvf10ggM77HdKvB\&q=85\&s=c1e511eb6a3802ad16828789eb3a10bc)

## 6. MoEngageRichNotification の統合

### Swift Package Manager による統合(推奨)

SPM で統合するには、SDK バージョン 9.23.0 以上の場合は GitHub URL [https://github.com/moengage/apple-sdk.git](https://github.com/moengage/apple-sdk.git) を、それ以外の SDK バージョンの場合は [https://github.com/moengage/MoEngage-iOS-SDK.git](https://github.com/moengage/MoEngage-iOS-SDK.git) を使用し、ブランチを master または必要なバージョンに設定します。

### CocoaPod による統合

> [!NOTE]
>
> **情報**
>
> CocoaPods は非推奨になりつつあります。MoEngage では、すべての新規統合に Swift Package Manager を使用することを推奨しています。CocoaPods の詳細については、[CocoaPods 統合ガイド](https://www.moengage.com/docs/developer-guide/ios-sdk/sdk-integration/basic/integration-through-cocoa-pods)を参照してください。

CocoaPod で統合する場合は、以下のように Notification Content Extension に **MoEngageRichNotification** pod を含め、pod update / install コマンドを実行します。

```ruby Ruby wrap theme={null}
target "NotificationContent" do
	pod 'MoEngage-iOS-SDK/RichNotification',
end
```

> [!NOTE]
>
> **手動統合**
>
> * MoEngageRichNotification SDK をプロジェクトに手動で統合するには、こちらの[ドキュメント](https://www.moengage.com/docs/developer-guide/ios-sdk/manual-integration/manual-integration)に従ってください。
> * App ターゲットの埋め込みバイナリに MoEngageRichNotification を追加し、Notification Content Extension ターゲットにリンクされていることを確認してください。

## 7. Content Extension のコード変更:

```swift Swift wrap theme={null}
import UIKit
import UserNotifications
import UserNotificationsUI
import MoEngageRichNotification
  
class NotificationViewController: UIViewController, UNNotificationContentExtension {
    override func viewDidLoad() {
        super.viewDidLoad()
        // Set App Group ID
        MoEngageSDKRichNotification.setAppGroupID("Your App Group ID")
    }
  
    
    func didReceive(_ notification: UNNotification) {
        // Method to add template to UI
        MoEngageSDKRichNotification.addPushTemplate(toController: self, withNotification: notification)
    }
}
```

```objective-c Objective C wrap theme={null}
#import "NotificationViewController.h"
#import <UserNotifications/UserNotifications.h>
#import <UserNotificationsUI/UserNotificationsUI.h>
@import MoEngageRichNotification;

@interface NotificationViewController () <UNNotificationContentExtension>

@end

@implementation NotificationViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    // Set App Group ID
    [MoEngageSDKRichNotification setAppGroupID:@"Your App Group ID"];
}

- (void)didReceiveNotification:(UNNotification *)notification {
    // Method to add template to UI
    [MoEngageSDKRichNotification addPushTemplateToController:self withNotification:notification];
}

@end
```

上記のように、***NotificationViewController*** クラスで以下の変更を行います。

1. ***viewDidLoad()*** メソッドで、Capabilities で有効にしたものと同じ App Group ID を設定します。
2. [*addPushTemplate(toController:withNotification:)* ](https://moengage.github.io/ios-api-reference/Classes/MoEngageSDKRichNotification.html#/c:@M@MoEngageRichNotification@objc\(cs\)MoEngageSDKRichNotification\(cm\)addPushTemplateToController:withNotification:)メソッドを呼び出して、***didReceiveNotification()*** コールバックでテンプレートを追加します。

## 8. アプリでの通知クリックコールバック:

Simple Image Carousel 通知の場合、ユーザーがどのスライドをクリックしたかを知るには、`MOMessagingDelegate` を使用して `notificationClicked(withScreenName: andKVPairs:)` コールバックを取得し、クリックされたスライドに設定されているキーと値のペアおよびスクリーン名を取得します。以下の例を参照してください。ここでは AppDelegate でコールバックを登録しています。

```swift Swift wrap theme={null}
class AppDelegate: UIResponder, UIApplicationDelegate, UNUserNotificationCenterDelegate, MoEngageMessagingDelegate{
    
func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool {
      // Set the delegate 
      MoEngageSDKMessaging.sharedInstance.setMessagingDelegate(self)
 
      //Rest of the implementation
}
 
// Notification Clicked Callback
func notificationClicked(withScreenName screenName: String?, andKVPairs kvPairs: [AnyHashable : Any]?) {
        if let screenName = screenName {
            print("Navigate to Screen:\(screenName)")
        }
        
        if let actionKVPairs = kvPairs {
            print("Selected Action KVPair:\(actionKVPairs)")
        }
}
  
// Notification Clicked Callback with Push Payload
func notificationClicked(withScreenName screenName: String?, kvPairs: [AnyHashable : Any]?, andPushPayload userInfo: [AnyHashable : Any]) {
        
        print("Push Payload: \(userInfo)")
        
        if let screenName = screenName {
            print("Navigate to Screen:\(screenName)")
        }
        
        if let actionKVPairs = kvPairs {
            print("Selected Action KVPair:\(actionKVPairs)")
        }
}
}
```

```objective-c Objective C wrap theme={null}
@interface AppDelegate () <UNUserNotificationCenterDelegate, MoEngageMessagingDelegate>
@end
 
@implementation AppDelegate
 
 
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
    // Set the delegate 
   [[MoEngageSDKMessaging sharedInstance] setMessagingDelegate:self forAppID:@"YOUR_WORKSPACE_ID"];
 
    //Rest of the implementation
}
 
// Notification Clicked Callback
-(void)notificationClickedWithScreenName:(NSString *)screenName andKVPairs:(NSDictionary *)kvPairs{
    if (screenName) {
        NSLog(@"Screen Name : %@",screenName);
    }
    if (kvPairs) {
        NSLog(@"KV Pairs : %@",kvPairs);
    }
}
 
// Notification Clicked Callback with Push Payload
-(void)notificationClickedWithScreenName:(NSString *)screenName KVPairs:(NSDictionary *)kvPairs andPushPayload:(NSDictionary *)userInfo{
    NSLog(@"Push Payload: %@",userInfo);
    if (screenName) {
        NSLog(@"Screen Name : %@",screenName);
    }
    if (kvPairs) {
        NSLog(@"KV Pairs : %@",kvPairs);
    }
}
 
 
@end
```


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.