Responsive Judge Blogs

Mobile is the future. That is was what we heard more than five years ago, but the blogs network is finally catching up…

What changed?

The hamburger button. Yes, that is its official name.
The hamburger button. Yes, that is its official name.

You might have seen that various sites on the network have a new theme, e.g. Magic Judge News or Official Resources. These sites are also optimized to display their content better for devices with a smaller screen, mainly speaking of phones, but also tablets or maybe even your smartwatch. Pages that adapt to this are called responsive.

The most obvious change is the navigation bar, that becomes a hamburger button. We also remove other things from the page like the header image or the sidebar, because we want to focus on the important content.

Why is being responsive important?

More and more the web gets accessed via mobile devices. Imagine judges accessing content during tournaments, conferences, or social activities when multiple judges meet and want to share content with each other. Making your content better accessible for them is a key feature. When looking at the numbers, we can actually see that mobile devices are almost as popular as desktop access:

mobile
Number of sessions in 2015 for the entire network.

In total 17.73% (175,237) of all visits where from iOS (any mobile Apple device) and 26.51% (261,972) came from an Android device. This is a total of 44.24%. In fact this number surprised me a little as I expected it to be higher. Quite possible that the fact that our content wasn’t really well accessible with a mobile device hindered growth in this area. But you see that delivering a good experience to your mobile visitors is important.

Okay, how can I get in on this deal?

The Live Preview allows you to visualize the changes before they go live.
The Live Preview allows you to visualize the changes before they go live.

Glad you asked. We consider this such an important feature that at some point in the future we will require all blogs to switch to the new theme. This deadline is not yet defined, but you will know well in advance. Until then we encourage your site to switch as soon as you feel comfortable to. There are certainly still a couple of bugs on our side to iron out and the more people use the new theme, the quicker we will find and fix those bugs.

The various things you can customize. Important are only the header image and the menus.
The various things you can customize. Important are only the header image and the menus.

Here is how you switch:

  1. Go to your admin panel for your blog.
  2. Select Appearance > Themes.
  3. Click on “Live Preview” of the Judge Familiar Theme.
  4. Change your header image to the one you had before. You might have to slightly crop it, as the new theme is slightly wider.
  5. Select the menus you had before.
  6. Save your changes.
  7. Browse your blog and make sure things look the way you want to.

As mentioned before, we certainly expect some bugs to pop up. Please don’t hesitate to report those. We can best reached over the Judge Apps forum. We will reach out to the high-traffic blogs over the next week and help them migrate to the new theme.

Search engine now powered by Google

Turns out the default search options on the blogs network are not as powerful as we’d like them to be. That is why we explored new options and integrated Google custom search. What does this mean for bloggers?

First of all this will only affect blogs that provide their readers with a way to search their blog. Many of you actually do not do that. If you’d like to offer this, a search is simply a Widget that can be added to your pages.

If users now enter their search term their, the results page will look slightly different and hopefully provide accurate search results. A new feature though is the link to searching the whole network. That is right, one can now search the whole blogs network with one simple search bar.

New navigation bar
New navigation bar

This is such a great feature that we included it in the header bar as well. And because the site-wide search also searches the wiki it offers users a convenient way to quickly search the content they are looking for.

If a reader uses a Widget on your blog to search, they’ll first be shown results only for your blog, and be presented a link to easily search everything.  If a reader uses the search box in the very top bar, they’ll immediately search everything.

Judge Blogs goes international!

One feature that has been requested multiple times in the past for the Judge Blogs Network is Internationalization, or simply put the possibility to provide content in multiple languages and link them all together. Well, after quite some work we can finally present solutions for this request.

Before I explain the details, I would like to mention that these changes might be a bit overwhelming for you, if you are not too familiar with WordPress. But as always, we are there to provide you full and detailed support. So feel free to contact us via the forums, if you need any assistance with this transition.

Judge Blogs is able to offer Blog owners two ways to link to translated content. We choose to split this up, because we have to deal with two quite different use cases.

Use Case 1: Partial translations on external pages

Example Language Links
Example for a Chinese translation link on a Judge Article

Some of your content might get translated without even knowing it! Ever wondered where this Chinese ping-back came from? Well, it is time to link to such content in a more prominent way. This might then look like the example on the left.

There can be any number of languages associated with one post or page and they can point to any other webpage. The idea is, that this is actually a link to a translated not hosted on the Judge Blogs Network.

 

To enable this feature on your blog, you need to go through the following simple steps:

  1. Enable the plugin Language Links.
  2. Add the language links to your post.

1. Enable the Plugin

Also in your Admin Dashboard you can find the Menu Posts > Plugins. In this list of available plugins, find the Plugin named Language Links and enable it.

2. Add Language Links to your post

Details to add a language link
Details to add a language link

Now you are ready to add these language links. When you edit an existing post or add a new one, you will now find a box named “Language Links” on the bottom. There you can add any number of languages with the respective links.

Use Case 2: A fully translated website

In the second case you host a webpage and wish to translate all or at least most of your content to one or more languages. Most likely you have a translation team ready when you release content, so that there is little delay between the releases in different languages. Maybe in the past your languages were separate blogs with separate addresses. Well now we can merge those pages!

To make your blog ready for a full internationalization a couple of changes and set-up is required. A more detailed explanation can be found here.

Judge Blogs launches its official theme

So far the only available theme on the network has been the Twenty Ten Theme, released by WordPress itself. We still like the simplicity and style of this theme, but also reached certain limitations when it comes to developing future features of the network. Thus we decided to take the current theme and adapt it to our specific needs. The result is the Judge Blogs Theme!

The new theme should be fully compatible with your existing content and won’t change any major parts of the layout. It only contains some small tweaks on the typography like fonts and colors. But it offers you more features, for example:

And more features are coming!

Can I have a preview?

Of course you can! The theme is already active on the root blog page and the popular Judge Articles page. You can also preview the theme on your own blog before activating it.

How can I switch to the new theme?

You can select the theme in your Admin Dashboard in the Menu Appearance > Themes. It is called Judge Blogs.

Where is my header picture?

Unfortunately the Theme switch resets the header picture for the blog. But as we did not change the dimensions of the picture, you should be able to reset it quickly without any cropping. You can find this under Appearance > Header.

I now see only excerpts on my front page

Content options in the customizer
Content options in the customizer

Yes, the default option currently is to show only excerpts instead of full posts on the front page. Either you keep it like that, or you can change this behavior. Simply click “Customize” on the theme and select your preference in the Content Options tab (see example left).

Do I have to switch the theme?

Not right away. We keep the old one available for the next couple of months. But to provide a more consistent and comprehensive image of the judge blogs, we encourage everybody to switch.

Something is not working! I need help.

No worries, we are here to help you! Contact us via our User Group on Judge Apps or directly via any other channel. Also if you have any future feature requests, please let us know.