How to display a width logo above the menu bar on second row?
+-

  • Navigate to “Theme Options” / “General Setting” add the following code to “Custom CSS Code”box
  • @media only screen and (min-width: 768px) { 
        header#siteheader { text-align: center; }
        header#siteheader > .container { width: 100% !important; }
        header#siteheader #logo { display: block;  }
        header#siteheader #logo .logo_inner { margin: 0 auto; }
        header#siteheader #logo .logo_inner hgroup { display: none; }
        header#siteheader #logo .logo_inner > a { top: 18px; position: relative; display: block; height: 80px; }
        header#siteheader nav { position: relative; width: 100%; float: left; height: 85px; margin-bottom: 35px;
     border-bottom: 1px solid #eee; }
        header#siteheader .sf-menu { float: none; display: inline-block; *display: inline; }
    }
  • press “save all options”

How to turn off the thumbnail zoom/move effect on mouse over?
+-

  • Navigate to “Theme Options” / “General Setting” add the following code to “Custom CSS Code”box
  • .widget-container .imgHolder a:hover img,
    .widget-container .imgHolder a:hover img,
    .widget-folio.caption-over .imgHolder a:hover img,
    .widget-folio.caption-over .imgHolder a:hover img {
          -webkit-transform: none;
          -moz-transform: none;
          -ms-transform: none;
          -o-transform: none;
           transform: none;
    }
  • press “save all options”

How to make main menu items transparent?
+-

  • Navigate to “Theme Options” / “General Setting” add the following code to “Custom CSS Code”box
  • /* parent menu active color */
    .sf-menu > li a:hover,
    .sf-menu > li.sfHover,
    .sf-menu > li.sfHover > a {
        background-color: transparent;
    }
    
    /* parent menu active color */
    .sf-menu li.current-menu-ancestor, 
    .sf-menu li.current-menu-ancestor > a ,
    .sf-menu li.current-menu-parent, 
    .sf-menu li.current-menu-parent > a ,
    .sf-menu li.current_page_item , 
    .sf-menu li.current_page_item > a ,
    .sf-menu li.current-menu-item  , 
    .sf-menu li.current-menu-item > a {
        color: #3d3d3d !important;
        background-color: transparent !important;
    }
    
  • Press “save all options”

How to turn on auto-play for blog carousel ?
+-

  • Navigate to “Theme Options” / “General Setting” add the following code to “Custom Javascript Code” box
  • ;jQuery(window).load(function () {
       jQuery(".widget-blog .motion-wrapper").trigger("configuration", {
           auto: {  play  : true, duration : 1000 , infinite    : true, circular    : true, pauseOnHover: "resume"  }
       });
    })
  • Press “save all options”

How to change the tab color
+-

  • Navigate to “Theme Options” / “General Setting” add the following code to “Custom CSS Code”box
  • .widget-tabs .tabs > li a {
       background-color:#eeeeee; /* tab background color */
    }
    
    .widget-tabs .tabs-content,
     .widget-tabs .tabs > li.active a {
      background-color: #ffffff; /* content background color */
    }
    
  • Press “save all options”

How to remove the zoom effect on the portfolio page?
+-

  • Navigate to “Theme Options” / “General Setting” add the following code to “Custom
  • .widget-folio.caption-over .imgHolder a:hover img {
      -webkit-transition: none;
      -moz-transition: none;
      -o-transition: none;
      transition: none;
      -webkit-transform: scale3d(1, 1, 1) translate3d(0, 0, 0) rotate(0.1deg);
      -moz-transform: scale3d(1, 1, 1) translate3d(0, 0, 0) rotate(0.1deg);
      -ms-transform: scale3d(1, 1, 1) translate3d(0, 0, 0) rotate(0.1deg);
      -o-transform: scale3d(1, 1, 1) translate3d(0, 0, 0) rotate(0.1deg);
      transform: scale3d(1, 1, 1) translate3d(0, 0, 0) rotate(0.1deg);
    }
    
  • Press “save all options”

How to change the element color
+-

  • Navigate to “Theme Options” / “General Setting” add the following code to “Custom CSS Code”box
  • .widget-toggle .toggle-header {
       background-color: #eeeeee; /* caption bar background color */
    }
    
    .widget-toggle .widget-inner {
       background-color: #ffffff; /* content background color */
    }
  • Press “save all options”

Phlox Pro is the new generation of Lotus theme
+-

Background

As you may know, Lotus theme was released in 2013 and during these years, this theme has been updated constantly in order to meet the latest web standards and technologies.

During these years, we received a huge number of positive and heartwarming feedbacks which made us even more motivated and pushed us forward to improve Lotus theme persistently.

The Plan

In 2017, we planned for huge improvements in Lotus theme and worked so hard over a year to make this dream happen. As a result, the Lotus was architected from scratch in order to make a versatile and modern theme for 2018 and the years to come.

A Massive Update

While Lotus was redesigned and coded from the ground up, and enormous changes have been applied, we considered a new name for this project. It’s called Phlox Pro!

What is Phlox Pro?

Phlox Pro is the name for the new generation of Lotus theme. In other words, Phlox Pro is the biggest update in the history of Lotus theme, we call it the Lotus version 5!

Phlox Compatibility with Lotus?

While the theme was completely recreated from scratch, some legacy features and elements/widgets were dropped and no longer are supported in Phlox Pro. As a result, the Phlox Pro theme is partially compatible with Lotus. Moreover, all options, widgets, folder structures, and page builder elements are engineered from scratch and differ from what defined in Lotus theme.

 

Can I roll back to Lotus after Trying Phlox?

Yes. Fortunately, the Phlox Pro is released as a separate project (theme), so you can have both Lotus and Phlox theme at the same time on your website which makes you able to switch to Phlox with a single click. Anyone who is the owner of the Lotus theme can switch to Phlox Pro and try and use it without paying extra fees. Your data is SAFE in the database and switching to Phlox Pro does NOT affect or damage your content.

What happens to Lotus?

We love the Lotus theme as you do! So we continue to support and release minor updates for legacy Lotus theme in parallel to Phlox. But we highly recommend you to migrate to the new generation of Lotus (Phlox) in order to take your website to the next level. You can download the latest version of Lotus theme from here: www.averta.net/lotus/latest/

How much does it cost?

It’s totally free for our lovely owner of Lotus theme.