I tried at least 30 different WordPress themes for this blog and to my surprise, it was really hard to find one that fulfilled all my criteria. Not that I had huge expectations: Classic blog layout, clean aesthetics, easy to read and no huge header image.
After much consideration and a few experiments with other themes, I choose Logistico as it ticked off all the boxes.
The theme itself was easy to set up and easy to customize with a few extra lines of CSS. Only two minor problems remained, but with a little help from Google, I found easy solutions for them.
Remove post modification date from the breadcrumb
Not all, but in case of some post, the date in the header doubled. Instead of showing “Published by Tamás Baka on July 4, 2019” this is what was visible: “Published by Tamás Baka on July 4, 2019July 4, 2019“
It turns out, that the second date was the date of modification. It also turned out that what I thought was the header was actually the breadcrumb, because this was the file that I had to modify to remove the second date:
/wp-content/themes/logistico/inc/class-logistico-breadcrumb.php
All I did was modifying this part:
public function get_time_tags() {
$time = '';
$time .= '<time class="entry-date published" datetime="' . esc_attr( get_the_date( 'c' ) ) . '" content="' . esc_attr( get_the_date( 'Y-m-d' ) ) . '">';
$time .= esc_html( get_the_time( get_option( 'date_format' ) ) );
$time .= '</time>';
if ( get_the_time( 'U' ) === get_the_modified_time( 'U' ) ) {
return $time;
}
$time .= '<time class="updated hestia-hidden" datetime="' . esc_attr( get_the_modified_date( 'c' ) ) . '">';
$time .= esc_html( get_the_time( get_option( 'date_format' ) ) );
$time .= '</time>';
return $time;
}
Where I commented out the lines responsible for the modification date like this:
public function get_time_tags() {
$time = '';
$time .= '<time class="entry-date published" datetime="' . esc_attr( get_the_date( 'c' ) ) . '" content="' . esc_attr( get_the_date( 'Y-m-d' ) ) . '">';
$time .= esc_html( get_the_time( get_option( 'date_format' ) ) );
$time .= '</time>';
/*if ( get_the_time( 'U' ) === get_the_modified_time( 'U' ) ) {
return $time;
}
$time .= '<time class="updated hestia-hidden" datetime="' . esc_attr( get_the_modified_date( 'c' ) ) . '">';
$time .= esc_html( get_the_time( get_option( 'date_format' ) ) );
$time .= '</time>';*/
return $time;
}
The only downside for this solution is that I will have to do it again if the theme is upgraded any time in the future.
Fixing the mobile menu
On mobile phones the page title was broken into two lines and the menu button stuck to it instead of being positioned on the right side. Also under a certain screen width the menu didn’t appear when clicking on the menu button.
To fix the menu I changed a few lines in /wp-content/themes/logistico/inc/hooks/general-hooks.php
<div class="col-lg-3 col-md-12 col-sm-6 col-xs-6 d-flex align-items-center"> ... ... <div class="col-lg-9 col-md-12 col-sm-6 col-xs-6 d-flex align-items-center justify-content-end">
Changed to this:
<div class="col-lg-3 col-md-12 col-sm-12 col-xs-12 d-flex align-items-center"> ... ... <div class="col-lg-9 col-md-12 col-sm-12 col-xs-12 d-flex align-items-center justify-content-end">
Also needed to add some custom css:
.logistico_logo h2 {
white-space: nowrap;
}
.main-navigation ul {
display: block!important;
}
Increase the length of the post excerpt
I use the “More” block after the first paragraph in my posts and I noticed that the auto-generated excerpts were a bit shorter than they needed to be.
First I wanted to edit the theme files again, bug Google rescued me from that task as it showed a better solution in the form of the Custom Excerpt Length plugin.
After installing and activating it, in the Settings > Reading page you can set the word limit for the excerpt and this value will overwrite the excerpt limit in custom themes too.