Theme Customizer

Our Theme customizer works as the original WordPress customizer feature but be much more versatile. All our theme options can be changed in our Customizer on the left side and live previewed instantly on right side. With this intuitive interface, you can customize your website as you wish at your fingertips without writing a line of code.

To start using Customizer in Admin Panel, navigate to Customizer, you will be redirected to a live preview screen where you can change options on left side and preview your site on right side promptly. All your change will not be committed and viewed on your site until you click Save & Publish on top right of Customizer bar. You also are able to Export your setting in Customizer and Import to apply for other sites.

Site Enhancement

  • Custom Favicon: A favicon is a simple square image viewable in browsers for users to identify your website among many tabs. Ideally, it should be a 32×32 pixels or a 16×16 pixels. Most modern browsers can display a favicon in PNG format but older versions of Internet Explorer may not. To make sure your favicon be shown nicely, it is recommended to be in .ico format. Add your favicon in our customizer simply by clicking “Open Library” button in “Custom Favicon”, selecting your existing image or uploading new image.
  • Back To Top Button: Back To Top Button will appear in the right bottom when users scroll down. Enable/Disable as your preference.
  • Enable Page Heading: Page Heading will appear on the header of page. When you Enable this option, you will have header background image on blog-page, department-page, doctor-page.
  • Enable Breadcrumbs: Breadcrumbs will appear below header title of page. Enable/Disable as your preference.
  • Enable MailChimp Settings: This option allows you to turn on MailChimp Subscribe. You need to add MailChimp API key to connect your account. To learn more about MailChimp API key you can go to HERE.
  • Smooth Scrolling: This option is a very useful feature and can be found in almost all popular web browsers such as Mozilla Firefox, Internet Explorer, etc. Smooth Scrolling slides down the web page smoothly and helps you in reading a long web page easily. Without smooth scrolling, the browser directly jumps down one page and doesn’t look good. Enable/Disable as your preference.

Design and Layout

  • Style Layout: This option will help you set Style & Layout for your site. We provide two layout styles, include: Boxed Layout and Fullwidth layout. With Boxed layout, you will have additional options for max site width, background color or image setting.
  • Color: This option allows you to set the color for links and various elements for your site.

Primary Color: you can change primary color by this option. There is table of color, which allows you to select color you want or enter your color code on box.

Typography

You can customize your Typography settings here. Medicus integrated all Google Fonts. See font preview at Google Fonts.

  • Custom Fonts: Enable Custom Fonts to customize font, font size and other settings for heading and body text.
  • Custom Font Color: Enable Custom Font Color to customize font color of heading and body.
  • Headings: If checked on Transform to Uppercase, you will have heading <h1> <h2> <h3> which is uppercase type.
  • Body: You can change font size of body by selecting font size from dropdown list.

Header

Customize settings for Heading including Navigation Bar, Logo and NavBar Alignment.

Navigation Bar

This section adjusts settings for Navigation Bar. You also can customize some settings for the Toggle Button on Mobile in this section.

  • NavBar Position: This option allows you to select type of NavBar, including Static Top or Fixed Top.
  • Use Custom NavBar Font and color: If On, you can change font, font size, link color and link hover color for header font. If you click on Transform to Uppercase checkbox the NavBar will transform Uppercase.

Medicus allows to add image file or use text for logo. You will see button to turn On/Off Use Image for Logo.

If Off, you will have option to enter your site name, select logo font from Google font, font size and color for your logo.

If On, you will have two logo images to upload.  The first one is for standard desktop while the second one is for retina ready devices (optional). Click the Upload button and select your logo file. Upload your logo image and retina one (a larger image, with double the amount of pixels that your image will be displayed at). Enter your image height you want to display on navigation bar and we will do the calculation part for you to make it look great on all screen size.

NavBar Alignment

Adjust height of navigation bar, space between links and size of mobile navigation button.

Top Bar

Top Bar lays on top of your site, above Navigation Bar. It is suitable for placing contact information and social media link. Enable to controls its layout and content.

  • Enable Top Bar: If On, you will see Custom Content (HTML) field where you can enter HTML content for Top Bar.

In Medicus we used this Custom Content:

<i class=”fa fa-phone”></i>

+00-122-123-0099   

    <i class=”fa fa-envelope”></i> <a href=”[email protected]”>[email protected]</a>

  • Show Search Box: This option will help you to turn On/Off search button on Top Bar.
  • Enable Top Bar Language: This option will help you to turn On/Off language filter on TopBar.

