Basic | Helix Ultimate 2.0 - Documentation | JoomShaper

Helix Ultimate 2.0

Updated Last: 22 October 2021

Basic

Here you can set/upload a logo for your site (image or text). You can adjust the logo height as well. Also, you get an option to upload a dedicated mobile logo in this section. If you chose the Image logo, you can upload & use your own logo image, in those formats: PNG, GIF, JPG or SVG. 

Retina Logo - This logo will be shown on the retina display (iPad, iPhone devices). To avoid images looking blurry on retina display devices (iPhone, iPad) it is best to use a larger image that is displayed at a smaller size on the website. If one's regular logo image is 100x100 pixels in size, the retina logo image would need to be 200x200 pixels in size. The retina logo should be twice the size of the default logo.  It must be named the exact same as the regular logo image, though with @2x added onto the end of the name. So, if the regular logo image was named "logo.png", the retina logo image would need to be named "logo@2x. png".

Mobile Logo -  from this field you can add a mobile version of the logo. This logo will be shown in mobile view instead of the default logo. Leave blank if you do not want to show a different logo for mobile devices.

We suggest matched in size logo images. For sure do not use huge & heavy images for a website logo, the website is not DPT.  Using logo images beyond 800px in most cases doesn't make sense, especially with enabled Boxed Layout, they would be resized anyway. The image should be high quality - the logo is a very important part of website design and corporate identity. If you decided to use jpg as an image format, set very low compression during saving. PNG or SVG format is more recommended.

Logo Alt Text - is alternative text, also known as "alt attribute" and “alt description" for your site logo.  In general Alt text will be displayed in place of an image if an image file cannot be loaded. Alt text provides better image context/descriptions to search engine crawlers, helping them to index an image properly. It can enhance your SEO performance and improve website accessibility.

In most cases, it should contain "[Organization name] logo." 

Logo Height - you can set logo maximum height used in Desktop, Tablet, and Mobile view. Remember to resize the screen using top icons to get access to those 3 values. In most cases, logo height value should be smaller than header height.

Mobile Logo Height

Predefined Header -  Enable this option to use a predefined header provided by Helix Ultimate.

Header Height - you can choose header height used in Desktop, Tablet, and Mobile view. Remember to resize the screen using top icons to get access to those 3 values.

Enable Search - it allows you to enable and show the search field inside the header.

Enable Login - it allows you to enable and show the login area inside the header (icon and text).

Sticky Header - this option can be used when you need the header with a logo and navigation bar (menu) fix at the top position even page scroll down to the bottom. It means the header will be always fixed on the top.  They will make your site design more useful and improve the client experience. Your sticky header will be used on desktop, tablet, and mobile view. 

Sticky Offset - set scroll offset value after which the header will be sticky.

Favicon - Upload a 16px x 16px .png or .gif image that will be your favicon.


Body

In the Body section, you can turn the website Preloader on or off. If you turn on the preloader chosen animation will be shown while loading your site. It can be also a website logo image if you would select the last option.

Here you can also switch between Boxed Layout and wide site layout (defult). The boxed layout means that the whole website template max-width would be 1240px.

When you turn on the Boxed Layout option, you get several other relevant options (e.g. Background Image, Background Repeat, Background Size, Background Attachment, and Background Position) to customize the boxed layout appearance.

Boxed Layout BG Img

If you want to show a copyright notice on your website footer, turn on this option. Select the appropriate module position for the copyright notice (e.g. footer1, footer2). If you want to show some features along with the copyright notice module, choose the ordering using the Feature Position menu. Just below the Feature Position drop-down menu, you get a text box to put the footer copyright text.

Tip! Use {year} to get an auto-updated year.

 Instead of Footer settings, you can publish there (in footer positions) any module.

Coming Soon

With Helix Ultimate, you can display a customized maintenance mode page (e.g. under maintenance, coming soon, site offline or so on) on the frontend of your site when your site is under construction. You can craft this page as the way you want. Setting up the expected time and date to be back is also possible. Use the Coming Soon option to go to a coming soon/maintenance mode on your site. Add a page title, page contents, date, logo, background image and social icons on your coming soon page. You don’t need to add a custom page for this, rather, Helix Ultimate will show the coming soon/maintenance page once you simply turn this option on from Helix Ultimate template option.

Notice! You cannot use the front-end editor when you have enabled Coming Soon mode, first you have to disable it then you may switch the website into Off-Line mode from Global Configuration.

Error Page

A website may face several errors like 404 and so on. You can create a custom page for these errors. Use the Error Page option to do so. Upload a custom background image and a Logo to display on the error page(s).