From the Blogabout me

Setting up email on an Android Tablet

Occasionally I have clients who need assistance setting up email on n Android tablet, so I wanted to give a quick walk-through on how to do so for most devices.  These steps may not be 100% the same on all devices or versions of Android, but give it a try.

  1.  Start the Email app.
    Look for it in the Apps drawer.
    If you haven’t yet run the Email app, the first screen you see is Account Setup.
    If you’ve run the Email app before, you see the Email inbox and you’re done.
  2. Type the e-mail address you plan to use for the account.
  3. Type the password for that account.
  4. Touch the Next button.
    If you’re lucky (i.e., you just used Google/Gmail for the email), everything is connected and you can move on to Step 5.
    Otherwise, you have to specify the details as provided by your ISP, including the incoming and outgoing server information, often known by the bewildering acronyms POP3 and SMTP. Move through the steps on the screen, although the tablet really just wants to know the incoming and outgoing server names.
    Your ISP most likely has a support web page for setting up e-mail accounts. An example of these settings may look something like this:

    Username: youremail@yourdomain.com  (obviously "yourdomain.com" would actually be whatever your domain is, so replace this appropriately)
    IMAP Port: 143
    POP3 Port: 110
    Password: whateverYourPasswordIs
    Incoming Server: mail.yourdomain.com
    Outgoing Server: mail.yourdomain.com
    POP3 Port: 110

    If there is a box for “Authentication is required for IMAP, POP3, and SMTP” then click it.
  5. Set the account options on the aptly named Account Options screen.
    If the account will be your main e-mail account, place a check mark next to the Send Email from This Account By Default option.
  6. Touch the Next button.
  7. Give the account a name and check your own name.
    The account is given the name of the mail server, which may not ring a bell when you receive your e-mail.
    The Your Name field lists your name as it’s applied to outgoing messages. So if your name is really, say, Bill Gates and not billybob, you can make that change now.
  8. Touch the Next or Done button.
  9. Smile and jump up and down: you’re done.

 

 

Removing /index.php/ from WordPress URL’s

Occasionally, I have clients ask why their URL’s for WordPress have changed or maybe they moved from one hosting provider to another and they now see /index.php/ in their URL.  This does not only pertain to WordPress though, as it could affect other Content Management Systems (CMS) or even general software.

Recently I was helped setup a person who had moved their WordPress site and a great billing/time tracking online system, that I encourage you to look into, called Pancake from Hostgator to InMotion. But once everything was moved over they noticed this issue in all URL’s and it caused Pancake to really act up without being any issue with Pancake itself, and just made WordPress links look ugly.  So that’s when I realized it was time for me to do a quick walk-through on how removing/index.php/ from WordPress URL’s without a plugin being needed.

So I want you to go into your .htaccess file within the root directory of your website. Open it with your favorite text editor, and make sure this information is there and at the top of the file. Save and put back on the server.

<IfModule mod_rewrite.c>
RewriteEngine On
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.*)$ /index.php?/$1 [L]
</IfModule>

Note, if you are using Rackspace, you may need to add a little more code:


<IfModule mod_rewrite.c>
Options +FollowSymlinks
# Options +SymLinksIfOwnerMatch
RewriteEngine On

# On some hosts (including Rackspace), you need to remove the "#" that comes before RewriteBase to avoid 404 errors:
# RewriteBase /

# Block access to hidden files and directories.
RewriteCond %{SCRIPT_FILENAME} -d [OR]
RewriteCond %{SCRIPT_FILENAME} -f
RewriteRule "(^|/)\." - [F]

RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule ^(.+)\.(\d+)\.(js|css|png|jpe?g|gif)$ $1.$3 [L]

RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.*)$ index.php [L]
</IfModule>

I realize this is not the most exciting topic, nor the easiest to explain, so if you have any questions please let me know.

Clean USB SD Card for Mac

If you have ever used a flash drive (thumb drive) or any type of SD card with your Mac, you may have noticed that after you have deleted files they end up in the .Trashes folder, and you could either lost card space or not be able to use your card or drive at all.  Don’t worry, there is always a fix.  And this is a simple one.

