?
     
    24. December 2017

    Make it Special - New Jimdo Theme Tjörn

    Make it Special


    Tjörn is a multi-purpose Jimdo theme based on custom layout, you can use it for creating business website for agency or promoting your services and comes with power full features, advanced Matrix themes option panel to help you easily customize it the way you want to fit your need. Find out all new features and design details of the latest release of Tjörn theme.

    Creative Animated Navigation

    Custom header

    You can choose  the default dark or custom white header for your website by simply adding the  body class "has-custom-header"

    See details

    Fullwidth version

    By default, Tjörn theme has boxed layout which can be changed for full width by adding the body class "fullwidth-version"

    See details

    Make you images fullscreen

    Now you can decide to use in header the original image size of fullscreen

    See details

    Check the demo

    Multi purpose

    Multilingual


    Explosion


    Example of Tjörn theme

    How to use Custom header


    If you wish to display the white header in specific page, just go to Settings > Edit Head > Pages and add the body class 'has-custom-header'


    To setup globally the white header in all pages, the body class 'has-custom-header' needs to be added to the following line in HTML ( custom layout > HTML ) 


    
 <div class="global-colors brand-bg brand-link large-inner has-custom-header">
     ...

    How to add fullwidth version



    To change the boxed layout for fullwidth version, you need to add the body class 'fullwidth-version' to the following line in HTML ( custom layout > HTML ) 


    
 <div class="global-colors brand-bg brand-link large-inner fullwidth-version">
     ...

    Example of using fullscreen header


    Additional class 'is-fullscreen" will make your image fullscreen 


    
 <!-- ************* Fullwidth image ************* -->
<div id="image-fullwidth">
    <div class="item is-fullscreen">
        <div class="hs-overlay bg-gradient">
        </div>
        <div class="btm-arrow">
        </div>
        <img src="https://u.jimcdn.com/cms/o/se69ebd3074c91d80/userlayout/img/tjorn-header.jpg?t=1513509996" alt=""/>
        <div class="carousel-caption animated fadeInLeft">
            <div class="inner">
                <h1 class="color-white big weight-600 left-align">
                    It's time for custom design
                </h1>
                <br/>
            </div>
        </div>
    </div>
</div>

<div class="matrix-msg invisible">
    Edit here your fullwidth image
</div>

    5 good reasons to choose Matrix Themes


     

     

    read more

     

     

    Tags: new

    Write a comment

    Comments: 0

    Quick links

    hide-in-doc-page

    Share it


    draggable-logo

    Showcase

     

    Main colors
       bg-primary
       bg-primary-light
       bg-primary-dark
       bg-secondary
       bg-secondary-dark
    Template sections
       body
       top-header
       header
       content
    Footer Styles
       background
       text color
       link color
       horizontal line
    Buttons
       style 1
       style 2
       style 3
    Other elements
      social icons
      navigation color
      subnav background
    Mobile navigation
       background color
       navigation color
    Template configurations
    has-center-nav g-font
    navigation styles
    size-15 weight-400 snip-nav is-uppercase --line01
    content styles
    form-white
    footer styles
    o-form  color-white
    Typography
    Heading H1
    weight-600 is-uppercase
    Heading H2
    weight-600 is-uppercase
    Heading H3
    weight-600 is-uppercase
    Buttons
    weight-600 is-uppercase
    Animations
     

    Note:     All changes made here will be applied to your entire website.
    is-switcher admin-only

    MATRIX THEMES

    STAND OUT WITH A PROFESSIONAL JIMDO WEBSITE