Offscreen Login widget in Infinity Pro

One of the built-in features of Infinity Pro is the Offscreen Content widget area whose widgets will appear in a full screen overlay when a button is clicked on the header.

In this tutorial, I show how we can change the ios-more ion icons icon (the three dots) with a ion icon's log-in icon followed by setting up a user login form in the offscreen content area. When the user is logged in, they'll find links to access Dashboard, their Profile and Logout.

Step 1

Edit Infinity Pro's functions.php.

Replace ion-ios-more with ion-log-in .

Step 2