Introduction


For all our customers, you can upgrade now from ShortPoint Add-In to ShortPoint SPFx seamlessly and risk-free. We spend the last two months to ensure you will have a significant upgrade experience. 


We guarantee that there will be no data loss, downtime and nothing will affect your existing sites and designs. 


This article will explain in details the process of upgrading from ShortPoint Add-In to ShortPoint SPFx. If you have been using ShortPoint before, and now you want to expand its capabilities and work with ShortPoint on Modern SharePoint Pages, this article is for you.



Prerequisites

  • ShortPoint Add-In is installed on your Office 365 environment
  • You have admin access in your tenant. You can quickly check this by opening http://yourtenant-admin.sharepoint.com (where "yourtenant" should be substituted with your tenant name).
  • Download Latest version of ShortPoint SPFx

Upgrade to ShortPoint SPFx Video Tutorial


Watch Sami from ShortPoint while explaining the process to upgrade to SPFx in details:




Below are the steps explained in details

Step 1. Open the SharePoint Admin Center


From any location in your Office 365 tenant, click the App Launcher button on the top left:





Choose Admin:





In the side App Launcher menu, scroll down and click Admin Centers:





From the drop-down, choose SharePoint:



 


Step 2. Open the SharePoint App Catalog


In the SharePoint Admin Center, click Apps.




Choose App Catalog from the central menu.




In the next screen, on the side menu, choose Apps for SharePoint.





Step 3. Download latest version of ShortPoint SPFx


  1. Download the latest version of ShortPoint SPFx
  2. Extract the file ShortPoint-SPFx_XXXX.zip
  3. You will find after extracting the file: shortpoint-spfx.sppkg
  4. Upload shortpoint-spfx.sppkg as described in the following step:



Step 4. Upload ShortPoint SPFx to App Catalog


Press New:




Click Browse:





From your computer, choose the shortpoint-spfx.sppkg file. Press Open:





Press OK:




I can not add the new package to App Catalog!
If the step is not completed successfully and you have encountered a problem adding the package to the App Catalog, please click here to fix the issue.


After the upload is completed successfully, you will be prompted to deploy the solution. 

Press Deploy. This will enable ShortPoint to download the latest files from our global CDN d2zzvnmppezkx.cloudfront.net:





After this step is completed, you will see a message on the top highlighted with green, indicated that the upload is completed successfully.


Important: You should see that ShortPoint SPFx is Deployed



If you get the following error that the App was not Deployed:



Then all you have to do is to click on the app and try to Deploy again




Step 5. Add the app to the site


Open the site which you would like to use ShortPoint SPFx in.
Click on the cog wheel in the Suite Bar and choose Site Contents from the drop-down:




Note: At this stage, in the Site Contents you will still see your usual ShortPoint Add-In:


  • in Classic Experience:


  • in Modern Experience:



The next step is different for Classic and Modern Experience.


  • in Classic Experience, click Add an App:



  • in Modern Experience, click (1) New, and from the drop-down, choose (2) App:





Under Apps you can add, choose ShortPoint SPFx:




You will be redirected back to Site Contents. The app icon will appear in the list of apps, but it will be dimmed until the app fully loads to the site. Please wait for a little. You can refresh the page in 3-5 minutes.


Here is how it will look like 


  • in Classic Experience:



  • in Modern Experience:



Please proceed to the next step to finish the installation.



Step 6. Install ShortPoint SPFx


Start from Site Contents. You will see two ShortPoint SPFx items, which is how it is expected to be: ShortPoint SPFx and ShortPoint SPFx - Install Now!


Click ShortPoint SPFx - Install Now!


I cannot find ShortPoint SPFx - Install Now!
Just refresh the page, and you should see the new App.


  • In Classic Experience:




  • in Modern Experience:




Choose the first tile that says Installation.


Note: ShortPoint SPFx versions will start from 6 (e.g. 6.1.0.0).




Press Install.



Notes:

Install for classic pages:  You can choose not to install ShortPoint SPFx on classic pages. The only reason you want to do this is when you do not want to enable scripting capabilities on classic sites. Installing ShortPoint on modern sites does not require scripting capabilities. Because you are upgrading from ShortPoint Add-In, we assume you already have ShortPoint working on classic pages and hence Install for classic pages option will be enabled by default. You cannot disable it.

Site Collection Scope Installation: If the Add-in was already installed on site collection scope, you could not disable this option as disabling it will break your already working subsites.  



Wait until the installation finishes:





If you get this error:

Oops, the installation has failed! Something went wrong and ShortPoint SPFx could not complete the installation. Please remove ShortPoint SPFx (NOT ShortPoint App) from site content and try the installation again. 

Please click here to fix the issue.



The green highlight will indicate that the installation was completed successfully:






Step 7. We are done :)

After you return to Site Contents, you will see three apps:


  1. the old ShortPoint Add-In
  2. the new ShortPoint SPFx Dashboard; and
  3. the new ShortPoint SPFx Back-End App. 
  4. Congratulations, you are fantastic!


  • in Classic Experience:




  • in Modern Experience:



Old ShortPoint Add-In


As part of the installation, ShortPoint SPFx will migrate your data such as Theme Builder themes, Generated elements, Connections and Integrations from your old dashboard. And once the installation finishes, you will notice the following when you click on the old ShortPoint Add-In app from site content:



How to Delete Old ShortPooint App from Site after you have Upgraded to ShortPoint SPFx


Congratulations! You have Upgraded to ShortPoint SPFx. The latest SharePoint Technology :)

The new ShortPoint SPFx app is completely ready! We hope you enjoy :)


NEXT: Add Your First ShortPoint Element to Modern SharePoint Page