Footer

Top Footer

Enable Top Footer: This option will help you to turn On/Off Top Footer section. To turn on Top Footer you need to configure some option below:

  • Top Footer Content: Enter your content for Top Footer. You need to add content by Custom HTML content.

 

Footer Columns (Widgetized)

This option allows to set the footer column number from drop-down list. Number of columns can be from 1 to 4. You also can select None to leave it blank (no footer content).

Widgets

This section enables you to add and customize Widgets on you preview site. It includes number of Footer Columns due to setting in above section: Footer settings.

Footer Column #i: You will see number of footer columns corresponding to footer settings. Add text, image or other widget by hitting Add a Widget button.

Blog

Post List

Choose Layout settings for your Post List.

  • Blog Layout: It can be full-width, with right sidebar and with left sidebar. If you choose layout with sidebar, select blog sidebar for your blog page.
  • Blog sidebar: Choose sidebar for your blog page.
  • Heading Title: Enter heading title for your blog page here. Your blog title will be displayed in center of heading background image.
  • Heading Background Image: You will have background image of blog page if you click “Select Image” button then select image from Library or choosing from your computer.
  • Show Post Meta: Check the box to show post me-ta of blog page.
  • Show Read-more link: Check the box to show read more link.
  • Excerpt Length: The number of character displayed on post selection.

Post Layout

  • Post Layout: Choose Post layout same as blog layout by checking the boxes beside options or uncheck to choose another layout.
  • Show Post Meta: If checked, post me-ta will display on each post. Similarly, you can choose show/hide post tags and author’s bio.
  • Enable Social Sharing: Enable/Disable Social Sharing. If enable, you enable visitor to share your post by Facebook, Twitter, Google+, Pinterest and LinkedIn.

Department

Departments Listing

This section will help you to configure Departments Listing page. Firstly, assign a page as Department page from dropdown list. Once you choose a page as Department Listing page, its slug will be your Department Listing’s main slugs.

  • Department Page: Select a page as Department Listing page from dropdown list.
  • Department Heading Title: Enter heading title for Department Listing page here.
  • Department Heading Background Image: Choose heading background image for department page. It will be displayed on header of department page.
  • Departments List Layout: It can be with right sidebar and with left sidebar. And you need to choose layout with sidebar for your department page.
  • Department List Sidebar: Select sidebar for department page from dropdown list.
  • Items Per Page: The number of departments which will be displayed on department listing page.
  • Grid columns: The columns attribute controls width of columns should be displayed on Department Listing page. You can choose from 2 to 4 columns.

Single Department

Single Department Layout: Choose Single Department same as Department Listing by checking the boxes beside options or uncheck to choose another layout.

Doctor

This section will help you to configure Doctor Page. Firstly, assign a page as Doctor Page from dropdown list. Once you choose a page as Doctor Page, its slug will be your Doctor’s main slugs.

  • Doctor Page: Select a page as Our Doctor page from dropdown list page.
  • Doctor Layout: It can be full-width, with right sidebar and with left sidebar, if you choose layout with sidebar, select sidebar for doctor page.
  • Doctor Sidebar: Select sidebar for doctor page.
  • Grid Columns: The columns attribute controls width of columns should be displayed on Doctor Page. You can choose from 2 to 4 columns.
  • Items per Page: The number of doctors which will be displayed on doctor page.
  • Doctor Heading Background Image: Choose heading background image for doctor page. It will be displayed on header of doctor page.
  • Content of contact with doctor (HTML): Enter the custom HTML here. This Custom HTML will be display near footer of Doctor Profile page.

In Medicus theme, we use this custom HTML:

<h3>Want to meet our doctors for medication?</h3>

Our receptionist will arrange appointment for you

  • Link Make an appointment: Enter the link which will be displayed when you click on “Make an appointment” button of Doctor Profile page.

Custom Code

In this section you can add custom JavaScript and CSS to your site. You Google analytics tracking code should be added to Custom JavaScript field.

Import/Export Setting

All themes from NooTheme share the same theme settings structure so you can export then import setting from one theme to another conveniently with our any problem.

  • Import Settings: Click Upload button then choose a JSON file (.json) from your computer to import setting to this theme. All the settings will be loaded for preview here and will not be saved until you click button “Save and Publish”.
  • Export Setting: Simply click Download button to export all your settings to a JSON file (.json). You then can use that file to restore theme settings to any theme of NooTheme.

Login