Cherry Framework 4 header not using full page width when breadcrumbs are disabled

When you disable breadcrumbs in Cherry Framework 4, it still reserves space for it in the header/title section of the page. This is a bit annoying, because it makes the title wrap when there still is space on the right side.

A simple CSS solution can fix this. By applying this, the breadcrumbs will not be visible even if they are enabled again.

.cherry-breadcrumbs .col-md-5 { /* no breadcrumbs, title in full width */
width: 100%;
}
.cherry-breadcrumbs .col-md-7 { /* no breadcrumbs, hide the breadcrumb container */
display: none;
}

Add custom favicon.ico to T3 bootstrap framework for Joomla!

When you are using the T3 bootstrap framwork for Joomla! to create a Joomla! responsive template, an easy way to use a custom favicon.ico is to just replace the file templates/t3_bs_blank/favicon.ico with your own.

This is fine – until you update the T3 framwork. Then your custom favicon.ico will be overwritten with the default file.

This is a solution:

  • Create an override of the file templates/t3_bs_blank/tpls/blocks/head.php and place it in templates/t3_bs_blank/local/tpls/blocks/head.php
  • Add the following code last in the file:
    <!-- LOCAL FAVICON.ICO -->
    <?php
    if (is_file(T3_TEMPLATE_PATH . '/local/favicon.ico')) {
    $this->addFavicon(T3_TEMPLATE_URL . '/local/favicon.ico');
    }
    ?>
    <!-- //LOCAL FAVICON.ICO -->
  • Now put your custom favicon.ico in templates/t3_bs_blank/local

Now your custom favicon.ico will survive updates of the T3 framework.

How to vertically center text in a div

This is a neat way of centering text in a div. Live demo here.

 

<html>
<head>
 <title>Vertical text center demo</title>
</head>
<body>
<style>
.textbox {
 height: 200px;
 width: 300px;
 text-align: center;
 font-size: 14px;
 font-weight: bold;
 background-color: blue;
}
.textbox p {
 height: 100%;
 display: flex; /* vertically center text */
 justify-content: center;
 align-content: center;
 flex-direction: column;
 margin: 0 50px;
 color: white;
}
</style>
<h1>Vertical text center demo</h1>
<div class="textbox">
 <p>This text is vertically centered in the box</p>
</div>
</body>
</html>

Magento2 System Upgrade fails via Setup Wizard – Error in Update!

When trying to upgrade Magento from 2.0.2 to 2.0.4 I got a windows saying Update in progress and the last line from the system log says “./composer.json has been updated” then nothing more happens for quite a long time. Finally an error screen displays “Error in Update!”.

To restart the update process while trying to figure out the error i had to manually delete the files var/.maintenance.flag and var/.update_in_progress.flag.

Magento System Upgrade error

Magento System Upgrade error

To make Magento run in Apache we had set php.ini for the web user to memory_limit=1024M and according to instructions, the cron jobs should be called with the -c pointing to the php.ini used by the web server, in our case /etc/php5/fpm/php.ini.

No error message revealed why the update failed but I found out that the php.ini we used for cron (/etc/php5/fpm/php.ini) had a memory_limit=128M. By editing this file and increasing it to 1024M the update worked.

Magento and always_populate_raw_post_data readiness test fails

When running the Magento readiness test it failed with the message that always_populate_raw_post_data should be set to -1 since it is running under php 5.6. Even though I tried different methods of setting it to -1 and I could verify it by calling phpinfo(); Magento still complained.

The way I solved is a bit rough and it required that I had full system administrator access to the machine (which I had because it was a dedicated server). This is how I solved it:

echo "always_populate_raw_post_data=-1" > /etc/php5/mods-available/always_populate_raw_post_data.ini
php5enmod always_populate_raw_post_data
service php5-fpm restart
service apache2 restart

Magento “Cron readiness check failed” solved

First of all, check the Magento guide on this problem here.

In my case, at first I didn’t get any errors in the cron logs in <web-root>/var/log. When running the scripts by hand as the website user I got the not so informing “Cron readiness check failed” in the <web-root>/var/log/update.cron.log.

The reason the “Cron readiness failed” was actually due to some files in the file and directory structure in the web root that can not be written by the cron update script. In my case I used the AWstats package to create website statistics placed in a directory called /stats. This directory and it’s file was not writeable by the cron script, causing it to fail, even though the directory /stats and it’s files are not a part of Magento.

I discovered this by investigating the content of the file var/.update_cronjob_status. In this file you can find important information on why the cron update script is failing.

PHP Parse error: syntax error, unexpected end of file in XXXXX.php

  • Check that you have spaces around curly braces, i.e. for example don’t use <?php}?> but instead use <?php } ?>
  • If your script has been running without problems on earlier versions of PHP but you are now running PHP 5.4 or later, replace all occurrences of <? with <?php

Vivotek PT7137 rtsp stream to webpage using VLC plugin

One way of getting the video from Vivotek PT7137 to a webpage is by using the VLC plugin and connect the rtsp stream.

However, in current version of Chrome the VLC plugin is no longer supported. Instead it is suggested to use HTML5 to embed video, but rtsp is not supported in Chrome so it is kind of a dead end there for the moment. This solution works in for example Firefox.

In the webpage where you would like to add the stream:

<object classid=”clsid:9BE31822-FDAD-461B-AD51-BE1D1C159921″ codebase=”http://download.videolan.org/pub/videolan/vlc/last/win32/axvlc.cab” id=”vlc”>
</object>
<embed type=”application/x-vlc-plugin” pluginspage=”http://www.videolan.org” autoplay=”yes” loop=”no” width=”600″ height=”340″ target=”rtsp://USERNAME:PASSWORD@IPADDRESS:554/live.sdp” />

Replace USERNAME, PASSWORD and IPADRESS with real values for your Vivotek PT7137 camera. It might be a good idea to create an account in the Vivotek PT7137 to use from the web as the username and password will be visible for anyone who inspects the webpage source code. That said, putting the root user account and password here would be considered stupid 🙂

Tip for Joomla users: If you include this code in a Joomla site, include {emailcloak=off} before the above, because the @-sign will trig Joomla email cloaking beliving it is an email address.

CSS background-position not working on Android Mozilla

In order to position a background image inside a div I tried to use the CSS3:

background-position: right 10px center;

The goal was to position the background image to the right of a div container, 10px from the right edge and vertically centered. This worked fine in most browsers. However, in the Android devices using the native Mozilla browser the background was positioned at 0,0 (i.e. left top).

The solution was to use:

background-position: right center;

and edit the background image where I added 10 px of extra transparent space into the image.

How to convert a SVG (scalable vector graphics) image to PNG

This method aims at Windows users but similar methods are probably also useable in other environments.

  1. Right click on the SVG image file and select Open with
  2. Select Internet Explorer
  3. In Internet Explorer right click on the image and select Save image as
  4. In the File Format box switch from Scalable Vector Graphics (*.svg) to PNG (*.png) 
  5. Click Save

For Ubuntu there is a simple solution described here -> http://www.upubuntu.com/2012/06/how-to-convert-svg-files-to-other-image.html