Most of the time you can just use the Disk Utility to click “Clear Empty Space” or even “Erase.” For some devices though, this doesn’t work. When I started using the HTC Re Camera, I loved it and before long it became part of my every impromptu pool, ocean, or hike camera. But it doesn’t really like the Apple Disk Utility as much as it does within the Windows Environment. Although the Re Camera is definitely not the only flash drive or SD card device that has this issue, it is an issue that you will need to know how to resolve if you use a Mac.

 

<1> Open Terminal, type cd /Volumes/<your thumb drive>

Remember the <your thumb drive> section is whatever your device is called. For instance if your drive is called “UNTITLED” the command should be:

cd /Volumes/UNTITLED

<2> Now type:

rm -rf ._.Trashes .Trashes/ .Spotlight-V100/ .fseventsd/

<3> Eject and use the thumb drive. The next time you plug in the drive those items and folders will be recreated

 

 

I have done this for a number of people and photographers who are not aware of this fix when the Disk Utility.

HTC M8 Stuck In Dock Mode

Have you ever had your HTC M8 get stuck in Dock Mode? Even after restart, you see it send you randomly into Dock Mode or Car Mode…  After this happened to me recently, I spent some time looking around and troubleshooting on two different devices and found a few easy things to try.

First off – DON’T RESET YOUR DEVICE (yet)…

The first things to ask yourself if this has just started happening to you:

  • Have you installed any apps recently?
  • Have you been near a pool, the beach, snowboarding or maybe dropped the phone in some dirt?

 

Test #1:

Clean your USB Port… If you are the type of person that puts your phone through intense usage or really exposes your phone to the elements, this is where you should start. The first time I noticed this issue I had been at the beach taking some photos, and about 45 minutes later the HTC M8 went crazy. A few days later I decided to take an older HTC M7 and do a quick test. I dropped it into the sand (dumb, I know), but guess what? It started the Dock Mode almost instantly.

Test #2:

Do you have a Dot View case? Have you had any magnets around your phone? What I have noticed, and others around the web-based on a quick Google search, is since HTC has a magnet sensor in the device, it may go into Car/Dock Mode in some cases where magnets are nearby.

Test #3:

