Dear gpEasy users and developers!

I believe the question should have been emerged before, but unfortunately I could not find it. Can anybody, please, explain me how can the content of footer in standard (i.e. Bootswatch) theme be manually changed?

I mean the footer where there are links to gpEasy website, sitemap and login. I know that these three can be hidden through admin menu, but is there any way to add a new link in the footer?

Hi Stan,

you can edit your template.php, e.g. /themes/Bootswatch_Flatly/4_Sticky_Footer/template.php and replace the whole footer with this:

    <div id="footer">
      <div class="container">
        <div class="row">
          <div class="col-md-4"><?php gpOutput::Get('Extra','Footer1'); ?></div>
          <div class="col-md-4"><?php gpOutput::Get('Extra','Footer2'); ?></div>
          <div class="col-md-4"><?php gpOutput::Get('Extra','Footer3'); ?></div>
          <div class="col-md-12"><?php gpOutput::GetAdminLink(); ?></div>
        </div>
      </div>
    </div>

This will create 3 colums for Extra Content.
In gpEasy's Black Admin Toolbox go to Content->Extra Content and create the 3 areas "Footer1", "Footer2" and "Footer3".
You should now be able to edit them in-page.

For the footer height:
The "Sticky Footer" Bootswatch themes have a fixed footer height. That's because of the "sticky" CSS trick used. Depending on what you're going to put into the footer, the 60px will not be sufficient. For my example I use 180px (and 360). You will have to fiddle a bit with the numbers to get good results.

Edit /themes/Bootswatch_Flatly/4_Sticky_Footer/styles.less
To change the footer height I recomend to define 2 "footer-height" LESS variables that will be applied several times, as seen below. Since the 3 new columns will expand and render on top of each other below 992px screen width (col-md-4), we'll need an additional mediaquery-ruleset for the "medium" breakpoint. Green parts already exist, blue are new.

@footer-sm-height: 360px;
@footer-md-height: 180px;

/* Wrapper for page content to push down footer */
#wrap {
min-height: 100%;
height: auto !important;
height: 100%;
/* Negative indent footer by its height */
margin: 0 auto -@footer-sm-height;
/* Pad bottom by footer height */
padding: 0 0 @footer-sm-height;
}

/* Set the fixed height of the footer here */
#footer {
height: @footer-sm-height;
background-color: @panel-footer-bg;
}

@media (min-width:992px) {
  #wrap {
  margin: 0 auto -@footer-md-height;
  padding: 0 0 @footer-md-height;
  }
  #footer {
  height: @footer-md-height;
  }
}

HTH!

And note: When you change LESS files you need to be logged-in to get new results. LESS must be re-compiled to CSS after each change - and that only happens when you're logged-in.

I forgot to mention. As always, when themes or addons are edited:

Open Addon.ini and uncomment the Addon_Unique_ID = xxx line by prefixing it with a semicolon:

;Addon_Unique_ID = 245

This will prevent possible updates of the theme/addon which would overwrite your changes.