Latitude Travel Group
  • Home
  • About Us
  • Our Services
    • Meeting Planning
    • Incentive Travel
    • Event Planning
    • Leisure Travel
  • Blog
  • Accolades
  • Contact Us

Theme Info


Weebly Theme: Clean Lines
Picture
This theme was tweaked to support a header slideshow. Some free Weebly themes support a header slideshow, others don't.

In main-style.css, change:
  • .short-header .banner-wrap
to:
  • .short-header .wsite-header

and in the page html:
  • move "wsite-background" into the <body> element
  • <div >



Original short-header.html layout:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
</head>
<body class='short-header  wsite-theme-light'>
<div id="wrapper">
    <div class="bg-wrapper">
        <div id="header">
            <div id="sitename">{logo}</div>
        </div>
        <div id="navigation">{menu}</div>
        <div class="banner-wrap wsite-background"></div>
        <div id="content-wrapper">
            <div id="content">{content}</div>
        </div>
    </div>
    <div id="footer">
        <div id="footer-content">{footer}</div>
    </div>
</div>
</body>
</html>
Tweaked short-header.html layout:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
</head>
<body 'short-header wsite-background  wsite-theme-light'>     /* add 'wsite-background' here */
<div id="wrapper">
<!-- <div class="hg-wrapper"> -->                             /* comment-out this <div> */
    <div id="header">
        <div id="sitename">{logo}</div>
    </div>
    <div id="navigation">{menu}</div>
    <div class="banner-wrap">                                 /* remove 'wsite-background' here */
        <div class="wsite-header"></div>                      /* add this <div> */
    </div>
    <div id="content-wrapper">
        <div id="content">{content}</div>
    </div>
<!-- </div> -->
    <div id="footer">
        <div id="footer-content">{footer}</div>
    </div>
</div>
</body>
</html>

Fonts


Slideshow
Attempting to approximate the font used in the logo, the slideshow uses the Weebly web font "Yanone Kaffeesatz".
The larger titles at slide tops is 50pt, and the smaller text near slide bottoms is 36pt.
An array of styles is applied, to best display text against each image background. A glow in the neighborhood of 50% is often used with a color that exists in the image, plus just the smallest hint of shadow (which is needed for the glow to correctly display).