DnnDeveloper Animated Popup Module Animated Po… · If you need to install a module on your...

13
Email: [email protected] | Website: http://www.DnnDeveloper.In DnnDeveloper Animated Popup Module User Guide

Transcript of DnnDeveloper Animated Popup Module Animated Po… · If you need to install a module on your...

Page 1: DnnDeveloper Animated Popup Module Animated Po… · If you need to install a module on your DotNetNuke website you can follow the steps below for the DotNetNuke version running on

Email: [email protected] | Website: http://www.DnnDeveloper.In

DnnDeveloper Animated Popup Module

User Guide

Page 2: DnnDeveloper Animated Popup Module Animated Po… · If you need to install a module on your DotNetNuke website you can follow the steps below for the DotNetNuke version running on

User Guide – Popup Module [PAGE # ii]

Email: [email protected] | Website: http://www.DnnDeveloper.In

TABLE OF CONTENTS

WHAT IS DOTNETNUKE MODULE ..................................................................................... 1

WHO ARE DNNDEVELOPER.IN.......................................................................................... 1

ANIMATED POPUP MODULE ............................................................................................. 1

INSTALL DNN MODULE ...................................................................................................... 2

SETTING/CONFIGURING POPUP MODULE ....................................................................... 7

Page 3: DnnDeveloper Animated Popup Module Animated Po… · If you need to install a module on your DotNetNuke website you can follow the steps below for the DotNetNuke version running on

User Guide – Popup Module [PAGE # 1]

Email: [email protected] | Website: http://www.DnnDeveloper.In

1 WHAT IS DOTNETNUKE MODULE

DotNetNuke is a program that runs on Microsoft ASP.NET. It is also a framework, meaning, it is a program that is designed to be extended. One of the ways to extend the framework is through custom modules. Various functionality and features required as per various business needs, it can be incorporated to DNN Framework with the use of DotNetNuke Custom Module.

2 WHO ARE DNNDEVELOPER.IN

We are a group of dedicated and enthusiastic professionals who offer the full range of creative services for the DotNetNuke and ASP.Net MVC, C#, SQL Server with years of cumulative experience in web based development that include DNN/DotNetNuke module development, DNN/DotNetNuke Skin solutions, and DNN/DotNetNuke maintenance services. Please visit us at http://www.DnnDeveloper.In

We offer full support and customization to this module as per requirement, we welcome your queries and support request at [email protected]

3 ANIMATED POPUP MODULE

Popup module is the easy way to show the popup with your content. It has the wide variety of configuration settings to control the layout of the model popup. It has the option to show popup only if the visitor has not seen.

#1 It offers to reach text editor to inject the content through you can show an image or content advertisement, embedded video or another webpage as an iframe or the notification and messages.

#1 Cookie-based model popup can be set to appear after a certain interval of time and also hides when the user returns to your web page by tracking cookies.

#2 It has wide choises for the transition effect and layout of model popup that included, position of model, color and the size of the popup window.

Page 4: DnnDeveloper Animated Popup Module Animated Po… · If you need to install a module on your DotNetNuke website you can follow the steps below for the DotNetNuke version running on

User Guide – Popup Module [PAGE # 2]

Email: [email protected] | Website: http://www.DnnDeveloper.In

4 INSTALL DNN MODULE

If you need to install a module on your DotNetNuke website you can follow the steps below for the DotNetNuke version running on your site, we have here Contact Us module installation steps demonstrated, the same step you have to follow to install the DnnDeveloper Popup module.

#1 Installing a DotNetNuke 9.x Module

Log into your site as either HOST or super user level account.

Open Settings -> Extensions

Page 5: DnnDeveloper Animated Popup Module Animated Po… · If you need to install a module on your DotNetNuke website you can follow the steps below for the DotNetNuke version running on

User Guide – Popup Module [PAGE # 3]

Email: [email protected] | Website: http://www.DnnDeveloper.In

Click "install extension"

Drag and drop the package into the window, or click to browse and select the install package (.zip file) to upload the module.

Page 6: DnnDeveloper Animated Popup Module Animated Po… · If you need to install a module on your DotNetNuke website you can follow the steps below for the DotNetNuke version running on

User Guide – Popup Module [PAGE # 4]

Email: [email protected] | Website: http://www.DnnDeveloper.In

Click the next button, accept the license and continue through the install. When finished click on the Return button.

Click the next button, read the release note it describes features and known issue summary.

Page 7: DnnDeveloper Animated Popup Module Animated Po… · If you need to install a module on your DotNetNuke website you can follow the steps below for the DotNetNuke version running on

User Guide – Popup Module [PAGE # 5]

Email: [email protected] | Website: http://www.DnnDeveloper.In

Click the next button, after accepting the license if you are agreed.

Click the Done button, module installed to be configured to DotNetNuke Portal.

Page 8: DnnDeveloper Animated Popup Module Animated Po… · If you need to install a module on your DotNetNuke website you can follow the steps below for the DotNetNuke version running on

User Guide – Popup Module [PAGE # 6]

Email: [email protected] | Website: http://www.DnnDeveloper.In

#2 Installing/Updating a DotNetNuke 7.x & 8.x Module (Video tutorial: https://www.youtube.com/watch?v=xDRjzFrKECA)

Log into your site as either HOST or another superuser level account.

Navigate to the Host menu and select Extensions.

Click on Install Extension Wizard.

As directed browse to the zip file that contains the data for your module, select it then click Open.

Click next, accept the license, and continue through the install. When finished click on the Return button.

#3 Installing/Updating a DotNetNuke 6.x Module

Log into your site as either HOST or another superuser level account.

Navigate to the Host menu and select Extensions.

Hover over the title Extension for a few seconds to generate the Manage button. Click Manage.

Click on Install Extension Wizard.

As directed browse to the zip file that contains the data for your module, select it then click Open.

Click next, accept the license, and continue through the install. When finished click on the Return button.

#4 Installing/Updating a DotNetNuke 5.x Module

Log into your site as either HOST or supers user level account.

Navigate to the Host > Extensions. From this page, you can see all of the modules or extensions that you have installed on your site. You can also see the version information and whether or not it is in use.

If there is a DNN registered update or upgrade to the module or extension, it will be listed on the right side of the page.

Click the link and the site will either take you to a module installation page for the module or walk you through an automatic upgrade of the module.

Page 9: DnnDeveloper Animated Popup Module Animated Po… · If you need to install a module on your DotNetNuke website you can follow the steps below for the DotNetNuke version running on

User Guide – Popup Module [PAGE # 7]

Email: [email protected] | Website: http://www.DnnDeveloper.In

5 SETTING/CONFIGURING POPUP MODULE

#1 Add DnnDeveloper Popup module on the page

Navigate to the Page where you want to show the module, you can show module to every page by changing the module level settings for the Module Settings > Advance Settings > “Display Module on All Pages” to show module on all pages.

Click on the Add Module button at the bottom of the page

Enter the DNNDeveloer text at “Add Module” popup overlay/window

Click on DnnDeveloper Popup Module, Drag and drop the module on the Panel you want it to be located. Make sure you find DnnDeveloper Popup.

Page 10: DnnDeveloper Animated Popup Module Animated Po… · If you need to install a module on your DotNetNuke website you can follow the steps below for the DotNetNuke version running on

User Guide – Popup Module [PAGE # 8]

Email: [email protected] | Website: http://www.DnnDeveloper.In

Settings section of Popup module

Mouse hover the settings icon at top right corner of Module, Click on Settings Submenu

#2 Setting: Popup Opener

Popup Opener Settings: Admin will see the sections for the Popup Settings windows as below

Popup Opener Settings: Admin user can set the option “User/Coockie Based Visibility” which will keep the browser cookie for the days mentioned at “Number of Day to Remember User”.

These options are useful when you only want to display the popup when the user visits your website the first time on a specific browser session. If he/she refreshes the page, then the form won't load anymore. Please note that the cookie will be destroyed once days (mentioned at “Number of Day to Remember User” option) get expired for the same browser. Note: If browser has setting to clean cookie, it will open model popup for the first visit to the page.

Page 11: DnnDeveloper Animated Popup Module Animated Po… · If you need to install a module on your DotNetNuke website you can follow the steps below for the DotNetNuke version running on

User Guide – Popup Module [PAGE # 9]

Email: [email protected] | Website: http://www.DnnDeveloper.In

Popup Transition effect : Admin can change the model popup transitions effect from the list of available.

Popup Container colour can be changed as per matching your DNN Theme

Page 12: DnnDeveloper Animated Popup Module Animated Po… · If you need to install a module on your DotNetNuke website you can follow the steps below for the DotNetNuke version running on

User Guide – Popup Module [PAGE # 10]

Email: [email protected] | Website: http://www.DnnDeveloper.In

Popup Speed: Transitions effect speed can be controlled.

Position of popup on the screen can be configured like Center- Middle, Left-Top

Non Overlay: if you do not need to show the background for the model popup.

Overlay Colour: Set the colour of the overlay/background

Full Scrreen: You can set the popup as a full screen

Overlay Opacity: Opacity/Transparency can be set

Close on Overlay click: If you want users to close the popup only by clicking on close icon/button on the top left side of popup, you can do it. Once, Close on overlay click is checked user will not be able to close the popup by clicking outside if the model popup window.

Loader: its progress icon that can be hide or shown.

Popup Content Settings: Admin can add the Advertisement banner, content, embedded video or iframe source/url that will be content on the popup window.

Page 13: DnnDeveloper Animated Popup Module Animated Po… · If you need to install a module on your DotNetNuke website you can follow the steps below for the DotNetNuke version running on

User Guide – Popup Module [PAGE # 11]

Email: [email protected] | Website: http://www.DnnDeveloper.In