[FAQ] NIC & EM Theme
1. Where can I change the aside position alignment?
Please go the Warp UI and open the Layouts section. Select the appropriate "Layout Profile" and scroll down to the Aside Block Section. Besides many other settings like blend modes there you find the aside Width (50%,33%,25%) and Alignment (left,right).
2. Why is my module on the aside position displayed over the entire position width?
By default, a module/widget is centered and fills up the entire Aside position vertically. To enlarge the module to the full height of the Aside position like on the contact page open the Warp Module Manager (Extension > Templates > yoo_nic-em > Modules). Enter tm-aside-fullheight in the module/widget custom class field and your module fill the whole Aside position.
Example Widgetkit widget:
Example Modules/Widget Manager:
3. What if I want a centered module on the Aside position what is not extend over the entire position width?
As mentioned above the modules/widgets published on the aside position fill up the entire Aside position vertically. If you want to publish a centered small content, open the Warp UI go to Modules/Widgets and add within the class field of the appropriate widget/module a UIkit width class.
4. How to enable or set the page-loader?
The page-loader is a custom module/widget position allows you to create custom markup that will then be displayed on any page that the module/widget is published on, while the site is in the process of loading.
- Create a new custom module/widget and assign it to the page-loader position
- To achieve a small logo animation like in the demo content we used UIkit animation classes
This is the example code from the demo content:
<div class="tm-page-loader-content"> <img class="uk-animation-fade" src="images/your-image.svg" width="65" height="50" alt="Demo" style="animation-delay:500ms; "> <h1 class="uk-heading-large uk-margin-top-remove uk-animation-slide-bottom">Your Headline</h1> <div class="uk-animation-fade" style="animation-delay:800ms; ">Subtitle</div> </div>
In this example, the headline smoothly slides in from the bottom because of the uk-animation-slide-bottom class. After a delay, the image below appears with a fade in animation and in the end the subtitle because it has the longest delay which is set for both elements per inline style style="animation-delay:800ms; ".
This class centers your content and apply a color. The color can be adjusted within the Customizer search for the @theme-page-loader-color and enter a hexadecimal color value.
5. Recommend Aside Imagesize?
I have used in the demo version an image size of 960 x 1080px. It fits the Aside position perfectly when the aside position move to a teaser position once the browser window gets smaller, it displays the middle/centered part of your image.
6. How to disable "Aside"-position for certain subpages in the template NIC & EM?
The Nic & Em Theme Design is based on the two column layout and you can't have a page without the Aside position. Further, you can shrink the position to 25% or you publish nothing there and just use a background color or image.
7. Pageloader module/widget in other template ?
Take a look at this detailed description to achieve this.