Fun Recent Finds

Over the last few weeks I have found some really cool things I wanted to share…

  • Architectural Artifacts. If I could – my entire home would be comprised of things from this place. Urban Remains
  • Bracelets. If you know me – you are you know I would only post something about jewelry if I really thought it was something special. For those of you who do not know me – I am not a jewelry person at all – but these might make me one: Spectrum Bracelet Rainbow
  • TV show. If you have HBO and you have not seen this yet – take an hour today and give it a shot: The Night Of
  • Podcast. I first heard Claude VonStroke almost ten years ago and his podcast is still one of my favorite today. Claude VonStroke presents The Birdhouse
  • YouTube channel. I am not sure how – but I get sucked in every time with: Oddly Satisfying Videos

Add Bootstrap Classes to the Next and Previous Image Buttons

When viewing media (usually the image.php template) within WordPress – there are buttons to browse the next and previous buttons that you might want to customize if you are creating a Bootstrap WordPress them. If this is the case – styling the buttons with Bootstrap is easy. You can simply add the following to your theme’s functions.php file.

 * Add CSS class to image navigation links.
 * @wp-hook previous_image_link
 * @wp-hook next_image_link
 * @param   string $link Complete markup
 * @return  string
add_filter( 'previous_image_link', 'lucidity_img_link_class' );
add_filter( 'next_image_link', 'lucidity_img_link_class' );

function lucidity_img_link_class( $link ) {
    $class = 'next_image_link' === current_filter() ? 'next' : 'prev';
    return str_replace( '<a ', "<a class='btn btn-default $class'", $link );

Note – you can change the btn-default class to btn-primary or whatever you need.

ABC’s The Goldbergs

When I first saw this show advertised I thought to myself “this looks like a great show”…and that was it. FINALLY I caught a few episodes and as expected – I love it. It is based in the 1980s from a young boy’s perspective. Growing up the in 1980s myself – the episodes I watched really brought my back to my childhood – with my tape collection and all great things from that decade.

If you have not seen it – give it a look: New episodes will be available this fall.

Add Bootstrap Button Classes to the WordPress Comment Form

Looking to stylize that WordPress comment button on the WordPress comment form? Adding the correct classes needed to the comment form button are as easy as finding where comment_form() is called in your theme. In my cases – this is within the comments.php file.

Once you find that – you just need to change

$args = array(
'class_submit' => 'btn btn-default',
comment_form($args )

There are a number of modifications you can make to the comment form (changing button text, changing labels, adding notes, etc that you can make with the comment_form() function which are worth looking at here:

Good Ol’ Siri

Siri Knows Who I Am

I love Siri. She helps me with measurement conversion (especially helpful during these Olympics and all the metric conversions), driving directions, game scores, figuring out what song is on, and making sure I remember who I am 😉

Thanks Siri!

If you have an Apple device with Siri and are not using her – get inspired: What to ask Siri

Add Bootstrap Classes to WordPress Widgets

When creating your Bootstrap WordPress themes, you will notice the sidebar widgets (archives, categories, etc) which use dropdowns do not share the Bootstrap styling because there is no place easily accessible to add in the needed classes or CSS.

Considering the options – here are two ways you can turn those default selects into something that matches the rest of your beautiful Bootstrap site.

Add a filter in your functions.php file

This is specific to the category dropdown. I was hoping we could use the same on the widget_categories_dropdown_args filter, but that is not possible as of WordPress 4.6. (see next example to address this). This filter works great if you use the categories widget and no other that display a select.

 * Add CSS class to sidebar category selects.
add_filter( 'widget_categories_dropdown_args', 'lucidity_widget_categories_dropdown_args' );
function lucidity_widget_categories_dropdown_args( $args ) {
    if ( array_key_exists( 'class', $args ) ) {
        $args['class'] .= ' form-control';
    } else {
        $args['class'] = 'form-control';
    return $args;

Add some Bootstrap CSS to your style.css file

This works great if you have multiple selects displayed within your widgets. Note: the sidebar in the example has an ID of “sidebar”. This CSS is brought over from the Bootstrap .form-control style.

#sidebar .widget select {
display: block;
width: 100%;
height: 34px;
padding: 6px 12px;
font-size: 14px;
line-height: 1.42857143;
color: #555;
background-color: #fff;
background-image: none;
border: 1px solid #ccc;
border-radius: 4px;
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
-webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
-o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;

I hope this helps make your site a bit more cohesive with the Bootstrap styles!

Today’s Workout

Each Friday – I try to push myself a bit and do a different workout.

Today – I did 2 rounds of this: along with 4 battle rope stations – each for 30 seconds on/10 off x2 (two times at each station).

In between the two rounds I then did a set of 20 goblet squats holding a 17lb kettle bell, at the bottom of the squat, extend the kettle bell all the way down so your arms are straight. Keep it there as you go back up in the squat, then do a bicep curl (that is one set) Do 20 in total. After that, I grabbed the next heaviest kettle bell and did tricep extensions.

To wrap it up – a few minutes of running, then stretching.