# How to use Pop-up

![](https://support.swing2app.com/wp-content/uploads/2018/10/Pop-up.png)

**▶ What is a pop-up?**

When launching the app, a new image window is displayed to show app notifications and events.\
Swing2App provides pop-up services, and you can apply pop-ups to your app by selecting from a variety of styles.

![](https://support.swing2app.com/wp-content/uploads/2018/10/%EC%98%81%EB%AC%B8%ED%8C%9D%EC%97%851.png)

<mark style="color:red;">\*Pop-ups are not available for push and web view prototypes.</mark>

<mark style="color:red;">This function is only available in the Slide, Top, Footer, and Drop menus.</mark>

Please check the manual on how to apply the pop-up.

### <mark style="color:blue;">**Go to the pop-up management page**</mark>

1. Click on the **Manager.**
2. Go to **Services.** A drop-down list will open.
3. Click on **Pop-ups.**

![](https://support.swing2app.com/wp-content/uploads/2018/10/Popup3-1.png)

Swing2App has 4 pop-up styles.

Please create your pop-ups.

![](https://support.swing2app.com/wp-content/uploads/2018/10/Pop2.png)

Below, we’ll try applying pop-ups for each style.

### <mark style="color:blue;">**1.First Pop-up style**</mark>

The first pop-up style is to create a pop-up by placing one image.

You can link to the image to go to that page.

![](https://support.swing2app.com/wp-content/uploads/2018/10/Popup4.png)

1. Please select checkbox
2. Select the first pop-up style.
3. Click on ‘+’ on the phone screen and select the image that you need to use for the pop-up.

\*Please observe the recommended resolution. (1024 \* 1920 px)

![](https://support.swing2app.com/wp-content/uploads/2018/10/Popup5.png)

When the image is registered, the image link set-up window will appear.

The link image setting is the function to move to the linked page when selecting the pop-up image.

You can choose where to link to websites, pages within apps, bulletin boards, posts, file attachments, etc.

4\. Click on **Link Wizard.** The **Link Wizard** screen will open. Select the options like Weblink, Swing function, Bulletin board, etc., where you need to link the pop-up.\
5\. Click on **Reflect.**\
6\. Click on **Apply Link.**\
7\. Click **Save** to complete.

**\*If there is no link to connect, click on ‘No link”**

**\*You can change and delete the image with ‘Change’ and ‘Delete’ buttons.**

<mark style="color:blue;">**\[App Launch screen – Launch pop-up]**</mark>

![](https://support.swing2app.com/wp-content/uploads/2018/10/%EC%98%81%EB%AC%B8%ED%8C%9D%EC%97%851.png)

<mark style="color:blue;">**\[Check the animated image]**</mark>

![](https://support.swing2app.com/wp-content/uploads/2018/10/%EB%85%B9%ED%99%94_2020_05_09_16_59_58_116.gif)

When you launch the app, you can see the pop-up screen.

The image you applied to the pop-up is shown as a large image.

### <mark style="color:blue;">**2. Second pop-up style**</mark>

**In the second pop-up, three images are registered. Slide to see the images.**

This can be used when you need to show various image pop-ups.

![](https://support.swing2app.com/wp-content/uploads/2018/10/%EC%A0%9C%EB%AA%A9-%EC%97%86%EC%9D%8C-2-2.png)

The application method is the same as the first method.\
The second style requires 3 images to be registered, so please prepare an image to be applied to the pop-up in advance.

<mark style="color:blue;">**\[Launch Pop-up Screen – Launch pop-up]**</mark>

![](https://support.swing2app.com/wp-content/uploads/2018/10/%EC%98%81%EB%AC%B8%ED%8C%9D%EC%97%852.png)

<mark style="color:blue;">**\[Check the animated image]**</mark>

![](https://support.swing2app.com/wp-content/uploads/2018/10/%EB%85%B9%ED%99%94_2020_05_09_17_48_44_507.gif)

This is the app launch screen with pop-ups applied.

Slide the pop-up image to see other pop-up images.

### <mark style="color:blue;">**3. Third popup style**</mark>

The third style is a split-screen style where images are displayed both at top and bottom on the screen\
The pop-up image is registered in two spaces.

![](https://support.swing2app.com/wp-content/uploads/2018/10/Popup7.png)

**Click the ‘+’ icon to register the image.**

You need to register 2 images, top, and bottom. Please observe the recommended resolution.

<mark style="color:blue;">**\[Launch App Screen – Launch Pop-up]**</mark>

![](https://support.swing2app.com/wp-content/uploads/2018/10/%EC%98%81%EB%AC%B8%ED%8C%9D%EC%97%853.png)

<mark style="color:blue;">**\[Check the animated image]**</mark>

![](https://support.swing2app.com/wp-content/uploads/2018/10/%EB%85%B9%ED%99%94_2020_05_09_17_46_13_594.gif)

This is the app launch screen with pop-ups applied.

You can see the image registered above and below like the app launch screen.

### <mark style="color:blue;">**4. Fourth pop-up style**</mark>

**The fourth pop-up style is a style that contains a total of nine images. If you select the bottom image, the style is larger.**

**This is a pop-up style that you can use when you need to add a lot of images.**

![](https://support.swing2app.com/wp-content/uploads/2018/10/Popup8.png)

Click the ‘+’ icon to register the image.

You must register all nine images. Please observe the recommended resolution.

<mark style="color:blue;">**\[Launch App Screen – Launch Pop-Up]**</mark>

![](https://support.swing2app.com/wp-content/uploads/2018/10/%EC%98%81%EB%AC%B8%ED%8C%9D%EC%97%854.png)

<mark style="color:blue;">**\[Check the animated image]**</mark>

![](https://support.swing2app.com/wp-content/uploads/2018/10/%EB%85%B9%ED%99%94_2020_05_09_18_09_02_432.gif)

This is the app launch screen with pop-up applied.

I see 9 images.

If you select one image, it will be shown as the image at the top-main header.

When you select the image, go to the page you linked to.

– If you want to stop the pop-up uncheck ‘**Turn on pop-up’** at the top of the pop-up management page and click the **Save** at the bottom.

-You can also edit the pop-up image and link modification.
