Note*
To enable users to install SPFx Modern Theming Solutions (client-side-solutions) for SharePoint in their sites, you must configure your environment to support apps.
In order to perform this step you need to be a member of the Farm Administrators group of SharePoint 2019 server.
Click Start, point to Administrative Tools and click DNS to open DNS Manager.
In DNS Manager, right-click Forward Lookup Zones, and then click New Zone…. to start the New Zone Wizard
In the Zone Type section, make sure the default Primary zone is selected, and then click Next.
In the Active Directory Zone Replication Scope, select the suitable replication method for your environment, and then click Next.
For Zone Name type the name for your new app domain name (e.g. yourDomain.localApps), and then click Next.
On the Completing the New Zone Wizard section, review the settings, and then click Finish. This will create a new forward lookup zone (e.g. yourDomain.localApps) under Forward Lookup Zones.
In DNS Manager, under Forward Lookup Zones, right-click the new app domain name (e.g. yourDomain.localApps), and then click New Alias (CNAME).
For Fully qualified domain name (FQDN) for target host, click Browse and navigate to the Forward Lookup Zone for the domain that hosts the SharePoint Server sites. (e.g. yourDomain.com), and then navigate to the record that points to the server that hosts the SharePoint Server site.
e.g.
SharePoint2019 (server name)
New Resource Record dialog box shows the wildcard alias for the app domain and the FQDN of the server that hosts the SharePoint sites.
Click OK.
At the command prompt, type ping followed by a subdomain of the domain that you created, and then press ENTER.
e.g.If the ping command returns the correct IP address, then your wildcard for the domain name was configured successfully.
Note*
In order to perform this step you need to be a member of the Farm Administrators group of SharePoint 2019 server.
Select Start and open SharePoint 2019 Central Administration
In Central Administration, under System Settings, click Manage services in this farm.
For the Microsoft SharePoint Foundation Subscription Settings Service, click Enable Auto Provision.
Run the SharePoint 2019 Management Shell as Administrator (right-click on the icon).
Create a Subscription Settings service application and proxy by executing following commands one at a time:
$sa = New-SPSubscriptionSettingsServiceApplication -ApplicationPool 'SharePoint Web Services Default' -Name 'Subscriptions Settings Service Application' -DatabaseName 'Subscription'
New-SPSubscriptionSettingsServiceApplicationProxy -ServiceApplication $sa
*At the end of the two commands above, you should see the DisplayName, TypeName, and ID:
To verify if the Subscription Settings service application and proxy have been created, navigate to Central Administration, click Manage service applications under Application Management, and check if two entries shown below exist.
Important Note*
In Central Administration, under Application Management, click Manage service applications.
Click New, and then click App Management Service.
Specify a name for the service application in the Service Application Name box.
Under Application Pool, choose SharePoint Web Services Default. Click OK.
Note*
In order to perform this step you need to be a member of the Farm Administrators group of SharePoint 2019 server.
In Central Administration, on the Apps page, in the App Management section, click Configure App URLs.
In the Configure App URLs form, specify App domain (the same you have created in step 1), and App prefix (app is recommended).
In the App Management section, click Manage App Catalog. If no App Catalog exists for the farm, the Web Application page opens.
On the Web Application page, select the web application for which you want to create a catalog. Next select Create a new app catalog site and click OK.
On the Create App Catalog page, specify title for the App Catalog site, type the description for the site, and the URL to use for the site. In the Primary Site Collection Administrator section, specify the user who will manage the catalog.
In the End Users section, type the names of the users or groups that you want to be able to browse the catalog. Added users or groups have read access to the App Catalog site. You can add multiple user names and security groups. Users must be added as End Users to be able to browse the App Catalog from their site collections.
In the Select a quota template list box, select the quota template to use for the site. Click OK.
Once the site has been created, a link to it is available on the Manage App Catalog page in Central Administration.
Make sure that the App Catalog is shared with users or groups that you want to be able to add apps (SPFx client-side solutions) to their sites.
To make the solutions available for installation:
Navigate to your App Catalog site.
On the home page of the App Catalog site, select the tile labeled Distribute apps for SharePoint.
Select New and browse to the extracted YourPackage.zip > SPFx_Solutions > SP2019 > SPFx_Theming Solutions folder.
Upload the MT-Modern-OnPrem-01.sppkg and MT-Modern-OnPrem-02.sppkg files, or drag them into the library one-by-one.
When prompted, confirm that you trust the client-side solution MT-Modern-OnPrem-01.sppkg, and MT-Modern-OnPrem-02.sppkg by selecting Deploy for each of them separately.
In the Properties Dialog form enter:
For Short Description enter:
"Modern Duotones" SPFx theming solution for SharePoint modern sites.
For Icon URL you use:
https://sharepointpackages.com/images/images-MT_WP/app_icons/MT-App_Icon1.png
For Type the description enter:
"Modern Duotones" SPFx theming solution for SharePoint modern sites from MasterThemes Inc.
For Publisher Name enter:
MasterThemes Inc.
Make sure the Enabled check box is selected so that users are able to add this app to sites.
Click Save.
Now change properties for the MT-Modern-OnPrem-02.sppkg app:
In the Properties Dialog form enter:
For Short Description enter:
"Modern Monotones" SPFx theming solution for SharePoint modern sites.
For Icon URL you use:
https://sharepointpackages.com/images/images-MT_WP/app_icons/MT-App_Icon2.png
For Type the description enter:
"Modern Theme" SPFx solution for top level sites from MasterThemes Inc.
For Publisher Name enter:
MasterThemes Inc.
Make sure the Enabled check box is selected so that users are able to add this app to sites.
Click Save.
To make the solutions available for installation:
Navigate to your App Catalog site.
On the home page of the App Catalog site, select the tile labeled Distribute apps for SharePoint.
Select New and browse to the extracted YourPackage.zip > SPFx_Solutions > SP2019 > SPFx_Global Navigation folder.
Upload the spfx-global-navigation.sppkg file, or drag it into the library.
In the Properties Dialog form enter:
Scroll to the bottom of the page and make sure the Enabled check box is selected so that users are able to add this app to sites.
Note*
In order to perform this step you need to be a member of the Farm Administrators group of SharePoint 2019 server.
Select Start and open Windows PowerShell (run as Administrator).
Install-Module -Name PnP.PowerShell
Confirm that you want to install and import the NuGet provider by typing Y and pressing Enter.
Confirm that you want to install the modules from 'PSGallery' by typing A and pressing Enter.
On your server, create the Modules folder under C:\Modules
From the SharePoint 2019 Management Shell run the following cmdlet:
Save-Module -Name SharePointPnPPowerShellOnline -Path c:\Modules
Next execute the following cmdlet:
Import-Module c:\Modules\SharePointPnPPowerShellOnline\3.29.2101.0\SharePointPnPPowerShellOnline.psd1 -DisableNameChecking
Note*
Make sure that the
path to the SharePointPnPPowerShellOnline.psd1 file is correct.
From the SharePoint 2019 Management Shell navigate to the pasted provisioning folder and run ./deploy.ps1
cd C:\Users\Administrator\Desktop\provisioning
./deploy.ps1
When prompted, enter url of the root site on your server ( e.g. http://SharepontServer )
Important Note*
In the browser, navigate the root site > Global Nav List folder and select the + New button to create your global navigation menu.
*Example of the global navigation menu (click the image to see the menu in action)
To create the "Home Icon", for title enter Home, for order enter 1, and for parent select (None).
To create a "Top Level Link", for title enter any text you need, for order enter different number than 1, for parent select (None).
To create a "Second Level Link", for title enter any text you need, for order enter different number than 1, for parent select one of your top level links.
To create a "Third Level Link", for title enter any text you need, for order enter different number than 1, for parent select one of your second level links.
Important Note*
Note*
In order to perform this step you need to be a member of the Farm Administrators group of SharePoint 2019 server.
In the SharePoint 2019 Central Administration, on the Application Management page select Create site collections to create a new top level web site.
For Description enter:
MasterThemes Assets
For Web Site Address leave /sites/ unchanged, and enter exactly:
masterthemes-assets
Important Note*
The web site address of the MasterThemes Assets site collection must be http:// [ SharePoint root site ] /sites/masterthemes-assets. If it is different, the collapsible footer and some other components provided with the package will be missing.
On the Template Selection page, navigate to Solution Gallery
In the Solutions Gallery, select Upload Solution > navigate to the extracted YourPackage.zip > MasterThemes_Assets > SP_2019 folder, and upload the MasterThemes_Assets_On-PremXXXXXX.wsp file.
Make sure the uploaded solution is activated.
Navigate back to the Template Selection page for the MasterThemes Assets site by removing /_catalogs/solutions/Forms/AllItems.aspx from your browser's address bar and hitting enter.
Location of the MasterThemes Assets site:
https:// [ SharePoint root site ] /sites/masterthemes-assets
On the Template Selection page under Custom tab, select the MasterThemes Assets template and click OK.
Under People and Groups > Set Up groups for this Site, create a group of members (Members of this Site) who will have rights to contribute content of the collapsible footer to SharePoint sites with applied Modern Duotones SPFx theming solution. Members with these rights can also be added to the MasterThemes Assets site at a later time.
From the extracted package YourPackage.zip select and copy (Ctrl +C) the "mt-on-prem" folder (the entire folder with its structure).
Navigate to:
Your SharePoint Local Disc: Program Files\Common Files\Microsoft Shared\Web Server Extensions\16\TEMPLATE\LAYOUTS\1033\STYLES\Themable directory.
Note*
The "mt-on-prem" folder contains CSS files used by the expandable / collapsible footer, carousel display, and accordion component.
Important Note*
You will not be able to perform this step using System Administrator Account. To Add an app to your site (SPFx modern theming solution), logon as a different user than System Administrator.
In your browser navigate to the site collection you want to install the SPFx Modern Theme app (SPFx client-side solution).
Open the settings menu by clicking the gears icon on the top navigation bar, and then select Add an app to go to your Apps page.
In the Search box, enter MT-Modern-OnPrem, and press Enter to filter your apps.
As a result, 2 apps should match your search: MT-Modern-OnPrem-01 (Modern Duotones), and MT-Modern-OnPrem-02 (Modern Monotones).
Select ether the MT-Modern-OnPrem-01 (Modern Duotones) or MT-Modern-OnPrem-02 (Modern Monotones) to install the solution for your modern site.
To check if the solution is installed on your site, wait a while and refresh your page (F5).
Important Note*
You will not be able to perform this step using System Administrator Account. To Add an app to your site (SPFx modern theming solution), logon as a different user than System Administrator.
In your browser navigate to the site collection you want to install the SPFx Modern Theme app (SPFx client-side solution).
Open the settings menu by clicking the gears icon on the top navigation bar, and then select Add an app to go to your Apps page.
Select ether the spfx-global-navigation-client-side-solution to add the glogal navigation to the site.
To check if the solution is installed on your site, wait a while and refresh your page (F5).
Important Note*
To apply a custom color (a single primary color) to modern site on SharePoint 2019 On-Premises:
Install classic *.spcolor themes:
Apply a custom color to your site: