Wednesday, July 26, 2017

A-B Tests - Which Color Combo Do You Like

We would like your help.  A client is unsure of the color combination they would like on a new department-centered website.  Their organization has a standard color guide for all print and online material.  But, they may deviate since they are a 'stand-alone' department.  This has lead to the following:
  • Example A: In this image you see the site with a new set of primary colors, orange and green.  These are the colors that will represent the department.
  • Example B: This image uses the standard colors of 'gold' and green (note, the green is a darker shade of green). The gold and green are the university's colors.
Please compare the two and let us know which you prefer.  Please feel free to add comments about why you've made your choice. (Click images for larger view).

Example A
Example B

Monday, June 19, 2017

Some Nice Text Messages from Clients

Recently, a marketing guru (who does some consulting for us occasionally) contacted us to create a new website for his business.  And, of course, I said, "yes!"

The site is live, but I am still making additions and tweaks.  And last week I got some nice text messages from Prof. Weber... it's always nice to hear from clients when they like the work I'm doing!

After returning from a short vacation, Prof. Weber saw the site after a week's worth of changes.  This response after he reviewed the site certainly made me smile!  (Yes, the text came through in the middle of the night... many of my client's know, I don't sleep).

Then, a little later that day - after the sun came up and I had made a few requested changes, I got this text!

Best he's ever seen?? Well, okay :-)

The site is based on the WordPress framework with a custom built theme.  It includes integration of the following plugins - some created by me just for this site, some open-source and customized, and some off-the-shelf:
  • Appointment Calendar (customized)
  • Captcha (customized)
  • FITS Round-About Slider (created for client)
  • Google Analyticator (off-the-shelf)
  • Landing Pages (customized)
  • Ninja Forms (off-the-shelf)
  • Super Socializer (off-the-shelf)
The theme I created is responsive - works on desktop, tablet, and smartphones.  You can visit the site here.

And from another client:





This is for another WordPress site.  I struggled quite a bit creating and customizing the child theme for this site.  The parent theme the client chose did not follow WordPress standards and was, at times, frustrating to work with.  But, it had some really nice effect and we wanted to use it.  After getting a text like this... the struggle was worth it!

The site includes the WooCommerce shop plugin and a custom sidebar plugin I created.

This site is still a work in progress.  So, much of it has "under construction" messages and the shopping area is filled with demo (fake) product listing.  But, the effects are working and the images and layout customization is complete.  You can visit this 'work-in-progress' here.


If your are looking for a new website or need your current site overhauled, please use this form to contact us for more info - consultations and quotes/estimates are always free! If you have a good idea of what you want, you can use this form to start the quote process now.  If you'd like, you can also comment below.  Your contact info will not be displayed in the comments.

Tuesday, June 13, 2017

We're Changing Our Name - You Save Big

That's right, we are changing our name this month.  We are evolving so that we can continue to offer you the most up-to-date software services.  So, we are changing our name from "Freelance I.T. Solutions" to "fits.digital" to better reflect our services - web programming, mobile application programming, IoT device programming and even IoT device prototyping.

To celebrate our name change and expansion into the IoT ecosystem, we are offering two great discounts this month!  You can use these discounts together for BIG savings on any coding project.


Don't worry, we are not getting rid of Kokopelli - he's been with us every step of the way and he's sticking around for the name change too.

Friday, May 26, 2017

Neat Tricks with Google Maps

I use Google Maps a lot - both the desktop version and the mobile version (on Android phones/tables).  Although most people only use it to get from point A to point B, it can do so much more.  It's really a pretty amazing application.

I might even call myself a 'Maps power user.'  But I found this list of 26 Google Maps tricks on the Entrepreneur magazine website that made me feel like just a novice.  While I know about and use many of these tricks, at lease half were new to me.  And some of them are just down-right cool!

Checkout the whole list here: https://www.entrepreneur.com/slideshow/294190

If there are any Google Maps tricks you use that are not listed here, please tell me about them in the comments.  I'm always interested in find new ways to use Google's awesome array of applications.

Saturday, May 6, 2017

May 2017 Special

For May we are giving 25% off any coding project - HTML5 website, WordPress website, iOS app, Android app, web app...

And if you decide to host your project on our web or cloud servers, we will give you 25% off a service contract too!

For more information, please contact us with a comment below (we will keep you information private and not publish your comment), or through our website contact form.  If you are ready to get a quote for your project, please fill out this information form and we will get back with you withing two business days.

Sunday, April 2, 2017

April 2017 Special

We've done a few WordPress website specials recently.  This month we've decided to focus on non-Wordpress sites.  So we are offering a 25% discount on all websites that are not build on WordPress.

This discount covers mockups, design, development, SEO research and site publication.  Also included is the creation or editing of images for the site... so everything!

