Stefan Helander

How to indicate where a word should wrap in HTML/CSS

/0 Comments/in /by

By using word-wrap, word-break and overflow-wrap in CSS you can control the browser’s behaviour when it comes to word wrapping. However, it is not possible to control where the word breaks. It just breaks when the word no longer fits in the container.

To indicate where a word can be broken, the soft hyphen can be used. The soft hyphen is a html code:

­

For example:

Thisisaverylongword

and we want it to break just after “very”, then we type:

Thisisavery­longword

When the container doesn’t fit the word, it will be displayed on two lines:

Thisisavery-
longword

Stefan Helander

Akeeba Backup restore problem restoring large backup file [Solution]

/0 Comments/in , /by

I had a rather large Akeeba Backup file (about 25 GB) which I tried to restore using Akeeba kickstart from the web browser. It took a long time unpacking the archive but never reached the point where database is being restored.

The Akeeba kickstart (version 5.0 or later) can be run from command line (shell) and this works better with really large backup files. Simply go to the directory where you have your JPA-file which should be the same directory where it should be restored and enter:

php kickstart.php archive.jpa

But of course replace archive.jpa whith your archive name. There are more command line options available.

After unpacking the archive, go with your browser to https://yourdomain.com/installation and complete the restore.

Stefan Helander

Anchor links does not scroll to the correct position

/0 Comments/in /by

There are several issues that can cause local anchor links to not scroll to the right position. The first thing to check is if you have an id-tag that has the same name as the anchor. In this case the browser will scroll to the id position instead. The solution is to name the anchor and id with different names.

Example:

<div name="myanchor">
<p>Some random text</p>
</div>
<a href="#myanchor">Go to some random text</a>

The above example will behave as expected.

But in this example the link will scroll to the h1 instead of the div:

<h1 id="myanchor">
<div>
<p>Some other random text</p>
</div>
<div name="myanchor">
<p>Some random text</p>
</div>
<a href="#myanchor">Go to some random text</a>

To avoid this, make sure the anchors (name) and id have different names.

There are also other sitiuations where the local anchor does not scroll correctly covered in this article.

Stefan Helander

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

/0 Comments/in , /by

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;
}

Stefan Helander

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

/0 Comments/in , /by

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.

Stefan Helander

How to vertically center text in a div

/0 Comments/in /by

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>
Stefan Helander

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

/0 Comments/in , /by

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.

Stefan Helander

Magento and always_populate_raw_post_data readiness test fails

/0 Comments/in , /by

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

Stefan Helander

Magento “Cron readiness check failed” solved

/0 Comments/in , /by

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.

Stefan Helander

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

/0 Comments/in , , /by
  • 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