Notifications
The Inspira Theme has special settings and configurations allowing you more control over the design of your site.
When working with Inspira, it's very important to enable development mode after changing any settings for this theme. We recommend that you enable and then immediately disable development mode after doing any changes for this theme.
Inspira has a "Custom CSS" section to allow for CSS changes that you need to make. This allows you to make changes that won't be impacted by upgrades. Please read the full tutorial below before making any changes.
Some settings below are only for specific landing page designs.
You'll need to be logged into your Admin Panel.
Navigate to "Inspira Theme."
You have a few choices for your guest landing page design and layout. To choose one, click the bubble to the left of the choice and save changes when done.
The following screenshots are for the default style. Your style choice may look different.
Layout 1
Layout 1 gives a layout with various widgets, a banner and widgets for custom text and images as well as a different footer layout with links, logo and more.
The banner, feature, counter, landing page app, and popular widgets are controlled via the Layout Editor. Click "Edit" to edit one of the widgets or click "x" to delete.
Landing Page Banner
You can edit the landing page banner to change the banner and height. You need to have uploaded a banner in order to choose one. The default height is 550. There must be at least one banner image for this widget to show. If you load more than one widget, the images will rotate. You can also edit the heading and description that shows with each image. This screenshot shows just one of the four available banner selections with heading and description.
Landing Page Features
The landing page features are the text and image widgets seen in the "Why Choose Us" banner. Edit the widget to change each as you want it. For the Icon, use Font Awesome v5 icons.
Landing Page Popular Widgets
You can set the title, amount to show and which way you prefer the plugin entries to show - popular by views, friends, members or comments depending on which widget you are editing.
Landing Page Service Widget
You can edit the Title and Description of this widget, and also the feature title, description and Font Awesome icon.
Landing Page Counter Widget
You can change the title, description, heading and images for this widget. You'll need to have uploaded images you want to use for the background and right side image in order to change these. You can also edit each counter value and text.
Landing Page App Widget
You can add your links to your mobile apps, edit the heading and description for this widget. Please note that the "Title" can be added but it is generally left blank for this widget.
Layout 2
Layout 2 has a more compact landing page and shows an image and login widget. You can change the image by following the landing page banner tutorial.
Header Options for Logged in Members
Choose the header options for members that are logged in by checking or unchecking the boxes to the left of each selection.
Header Options for Non-Logged in Members
Choose the header options for guests by checking or unchecking the boxes to the left of each selection.
Header Logo
Choose your default logo. You'll need to have uploaded one in the File & Media manager first.
Header Logo for Contrast Mode
Choose a logo for contrast mode. In case your default logo isn't looking good in contrast mode. You can also choose the same logo you chose for the default logo.
Menu Position
Choose between horizontal or vertical main menu position.
Menu Item Count
Enter the number of menu items to show in the main menu. This will create a "More+" menu item under which the remaining menu items will be shown in a dropdown. Enter "0", if you want to show all menu items in this widget and do not want to show "More+"
Show Sub Menus
Choose whether to show submenus for the main menu plugins. The screenshot below shows the submenus enabled.
Show Accessibility Options
This allows you to choose whether to show the accessibility widget or not. Please note that most areas now require websites to be handicap accessible. If not accessible, there can be hefty fines in some areas. Please check with the laws in your area before disabling this.
Landing Page Header Logo
You can choose any logo for your guest landing page. We recommend a dimension of 200x200 for the logo if using Landing Page Design 2.
Landing Page Menu Item Count
Enter the number of menu items to show in the main menu. This will create a "More+" menu item under which the remaining menu items will be shown in a dropdown. Enter "0", if you want to show all menu items in this widget and do not want to show "More+"
You can configure your footer features via the settings here.
Footer Logo
Choose a footer logo for your website. You need to have uploaded one in the File & Media manager.
Footer Background Image
Choose a footer background image if you want one. You need to have uploaded one in the File & Media manager.
Enable Quick Links
Do you want to enable quick links to your preferred links in the footer?
If you choose Yes, the the menu items will display links which have been configured from your menu manager.
Enable Footer Menu Links
Do you want to enable the SocialEngine default links in the footer?
If you choose Yes, the the menu items will display links which have been configured in your menu manager.
This is the text that shows in the footer left column. You can leave any field blank if you don't want to show it.
Left Column Description
Enter the left column description.
Left Column Location
Enter the left column location. You can put any text here. It does not generate a map link so you can even get creative.
Enter the left column email.
Enter the left column phone.
This is the text that shows in the footer right column. You can leave any field blank if you don't want to show it.
Enter the right column heading text.
Enter the right column description.
You can choose from three color schemes or make your own. Click the "Color Schemes" tab to view the choices. Note that in order to make color changes you'll want to create a custom theme (see below).
Choose a color by clicking it and clicking "Save Changes.
Create a new theme by clicking "Add New Custom Theme." (Recommended if you want to change colors and other CSS or the theme layouts.)
Enter the new theme name and choose which theme to clone. Save changes when done by clicking "Create." Activate the theme by clicking on it and saving changes. Don't forget to change to Development mode and then back to Production mode in order to see changes on your site.
You can configure the font settings for this theme on your website. You can also choose to enable Google Fonts or use web safe fonts. Click the "Manage Fonts" tab to configure your fonts. Be sure to save it after.
And paste it into the input box in the Custom CSS page:
Remember to enable and disable development mode after making any changes!