Additionally, with this offer, we will include a 25% discount on our basic service package when you host your site on our servers.  That's our basic service package for $18.75 / month*.

For more information, please contact us through our website or by commenting here.  (We will not publish comments with contact information).  If you are ready to get a quote for your website project, please start here.

*Basic service includes monthly backups of your complete site and database (when applicable), restoration from these backups when necessary, quarterly SEO reviews and updates. Regular price for the basic service package is $25 / month. Other service packages are available.  You are not required to get a service package.

WordPress Twenty Seventeen - Code Full-Width Page Layout


I have never started a WordPress site for a client based on one of the default themes.  I just didn't like them as a starting point - that is until the Twenty Seventeen theme arrived.

I really like the full-width image on the home page and the placement of the site title and tag line.  I also think the parallax effect on the home page is pretty neat.  I even like the half-page layout.  It's something different and something that works well with most content.  But, there are times when you just want or need to use the full page for your content.

With very little code, you can create a full-page template for the Twenty Seventeen theme.  It really only involves some very simple PHP and some CSS.  I definitely recommend that you create a child theme for this code.  It's the best way to make sure your customizations won't be overwritten when WordPress updates.  If you are not sure about creating a child theme, it's very simple, follow the directions here or do a Google search.  There are several good tutorials out there.  (Don't want to create a child theme? See the notes in orange).

Step 1 (If you did not create a child theme, skip to Step 2).
After you create your child theme, create the following directory structure, replacing "your_child_theme" with the name of your theme:

wp-content/themes/your_child_theme/template-parts/page/

We will be cloning and customizing two files, one that will be placed in the directory you created above.

Step 2
We'll begin by cloning the page.php file.

(a) Open the file at wp-content/themes/twentyseventeen/page.php for editing.  At the top of the file, just under the <?php code starter, add the following:

/**
     Template Name: Full Width
**/

(b) Next find the following line of code (originally, it was on line 27 of the file, but you just added the lines above to the top of the file, so move down appropriately):

get_template_part( 'template-parts/page/content', 'page' );

and change it to:

get_template_part( 'template-parts/page/content', 'page-full-width' );

(c) Now, save this file with the name, page-full-width.php in your child theme directory:

wp-content/themes/your_child_theme/page-full-width.php

If you did not create the child theme, save this file (same file name) to the twentyseventeen theme directory:

wp-content/themes/twentyseventeen/page-full-width.php

Step 3
Now we are going to clone the default content file and customize it with some special CSS class names.

(a) Open this file for editing:

wp-content/themes/twentyseventeen/template-pages/page/content-page.php

(b) Now find the following line of code (around line 16):

<header class="entry-header">

And change it to:

<header class="entry-header-full-width">

(c) Next, find this code (around line 20):

<div class="entry-content">

Change this to:

<div class="entry-content-full-width">

In the next step, we will be writing some CSS that will use these new class names to alter the default layout of pages in the twentyseventeen theme.

(d) Before moving on, save the above with the name, content-page-full-width.php in the following directory:

wp-content/themes/your_child_theme/template-parts/page/content-page-full-width.php

If you did not create a child theme, save the file (with the same name) to:

wp-content/themes/twentyseventeen/template-parts/page/content-page-full-width.php

Step 4
In this step we will add the CSS rules to give us the desired full-page effect.  Open the style.css file in your child theme directory.

I add the following lines to the end of the style.css file and make sure they stay at the bottom.  This helps to insure that no other rules will take precedence over this code.

body:not(.has-sidebar):not(.page-one-column) .page-header,
body.has-sidebar.error404 #primary .page-header,
body.page-two-column:not(.archive) #primary .entry-header-full-width,
body.page-two-column.archive:not(.has-sidebar) #primary .page-header {
     display: block;
     width: 100%;
}

.blog:not(.has-sidebar) #primary article,
.archive:not(.page-one-column):not(.has-sidebar) #primary article,
.search:not(.has-sidebar) #primary article,
.error404:not(.has-sidebar) #primary .page-content,
.error404.has-sidebar #primary .page-content,
body.page-two-column:not(.archive) #primary .entry-content-full-width,
body.page-two-column #comments {
     display: block;
     width: 100%;
}

If you did not create your own child theme, I would recommend that you put the above code in the twentyseventeen default style.css file near similar code.  The default style sheet is found at:

wp-content/themes/twentyseventeen/

For the first block of code above, add it at line 3756 - remember to put line breaks above and below it.  And for the second block of code, add it at line 3775.

You can, of course, add any other custom styles you would like to the .entry-header-full-width and .entry-content-full-width classes.

That's it!  Now when you are creating a page, you can choose the "Full Width" template in the Page Attributes section (see image).   I hope you find this code helpful.



Note: you can find plugins that will do this for you.  But, why bloat your site with all the code associated with a plugin, when you can add the simple code here?  I obviously wouldn't. 😎😎