I’ve decided to write the following post about very common issues you might have with Matrix themes which can be solved very quickly and easily. I would like to remind you that you can always send me an email filling out the form from support page

A Matrix theme itself is independent from standard Jimdo template. It means: once you switch off the custom layout and select one of default Jimdo template, you will disable all custom styles and jQuery plugins . This will help you to understand whether the error is in custom code or internal system.

12/12/2016

The problem with documentation links is due to the recent Jimdo system change (http://hilfe.jimdo.com/faq/fehlermeldung-https/ )

You can fix this problem following the quick tutorial in page 'updates' of my website

If your website has been updated with new Jimdo Editor, the Matrix Themes button will be available anyway  and can be found at the bottom of the page.

Here's a quick tip how to fix it:

1) Go to Design>Custom Template >CSS and find the following line: 

.matrix .cd-btn{
   display:block;
   text-align:left;
   font-size:14px;
   background: #c0d34b;
   text-decoration:none!important;
}

2) Remove it and place the below code:

.matrix .cd-btn{
   position:fixed;
   bottom:0;
   left:0;
   width:100%;
   z-index:999999;
   font-family: "Brandon Text",Asap,Verdana,Arial,sans-serif!important;
   display:block;
   text-align:left;
   font-size:16px;
   padding:5px 20px;
   background: #F4F5F9;
   border-top: 2px solid rgba(50,51,53,.05);
   color:#747781!important;
   text-decoration:none!important;
}

.matrix .cd-btn:before {
    content: "\f0c9";
    font-family: FontAwesome;
     padding:0 5px 0 0;
 }

.matrix .cd-btn:hover {
   background:#E6E7F0!important;
}

Save it and refresh the page. The new Matrix themes button now in admin mode will look like this:

1) Copy the HTML code using a simple text editor (designs> custom template> html)

2) Copy the CSS code using a simple text editor (designs> custom template> html)

3) Copy the links you will find in Edit HEAD section (settings> edit HEAD)

4) Save all files on your computer. Go to designs > custom template> files. Clicking the file name, it will be opened in a new tab of your browser. With the right  mouse click, select "save file as.."

1) Upload all files ( designs>custom template>files )

2) Paste the HTML ( designs>custom template>html )

3) Paste the CSS styles ( designs>custom template>css )

4) Click the save button to save all changes

5) Add the links to Edit HEAD area ( settings>Edit HEAD )

6) Disable the Jimdo mobile version ( settings>mobile view )

The overlay filter has been added to the Matrix themes using fullscreen slideshow, image or video. You can change the opacity value or remove it completely in CSS.

Find the below part of code in your CSS folder:

/* overlay */
.backstretch:after,#tubular-container:after{
    background-color: rgba(52,52,52,0.7);
    content:'';
    width: 100%;
    height: 100%;
    top:0;
    left:0;
    position: absolute;
}

Change the value in red color from 0.7 to 1 if you wish to remove it completely or just change it for your own preference ( 0.6, 0.5, 0.4 etc ).

The overlay filter can be removed in the latest version of Matrix themes  by adding a body class 'no-hero-overlay'

The global link color can be setup in Style tab of Jimdo sidebar. Usually, it has the same color as the brand color  that you're using in CSS

If your brand color is hardy visible on the dark background of footer or other section, you can solve this problem with helper classes.

Let's take an example of your links in bottom footer section. 

Just go to Templates>custom template> html and find the following section:

<div class="footer-btm color-white">
            <div class="inner cc-clearover">
                <div class="gutter">
                    <var>footer</var>
                </div>
                <!-- end gutter -->
            </div>
            <!-- end inner -->
        </div>
        <!-- end footer btm -->

As you can see, in this section a simple text color will be white ( color-white ) and the links by default will have the same color as you selected in Jimdo style tab.

In below example is shown how to change the default link color into the grey:

<div class="footer-btm color-white link-grey">
            <div class="inner cc-clearover">
                <div class="gutter">
                    <var>footer</var>
                </div>
                <!-- end gutter -->
            </div>
            <!-- end inner -->
        </div>
        <!-- end footer btm -->

All available helper classes for the links are:

• link-white
• link-grey
• link-dark
• custom-link

By default, there are 2 images  for parallax effect. If you wish to change them for your own ones, just upload  2 files parallax.jpg and parallax2.jpg to the file directory ( Templates>custom template>files ). Then take an example of code from "shortcodes" section.

Problem: sometimes, even if you change the images, you might still see the old Matrix themes parallax images. In this case, go to CSS ( Templates>custom template>css) and make any change. You can change any sign or letter and then replace it again. Clicking the save button, you will update the CSS folder and should see the new images you have uploaded.

The suggested image size is 1200x800px

Go to google maps and type the correct address. Click the share button and select "Embed Map". Copy the URL link without iframe and place it to the custom widget:

<!-- ************* Overlay teaser with Google Maps ************* -->
    <div class="hs-thumbnail">
        <img src="https://u.jimcdn.com/e/o/s1aeecbbb2a5865b1/userlayout/img/teaser3.jpg" alt="" />
        <div class="thumbnail-hover">            
<a class="popup-gmaps" href="https://maps.google.it/maps?q=milan+italy&ll=45.465458,9.186502&spn=0.016163,0.038452&hnear=Milan,+Lombardy&gl=it&t=m&z=15&iwloc=A"></a>
        </div>
    </div>
<!-- ************* End Google Maps ************* -->