How to include more symbols into your WordPress blog’s social link menu

WordPress Twenty Sixteen Social Menu with
default symbol for unknown link targets

For my blog, I use the WordPress theme Twenty Sixteen that supports adding links to my profile on typical social media sites like Facebook, Twitter, Instagram et al. For these well-known names, the theme automatically inserts company logos in the circular link symbols:

For smaller sites, the bundled Genericons font however does not provide those symbols. In my case, I wanted to add a symbol for the federated social networks Diaspora* and Mastodon, as well as set a custom paperclip symbol for my oj.do shortlink domain. Additional constraint: I only wanted to modify my own Twenty Sixteen child theme, so that I could continue benefiting from updates in the parent theme. Here’s how I did it:

Continue reading “How to include more symbols into your WordPress blog’s social link menu”

How-to make WordPress theme Twenty Sixteen completely dark

Through a custom child theme and 6 carefully built CSS rules, I have completely darkened all remaining bright elements of my WordPress installation. Here’s the result.

Roughly each year, WordPress releases a new default theme that ships with a fresh WordPress installation. As of writing, this blog relies on Twenty Sixteen. Through its Customize option, it is possible to change most colours of the theme without having to dive into the editor at all. However, this left me with some elements that were to bright for my taste: text inputs, buttons and widget borders. So I had to use some custom styles to complete the transition. Read on for all the boring details! 🙂 Continue reading “How-to make WordPress theme Twenty Sixteen completely dark”

How to add subcategories to templates in WordPress

This is the snippet I have added to my category template in my blog’s child theme. I paste the following snippet usually after the taxonomy-description paragraph. This is how it looks (the two paragraphs Parents and Subcategories):

category-parents-and-subcategoriesThis is the code:

<?php
    $parents = get_category_parents($cat, true, " +++ ");
    $parents = explode(" +++ ", $parents);
    $parents = array_slice($parents, 0, -2);
?>
<?php if ( count($parents) > 0 ) : ?>
<div class="taxonomy-parents"><em>Parents:</em> <?php print(implode(', ',$parents)); ?></div>
<?php endif; ?>

<?php
    // Subcategories
    $list = wp_list_categories('depth=-1&amp;orderby=name&amp;style=none&amp;echo=0&amp;title_li=&amp;child_of='.$cat); 
    $list = substr(trim(str_replace('<br />', ', ', $list)), 0, -1); // replace newlines by commas, trim whitespace, cut of final comma
?>
<?php if ( !preg_match("/No categorie/",$list) ) : ?>
<div class="taxonomy-subcategories"><em>Subcategories:</em> <?php echo $list; ?></div>
<?php endif; ?>

And then in the (child) theme’s stylesheet, add suitable specification. In my case, I stick to the precedence of similar paragraphs in the Twenty Sixteen theme:

.taxonomy-parents, .taxonomy-subcategories {
    color: #686868;
    font-size: 0.8125rem;
    line-height: 1.6153846154;
}