Look at all recently added apps (ones you have downloaded in the last 24 hours or so. Remove them. Some people have also found relief in simply Disabling the Dock app. Personally I would rather know what was causing the issue instead of just turning off notifications. But if determined to do it – Go into the App Manager, not the app drawer. Settings>App Manager> it will open to “Downloaded” apps. Change downloaded to “All” by swiping left. Find the app “Dock”. Click “Disable”. Then reboot. Ideally, you should not see Dock to show up again.

 

 

 

If none of these troubleshooting methods work for you, I recommend restarting your device in Safe Mode to see if it continues. If so, you probably have a hardware issue (similar to what I mentioned in Test #1). If you don’t have the issue anymore while in Safe Mode, you have a software issue. 

 

Contact Form 7 Confirmation Message Tip

Do you use Contact Form 7 for WordPress? If so, this quick tip will be helpful for you.

A number of my clients as for customizations and tweaks to be done to the plugin to make it function a little differently than the default, but there is one customization that is hidden but anybody can do.

Success Message Position

Many of my clients who use Contact Form 7 ask about the success message. So if you have ever wanted to move the Contact Form 7 Confirmation Message from the bottom of the form to anywhere else on the form, it may be much easier than you think. Just add the
[response]
shortcode to your form where you want it to display.

Let’s just say you have a form that requests First Name, Last Name, Email Address, and a standard Text Box. A form like that, will look something like this:

Generic Contact Form 7 Form

And your backend Contact Form 7 form settings and layout would look something like this:

<p>First Name (required)<br />
[text* first-name placeholder"First Name"] </p>
<p>Last Name (required)<br />
[text* last-name placeholder"Last Name"] </p>
<p>Email Address (required)<br />
[email* your-email placeholder"user@domain.com"] </p>
<p>Message (required)<br />
[textarea* your-message] </p>
<p>[submit "Send"]</p>

Good so far? Now if you were to click send right now you would get a little confirmation message on the screen that says something generic and it would be at the bottom of the form:

Generic Standard Contact Form 7 Message

This is pretty and everything, but we have a problem… Maybe your form is too long or you think your visitors will not see the confirmation… Now what?


The fix:

There is a built-in feature that is not shared by the developer very well, but is very useful. Simply add in the shortcode [response] wherever you would like the success message to be displayed after clicking Send and it will display there.

<p>[response]</p>

<p>First Name (required)<br />
[text* first-name placeholder"First Name"] </p>
<p>Last Name (required)<br />
[text* last-name placeholder"Last Name"] </p>
<p>Email Address (required)<br />
[email* your-email placeholder"user@domain.com"] </p>
<p>Message (required)<br />
[textarea* your-message] </p>
<p>[submit "Send"]</p>

The Success Message is going to be at the very top of the form now

New placement of Contact Form 7 Success Message

Genesis Customized Headers (advanced use)

First and foremost – do not ever do this unless you

  1. absolutely know exactly what you are doing
  2. absolutely have to because of some unique reason
  3. absolutely know what you are doing
  4. have read and followed bullet points #1 & #3 perfectly

I absolutely love how the Genesis Framework has been developed and continue to find out things about it.  Every time I think to myself, “Gosh I wish there was a way to…” I realize Genesis developers have already done it some where.  You just have to keep digging.

In very, very rare occasions you will need to put some kind of Shell around your WordPress site.  Maybe you have an organizational brand that needs to be standard across the world, but you want to add a website using WordPress and Genesis.  If that’s the case, you may run into some issues with the required assets if you are not careful.

The piece of code we are changing is demonstrated in the screen capture here.genesis-header

In the most recent Genesis framework (1.9.1 as of today), a function such as genesis_header_markup_open will need to be adjusted.

Find the code by going to
genesis/lib/structure/header.php
and look for the function you are wanting to change.  I will change the Genesis header slightly below.

Original:

function genesis_header_markup_open() {

    genesis_markup( '<header>', '<div id="header">' );
    genesis_structural_wrap( 'header' );

}

Modified:

function genesis_header_markup_open() {

    genesis_markup( '<header>', '<div id="custom-header">' );
    genesis_structural_wrap( 'header' );

}

I’ve had to do this on rare occasions only because my clients had CSS or a structual issue where they were already using the

ID=header

so I had no way other than to make this change via the Genesis framework. I deinifitely do not recommend this as a normal practice, as you will have to change this code every time there is any update to the framework.

I wish you lots of luck.

Customize your wp_get_archives() in WordPress

Usually I am very pleased with the WordPress community about how helpful they are with users who have questions.  Occasionally though, there is a question where for whatever reason people attack the user the question.

Thus I wanted to write about this one question/issue in particular because I have had multiple clients ask.  Although it’s not hard, it is not well documented at WordPress.

Have you ever been to a 404 WordPress page or even used a plugin/widget that displays Recent Posts using <ul> and <li> tags?
Have you ever wanted or wondered if this could be changed?  Great news, it can be.

If you are wanting to remove the <li> and </li> around your listing and customize the list, you are in luck.

In this tutorial I will cover how to take wp_get_archives and do some customization to it.

Open your 404.php or archive.php file and let’s get started.  Disclosure, I did use a Genesis child theme when doing this tutorial so if you see anything referring to Genesis, it’s not core to WordPress and my functions may be slightly different from what you see.

Okay, now you want to look near where your archive page has the header “Recent Posts” and you should see something like

Step #1


<ul>
<?php wp_get_archives( 'type=postbypost&limit=100' ); ?>
</ul>

Here you will want to modify the code by adding your modifications

format=custom  (this is required to take away the default format=html to be overwritten, and you now have two options.  A ‘before‘ and an ‘after‘ parameter.

Step #2

In my example I change the default

<?php wp_get_archives( 'type=postbypost&limit=100' ); ?>

to be

<?php wp_get_archives( 'format=custom&before=<p id="test">&after=</p>&type=postbypost&limit=100' ); ?>

Step #3

Now instead of a unordered list using <li></li>, the code will now be <p></p> and you are ready to go to town on customizations.  Endless possibilities.

I know this might be confusing with all of the code, so I’ve included a short video tutorial doing the same steps.

YouTube Preview Image

Custom CSS for Gravity Forms

Gravity Forms is one of my favorite plugins designed for WordPress, and can be easily used for the quick blogger to advanced developer alike.

More than likely you already know about Gravity Forms, so I wanted to jump straight into some more advanced CSS features that most people do not know about or take advantage of but should. If you do not know why Gravity Forms is important for your WordPress site, I have talked about it before, so feel free to read about it here.

Gravity Forms offers an area for you to add Custom CSS to any of your fields.  For instance, you will see below two screenshots – #1 my fields, #2 where to find the Custom CSS area.

#1

#1
look @ the field
“How to get in touch with you?”

 

#2 Click on "edit" then "Advanced" you will see Custom CSS

#2
Click on Edit then Advanced
you will see Custom CSS

Here, you can add whatever you want as your Custom CSS Class; and you will be able to customize as you wish.

But Kevin, I don’t know much about CSS or don’t have the time to just simply make some easy adjustments to fields like Lists, Radio Buttons, and Checklists.

Yes, Gravity Forms makes long vertical lists by default, so if you have 10 items in your Checkbox it will look something like this:

Vertical Gravity Form Fields
Yikes, we probably don’t want that.

With a simple built-in class you could have something like this:

Columns in Gravity Forms

 

Now that is pretty cool – what did you do?

I used the built-in Gravity Forms class gf_list_3col – and it is already there so why reinvent the wheel, right?

Here is a quick list of all of the built-in classes:

Checkboxes and Lists Fields

gf_list_2col = 2 columned List
gf_list_3col = 3 columned List
gf_list_4col = 4 columned
gf_list_5col = 5 columned

Two Columns of Text Fields side by side

gf_left_half = The left column
gf_right_half = The right column

Three Columns side by side

gf_left_third = Left column
gf_middle_third = Middle column
gf_right_third = Right column

Some other miscellaneous styles

gf_scroll_text = Gets a scroll box into place, for those long sections where you need to give your visitor lots of information
scrolling-text
gf_hide_ampm = If you want to hide the AM/PM portion of the Time field
gf_list_inline = Simpliar to the above gf_list classes, but just show up next to each other using the amount of space the content can use on each line, instead of making it fit within 2,3,4,5 columns.
gf_hide_charleft = Do not display the amount of characters left / character counter

I’ve not found a great use for these, but they are available:
gf_list_height_25 = 25 pixels between list items
gf_list_height_50 = 50 pixels between list items
gf_list_height_75 = 75 pixels between list items
gf_list_height_100 = 100 pixels between list items
gf_list_height_125 = 125 pixels between list items
gf_list_height_150 = 150 pixels between list items

I hope this quick cheat sheet will have you using Gravity Forms at it’s greatest potential, and you will be the envy of your other programming friends since these are fairly unknown.

 

Gravity Forms is a plugin developed by Rocket Genius, and is well worth looking into for your WordPress website.

Remove everything except Post Title on Category Pages – Genesis

You may notice in Genesis when you load a category page (domain.com/category/awesome) you will see a listing of all of your Posts with featured images, content, and probably some other meta tag stuff.  What if you want to remove/hide everything except one or two particular things?

Here is one way to do it

Open your functions.php file and add this (I recommend the bottom of the file)
add_action('genesis_before','remove_unwanted_actions');
function remove_unwanted_actions() {
if ( is_category()) { // <--- you could change, more about that below
remove_action( 'genesis_before_post_content', 'genesis_post_info' );
remove_action( 'genesis_after_post_content', 'genesis_post_meta' );
remove_action( 'genesis_post_content', 'genesis_do_post_content' );
}
}

This basically says:

Hey Genesis, I want to do something different than your normal awesome hooks; instead on Category pages, I don’t want you to display Post Information, Meta Data, or Post Content.  I just want the Post Title to show up.

Genesis will obey you because you are the master of your own domain.

Small adjustments to the above code:

is_category() = for Category Post Pages
is_single() = for individual Posts
is_page() = for Pages

 

I’ve also created a tutorial on how to display featured images on Category Post Pages also, so take a look over here.

Customizing Genesis Framework Footer

The Genesis framework is a great WordPress tool, but too many times I have seen clients who attempted to make adjustments, only to find they have just made things all mucky.  So I thought it was high time to suggest a different approach, that will not mess with any of Genesis’s core files so you won’t have anything to worry about later.

Go into your Child’s theme and look for the file

function.php

Now, at the bottom of the file, just add the following code:

//* Customize the credits
add_filter( 'genesis_footer_creds_text', 'custom_footer_creds_text' );
function custom_footer_creds_text() {
echo '

';
echo 'Copyright © ';
echo date('Y');
echo ' My Custom Link · Built on the Genesis Framework';
echo '

';
}

 

That’s it – you just change what you want the footer to actually say, Save, Upload to your site, and you are done.

You’re awesomeness is quite high at this point