• Home
  • Templates
    • Zion
    • Alsten
    • Lemberg
    • Bergen
    • Altona
    • Hafen
    • Enkel
    • Horten
    • Agen
    • Hisingen
    • Tjörn
    • Lacksund
    • Öland
  • Page builder
  • Support
  • Blog
  • Home
  • Templates
    • Zion
    • Alsten
    • Lemberg
    • Bergen
    • Altona
    • Hafen
    • Enkel
    • Horten
    • Agen
    • Hisingen
    • Tjörn
    • Lacksund
    • Öland
  • Page builder
  • Support
  • Blog
    12. December 2022

    Matrix themes - Updates #05

    The latest updates of Matrix Themes including the new features, bug fixes and much more.

    You will also find some further customizations  of custom widgets with the live examples.

    01. Matrix variables

     

    Updated the style editor for Matrix Themes and Page Builder. From now on you can apply the custom styles using the variables tags without reloading your page*.

     

    Youtube content is not displayed due to your cookie settings. Click on the functional YouTube cookies in the cookie banner to agree to load and display content from YouTube.

    For the variable tags 'draggable-hero' and 'draggable-logo' you'll need to refresh the page anyway while for all other tags it's enough the click the button 'apply the styles' to see the live changes.

    02. Carousel

    Stand out with a professional Jimdo website

    Read more

    Make dreams come true

    Read more

    Work with the professionals

    Read more

    The custom carousel has been updated with latest version and now available with the additional styles:

    • content carousel
    • fullwidth carousel
    • fullscreen carousel
    • tile carousel
    • fullwidth carousel
    • quote carousel
    • service carousel
    • testimonial carousel
    • logo carousel
    • showcase carousel
    • portfolio carousel
    Live Preview

    How to update

    1. In admin Matrix Themes select the section 'Updates' and download the CSS file 'libraries.css'. including the latest version of the owl carousel. Then upload the file to your own website ( Menu> Design> Custom Template> Files ).

     

    2. On the same page download the latest js file (matrix-1.9.6-min.js) and upload it to your own website.

     

     

    The shortcodes

    The content carousel can be found in the section 'shortcodes' of the matrix theme admin menu while all other versions - in section 'Add-ons'

    03. hamburger menu styles

    Updated the global styles of the hamburger menu. Now it has more classic design with 3 black lines.

    If you want to update your own template with the latest styles, just replace the previous mobile menu styles in CSS ( see below code) and  in HTML you'll need to remove the class 'hidden' from the second span 'middle'.

    new styles
    old styles
    
    /* overlay menu */
    .button_container {
        position: fixed;
        top: 10px;
        right: 10px;
        height: 26px;
        width: 30px;
        border:none!important;
        border-radius:2px!important;
        cursor: pointer;
        z-index:1999999;
        background-color: rgba(255,255,255,0.6);
        -webkit-transition: opacity .25s ease;
        transition: opacity .25s ease;
    }
    .button_container.active {
        background-color: rgba(255,255,255,0.8);
        height: 27px;
    }
    
    .button_container:hover,.button_container:focus {
        opacity: .9;
    }
    
    .button_container.active .top {
        -webkit-transform: translateY(9px) translateX(0) rotate(45deg);
        transform: translateY(9px) translateX(0) rotate(45deg);
        background: #000;
        top: 4px;
        width: 21px;
    }
    
    .button_container.active .middle {
        opacity: 0;
        background: #fff;
    }
    
    .button_container.active .bottom {
        -webkit-transform: translateY(-9px) translateX(0) rotate(-45deg);
        transform: translateY(-9px) translateX(0) rotate(-45deg);
        background: #000;
        top: 22px;
        width: 21px;
    }
    
    .button_container span {
        background: #000;
        border: none;
        height: 2px;
        width: 20px;
        position: absolute;
        top: 5px;
        left: 5px;
        font-size:0;
        -webkit-transition: all .35s ease;
        transition: all .35s ease;
        cursor: pointer;
    }
    
    .button_container span:nth-of-type(2) {
        top: 12px;
    }
    
    .button_container span:nth-of-type(3) {
        top: 19px;
    }
    
    .overlay {
        position: fixed;
        z-index:1999998;
        background: #000;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        opacity: 0;
        visibility: hidden;
        -webkit-transition: opacity .35s,visibility .35s,height .35s;
        transition: opacity .35s,visibility .35s,height .35s;
        overflow-x:none;
        overflow-y:auto;
    }
    
    .overlay.open {
        opacity: .98;
        visibility: visible;
        height: 100%;
    }
    
    
    

    04. Template update

    The latest updated template is Horten, available in multi purpose ( dropdown and mega menu) and multilingual version.

    The new Jimdo template with professional and modern design - Lemberg is-100  jimdo-template

    Multi purpose

    Live Preview

    The new Jimdo template with professional and modern design - Bergen is-100 jimdo-template

    Multilingual

    Live Preview


    05. Page builder updates

    Matrix Page Builder v.6.2
    Matrix Page Builder v.6.2

    What's new:

    - Fixed bug with the module 'columns' in footer. In previous version the footer elements disappeared after having adding the js code;

    - Added the new version of the carousel;

    - Updated the style editor with the live preview of the draggable tags;

    Matrix Page Builder
    tagPlaceholderTags: m-updates

    Write a comment

    Comments: 2
    • #1

      sas (Friday, 20 January 2023 10:49)

      When I click Add-ons for other versions CAROUSEL
      The carousel codes are not displayed on the page
      Where's the problem

    • #2

      Matrix themes (Friday, 20 January 2023 10:58)

      @sas probably you haven't updated the template with CSS and JS.

    Support

    • Docs
    • Guides
    • Style Editor
    • Global Updates
    • Theme Updates
    • Helper classes
    • Common support issues
    • Contact

    Features

    • Templates
    • Page Builder
    • Add-ons
    • Landing pages
    • Alt Classes
    • Matrix variables

    Get inspired

    • Most popular templates
    • Website examples
    • Custom widgets
    • Block Elements
    • Fluid Sections

    Quick links

    • Marketplace
    • Pricing
    hide-in-doc-page

    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
       text color
    Other elements
      social icons
      navigation color
      subnav background
    Mobile navigation
       background color
       navigation color
    Template configurations
     
    has-center-nav g-font has-large-header
     
    Navigation styles
     
    size-15 weight-400 snip-nav --line01 is-uppercase
     
    Content styles
     
    form-white
     
    Footer styles
     
    o-form color-white

     

    Typography

    Heading H1
    weight-600 is-uppercase
     
    Heading H2
    weight-400 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

    MATRIX THEMES

    STAND OUT WITH A PROFESSIONAL JIMDO WEBSITE

    About | Privacy Policy | Cookie Policy | Sitemap
    Created with Jimdo
    Log in Log out | Edit
    • Scroll to top
    Close