Re-adding downloads

Finally managed to get a lot of the photos I wanted to share uploaded to this site. In the following days and weeks, I will try to keep adding random photos. I shoot with a Nikon D200 so if you are a camera snob and or a Canon fanatic I will ask you to leave. Okay, not really.

I know there are some that will ask what the license is or will be. Public Domain. Yes, public domain. Share them, edit them, use them in any and all projects you would like. A link back would be cool but not required.

I’ll try and post more and more as the year progresses but do keep in mind that life will happen. This is a small project I’m tackling and want to keep alive as long as I can.

Vary all the vagrants

It’s no secret that creating a proper web hosting environment can be a pain. Main reason being that there are many things that you have to take into consideration. Processor, storage, memory and sometimes if the motherboard can support it all. And I’m getting far ahead of myself again.

When it comes to creating WordPress themes and plugins finding the right environment can be tricky. Even more so when you use a Windows operating system.

Vagrant

What is it? Vagrant is an amazing tool and an amazing thing to get to know. I’m still in the process of learning and I love it. It does deal a lot with the command line so I have to familiarize myself with that once more. It has been years since I’ve used it.

Virtual Box

Yes. A box. A virtual one at that. VirtualBox is another great tool when it comes to creating a working environment. The main reason I love it is because you can have several machines on one system. Meaning you can have Linux, Windows and possibly OSX running on any machine you want. Keep in mind it is a virtual instance and not the real thing so some errors may occur.

Learning as you go

A few weeks ago I saw more and more posts being shared about VVV. I was super impressed and fell in love with it. So I did a little more research and came across a few other posts about how to work with VVV. I figured I’d share with you a few of those:

Those are just some of the links I wanted to share. There are more but didn’t want to create a giant list of links. I mean after all that’s what a search engine is for, right?

Creating and sharing

For the last five years I have taken quite a few photos. Most of which I’m pretty happy with and some that I questioned why I even took them.

More and more I’ve had this little itch and I just can’t seem to take it anymore. I finally decided that I’m going to edit as many of those photos and share them with the world. Free of charge.

Wait, what?

Yeah. You read that right. I’m going to release all my photos completely and utterly free. You can attribute me if you want, or don’t; entirely up to you.

Bare in mind that this will be an ongoing process because I will be adding when I get some downtime. I mean, come on, I am only one person. I can only do so much on a given day.

When?

The rest of this year I will keep adding more and more photos. They will be saved with a maximum height and, or, width dimension of 4,000 pixels. They will be of a 4 to 3 format and if asked I can try and send a better quality photo, but keep in mind that will take a little more time. So, don’t expect instantaneous results.

Why?

Why not? Quite honestly what it came down to was I have wanted to share something other that the things I have learned over the years. In the mean time I have, somewhat, set up a semi-download area that is a work in progress. If you want to feel free to help yourself out with a few of the images I have made downloadable.

So you want to become a WordPress Theme Reviewer?

What does it take?

Some PHP, JavaScript, HTML, CSS knowledge and a little bit of time to spare. At least that is what it takes to get the ball rolling.

Yeah, very simple. Doesn’t take much really.

The basics

There are some things that you really have to know in order to becoming a WordPress Theme Reviewer. Here is a quick list I feel makes for a good theme reviewer.

  • Knowledge
  • WordPress prowess
  • Personality
  • Time
  • Communication

Now, that is what makes for a reviewer but how to get your foot in the door?

Those steps are a little bit easier. One of three ways to get started really. The first one is by requesting a ticket to review from the review queue. [note: it is as of this writing]

The second way is by emailing the theme reviewers mail list and asking if any new theme is available for a review. Keep in mind that you will have to subscribe to that list as well in order to keep in contact with all theme reviewers and admins. You can also follow a good few through twitter, personal blogs or however you’d like.

The third way, but is less frequently checked, would be through the IRC channel #wordpress-themes. They will also link you to the review queue I mentioned earlier so these last two would be just pushing it if you did all three. Just saying.

What next?

The next step would be to setup your testing environment. Getting all the needed information, the settings and finally testing the theme. How you set that up is entirely up to you but there are some things that must remain the same across all the testing platforms. Can you guess what that is? It’s a simple setting that will help solve some of your headaches.

It is setting WP_DEBUG to true in your configuration file. Yeah, a very simple thing, right? Keep in mind that there are other ways to keep track of errors as well.

As far as plugins go, there are plenty to pick and choose from. The widely accepted one is the developer plugin by the Automattic team. It is a great plugin to get you started in creating a theme or plugin.

Testing

Yeah buddy! Finally we can discuss testing the theme. In order to test a theme you need data. Enter the theme unit test file. There are a few places that have some sample posts and images that you can download. Just a simple XML file that you import. Thankfully there is one that is widely used by many theme reviewers. The file stays up to date and is looked over every once in a while for errors.

An alternative is to use your own posts if you have enough. I may one day try creating my own little set of posts but for now I use the theme unit tests provided. It’s convenient if you are just starting out.

Unit Testing

Simple. Follow the steps provided in the theme unit test page and then report any major errors in the theme’s ticket.

Go through each scenario and make sure you write any, and all errors that you encounter. Keep in mind that is only part of a review. There is one part that I feel is extremely important. Communication.

Let’s talk about it

Yes. Talking is the single biggest thing when you are reviewing a theme. Without talking to the theme developer neither one of you is learning or even progressing. I mean it. Keeping in touch is the key to becoming a good theme reviewer as well as a developer.

A great example of this would be a ticket I reviewed nearly four months ago. I assigned myself the ticket, looked over the code, tested to see if anything would break and took note of it all. I posted the required things that needed to be addressed in order for the theme to be approved.

I didn’t hear any response from the developer in three days. I posted a question asking if they needed more time. Still no response. Nearly a week later I told that person I had to close the ticket and not approve the theme. About a week ago I was on the support forums and saw that somebody had a question about the theme and if there would be an update, if any. Made me sad to see that.

Personality?

Yes. It does take a certain personality to be a good theme reviewer. At least I think so. The reason I say this is because as a theme reviewer you are helping somebody. You are helping them share something with the world. I know it does sound a little cheesy but it is true. Think back to when you were in school and you had to create something for a class project. Odds are there was at least one person in that classroom that got all the recognition and all the praise for going above and beyond what the project asked for.

Now put yourself in their shoes ( if you weren’t already that person ) and think about how it feels. It feels good. It makes me happy approving a theme. At least one that I feel is worthy of approval but that’s another topic.

Think you can?

So, you ready to become a theme reviewer? If so, then head over to the Make Theme blog, give some input, ask for a ticket and give back to the community!

Make things a little more accessible

Key on keyboard
I was asked to redesign a site not too long ago and I’m pretty pumped about. Not going to lie. What I do like is that the site already has plenty of content to work with. The trick will be creating a good user experience for the person I will be handing off the site to.

The current state is blank since I’ve not really had much time to work. Personal matters. I do have a site design in mind but still need to sort out a few things here and there. I think the downside is that he wants the site to be finished as soon as possible. This may present a bit of an issue.

I can quickly get the ball rolling for him but the trick will be creating his theme and I may even have to experiment with a few plugin options to better enhance both his experience as well as user experience.

With that in mind when it comes to the actual coding of the site will be a feat as well. The reason is because I want to be that change. I want the web to excel and in a good direction. How will I achieve this? By making the site accessible. What do I mean by that? By using ARIA roles in my markup.

Yeah it does seem a little odd to be using those but it will all make sense. It’s just one step to creating a better web experience for everyone.

How will I use it?

The way I will go about this is by using

role=*

to make things a little more accessible. There are several roles in a document but they must be used properly. You can’t just go berserk and start giving everything a role just because you think it has to have one. In an HTML document there are some that really need them. HTML5 does play nicely with several of these.

The reason for wanting to use this is so people that aren’t able to view the site traditionally don’t miss out on certain things.

Let’s look at a decent example of this.

< !DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">


    
    Document Title


    

As you can see with HTML4 some of the information can seem a little repetitive. Now, when we change to HTML5 and use some ARIA roles it makes a little more sense.

< !doctype html>


    
    Document Title


As you can see the document makes a little more sense. You can tell what the role is of each element. I think that is one of the main reasons I have come to love using HTML5 markup. The ability to use elements like

main

,

aside

,

header

, and

footer

are a great addition and make for much easier organization of information.

The key will be reading the documentation for the roles and definitions of those roles. This will be fun!

Regenerate all the things!

HTML formSo, I’ve been dabbling with WordPress for some time and I have loved every bit of it. I even helped a few people along the way. Learned many things and met and talked to many more. Every day I do feel like I am learning something new. Whether that is how to

enqueue

a certain file, how to remove certain things, how to style and just how to do more things in a different fashion.

It has been amazing! I think the biggest thing taken from all of this is that I need to start sharing a bit more. So I’ll begin with a simple plugin that I feel just about any person using WordPress should at least try out.

That plugin is: Regenerate Thumbnails

But why?

Yes, I know WordPress already has a way of creating custom thumbnails but what if you don’t want to click on several photos. What if you just installed a new theme and the images are looking all funky? What happens when you have to resize and you have hundreds of images? I know I have several photos in my library and don’t always have the time to go to PhotoShop and readjust every single image. Who does?

I know I don’t always have that time. What the plugin actually does is go through the entire

wp-content

folder and regenerates all the thumbnails.

Thumbnails?

Yes. Often times when you set a featured image on a post a theme handles the sizing of the image. Some don’t touch it at all and some alter the dimensions to better fit the overall design. While I know that very few companies will actually change their site’s theme it is a very important thing to keep all elements of a site united.

I am sharing this for those that have blogs and are changing the theme every so often and for developers that like to try to break themes.

So by all means, go and try it out. You will not be let down either way.

Understanding arrays

Backstory

For the last month I have read about JavaScript ( ECMAScript ) and how it works. To say the least I am one step closer to not being as bald as I thought I would be. JavaScript is a great language to learn and has so much potential behind it and for it.

What caught me a little off guard was the term object-oriented. For the longest time I hadn’t the slightest idea what that meant. I finally reached that pivotal moment when it hit me. That little moment of: that makes total sense.

What are arrays?

Arrays, simply put, are lists. Yes, it does sound sort of strange but it is true. Arrays are lists. In just about any programming language arrays are used to store not only information but information about that information. Yes, more information within information.

A great way of thinking what arrays are is to think of them as lists; which is kind of what they are. A good example is the little JavaSvript snippet:

var groceries = new Array( 'tomato', 'cucumber', 'squash', 'zucchini' );

Simple right? Now, what if we want to deal with and store more information? For that we introduce associative arrays.

Associative Arrays

Not the suit wearing type but the mathematical type. At least for me it makes sense. Not sure if it will help anybody else but here goes. An associative array is an array within an array.

Inception much?

A really great way to look at this is by not only looking at the code but thinking about lists. Yes, lists. Again. A great example of this is a restaurant’s menu.

$menu = array(
    'pizza' => array( 'cheese', 'pepperoni', 'sausage' ),
    'potato' => array( 'fried', 'baked', 'chopped', 'chip' ),
    'drink' => array(
        'soda' => array( 'diet', 'regular' ),
        'alcohol' => array( 'beer', 'wine' )
        ),
    'salad' => array( 'house', 'caesar' )
    );

Wow! That is quite a bit of code to show my point but I will run through it pretty quickly.

We start with the basic menu items: pizza, potato, drink and salad. Each one of those items then has its own bit of information attached to it. Pizza has the toppings, potato shows how it is cooked, the drink one is a little tricky in that it has two different arrays for soda and alcohol.

Get it? Got it?

And there we have a small glimpse of how I am capable of understanding arrays and associative arrays. Very dumbed down but it is a very clear way of looking at it.

Archive widget at a glance

Today I put the finishing touches to my customized archives widget. While I am tempted to submit it to the WordPress plugin repository I will hold off for a little bit. The reason: I’m not quite ready. That will usually be my excuse.

Enough of that on to the code!

The issue

I love using archives only because I love some aspects of history. The one problem I had with the way the core widget handles it is that it shows every single month with no set limit. I wanted to be able to set a limit without having to use code or a child theme to modify the widgetized areas.

The steps

In order to create a simple plugin one of the first things I had to do was look at the core default widgets. That file is found under

/wp-includes/default-widgets.php

and houses all the basic widgets that come standard with WordPress. Next, I created a blank folder with a blank PHP file with the name of my new plugin; used the standard header for a plugin and input all my information:

/*
Plugin Name: Lost Archives
Plugin URI:
Description: Custom Archive Widget with a few extra options.
Version: 0.1
Author: Jose Castaneda
Author URI: http://josemcastaneda.com
License: public domain

*/

The next thing was to get the basic logic behind what I wanted my newly created widget to do. What information I wanted to gather from a user and what to pass so that it will display properly on the front end. The basic one being the title of the widget. Next I wanted the ability to pass a number so that it sets the limit to how many things to show. Finally I wanted the ability to to chose what type of archive to display; if I wanted a weekly, daily, or monthly type of archive.

The code

In order to gather the information I first needed a form. Thankfully WordPress makes things pretty easy with the widget class. By creating a new class that extends the WP_Widget class I can override the

function form(){}

and use it to create the form the user sees on the back-end. This was a little tricky in that I had to run a check for what is currently selected and what isn’t; and, again, WordPress has a function for this:

selected( $selected, $current, $echo)

In order to display the different options I had to use a foreach() loop in order to display the various choices. The code looked a little like:

foreach( $array as $key => $value ){
    echo $key;
}

Now I know I could have cleaned things up a little bit but that is for another time and another post.

The end result

And the final product is:

<?php
/*
Plugin Name: Lost Archives
Plugin URI:
Description: Custom Archive Widget with a few extra options.
Version: 0.1
Author: Jose Castaneda
Author URI: https://blog.josemcastaneda.com
License: public domain

*/

add_action( 'widgets_init', 'lost_archive_widget' );
function lost_archive_widget(){
    register_widget( 'lost_archives' );
}

class lost_archives extends WP_Widget {
    function __construct() {
        $widget_ops = array(
            'classname'   => 'archives_extended',
            'description' => esc_html__( 'Customized Archives wigdet.', 'text-domain' )
            );
        parent::__construct( 'solea_archives_widget', esc_html__( 'Archives', 'text-domain' ), $widget_ops );
    }

    function widget( $args, $instance ){
        extract( $args );
        $limit = ( empty( $instance['limit'] ) ) ? '12' : $instance['limit'];
        $type  = ( empty( $instance['type'] ) ) ? 'monthly' : $instance['type'];
        $title = apply_filters('widget_title', empty($instance['title']) ? __( 'Archives' ) : $instance['title'], $instance, $this->id_base);

        $content = wp_get_archives( array(
            'type'            => $type,
            'limit'           => $limit,
            'format'          => 'html',
            'before'          => '',
            'after'           => '',
            'show_post_count' => false,
            'echo'            => 0,
            'order'           => 'DESC'
            ) );

        $output = '%1$s %2$s %3$s %4$s <ul>%5$s</ul> %6$s';
        printf($output, $before_widget, $before_title, $title, $after_title, $content, $after_widget );
    }

    function update( $new_instance, $old_instance ){
        $instance = $old_instance;
        $new_instance = wp_parse_args( (array) $new_instance, array( 'title' => '', 'type' => '', 'limit' => '') );
        $instance['title'] = strip_tags($new_instance['title']);
        $instance['limit'] = $new_instance['limit'];
        $instance['type'] = $new_instance['type'];
        return $instance;
    }

    function form( $instance ){
        $instance = wp_parse_args( (array)$instance, array( 'title', 'limit', 'type' ) );
        $title    = strip_tags($instance['title']);
        $limit    = $instance['limit'];
        $type     = $instance['type'];
        $types    = array(
            esc_html__( 'Post', 'text-domain' )    => 'postbypost',
            esc_html__( 'Daily', 'text-domain' )   => 'daily',
            esc_html__( 'Weekly', 'text-domain' )  => 'weekly',
            esc_html__( 'Monthly', 'text-domain' ) => 'monthly'
        ); ?>
        <label for="<?php echo $this->get_field_id('title'); ?>">< ?php _e('Title:'); ?></label>
        <input id="<?php echo $this->get_field_id('title'); ?>" class="widefat" name="<?php echo $this->get_field_name('title'); ?>" type="text" value="< ?php echo esc_attr($title); ?>" />
        <label for="<?php echo $this->get_field_id('limit'); ?>">Limit:</label>
        <input id="<?php echo $this->get_field_id('limit'); ?>" class="widefat" name="<?php echo $this->get_field_name('limit'); ?>" type="text" value="< ?php echo esc_attr($limit); ?>" />
        <label for="<?php echo $this->get_field_id('type'); ?>">Type:</label>
        <select id="<?php echo $this->get_field_id('type'); ?>" name="<?php echo $this->get_field_name('type'); ?>">
        <?php foreach( $types as $k => $t ){
        echo '<option selected="selected" value="' . $t . '">'. $k . '</option>';
        } ?>
        </select>
        <?php
    }

}

Keeping in mind this works with WordPress 3.5 and above and I haven’t tested any other versions.

Working with mobile first mentality

This has been the biggest issue for some time now. How I want to execute it. All one stylesheet or separate ones and have the server load it depending on what it is given. Each one has its own drawbacks and perks to it. Reading about mobile design these last three days has slowly opened my eyes into what the next few years will be like when it comes to web design.

Years ago when the iPhone first made its début to the world the only thing I was thinking about was how everybody would interact and view things.

My first mobile experience was with a Sony Ericsson phone. Boy was that a mistake on my part. The way everything was laid out made it almost unbearable to really try to do anything. Navigation was decent but still took forever to get to the link I wanted to ‘click’ and go to. Using the buttons to pseudo scroll up, down and sideways was not easy. Make one mistake and often times I would have to start over. Sites took longer than I wanted to load but there really wasn’t an option to use a wifi connection with the phone.

Thinking back on those experiences with how mobile phones rendered pages it has given me some ideas on how I like seeing navigation and how to implement it. Navigation is the key when it comes to any site. Being able to know what to look for without having to look makes for a great web experience. What I mean by that is that the end-user should not have to look around the entire site’s page to find why they were looking for. A perfect example of this is just about any shopping site. The search form is one of the first things that has some emphasis to it without us really knowing.

A good study I would love to see is how many people visit a shop site and don’t use the search form. Mind you this is for fairly newcomers that I’m thinking of instead of repeat customers. Maybe one day.

Trying to view a site on a really small screen made me wonder how things would change in the future. Yeah, I like to sometimes think like that. With touch screens becoming more and more popular the next stage is of course is being able to cater to that little market. True, that demographic is small at the moment but in the next few years it will only see an increase.

Mobile first design was first coined a few years ago but has recently been what I feel is the newest standard for most sites. One of the things I have come to hate about it is scale.

Let me elaborate on what I mean. I am one of those people who likes to view a site with the browser expanded to take up the entire screen. I’m pretty sure I’m not the only one. One of the methods I have seen when it comes to creating a responsive site is creating break points. Usually what that means is that when a person resizes the browser the site adjusts to that new size. I don’t like it. Yeah it does have its advantages but it also has some drawbacks that I, personally, don’t like.

The biggest one really being the loss of certain elements. In Windows 7 you have the ability to set a program to take up half the screen and another to use the other if you want. I like doing this when I am comparing cameras, computer parts or just about anything I’m shopping for. I, like most people, love a really good deal so what better way than comparing two sites at the same time? Well, when the window gets fitted to the new size the responsive aspect takes over. Often times it doesn’t effect it much since some of the sites I browse often have a min-width of about 700 pixels and my monitor is wide enough to handle it. Sorry, geek speak.

One thing I found really interesting is that most new smartphones don’t listen to the

handheld

property when using a media query. A little strange since most mobile devices are handheld devices.

Options and decisions. One file or several. I still can’t decide. I may just have to use several ones while using server requests to help. It would be pointless to use AJAX since the page loads once on any device and people don’t resize their browser window and can’t do it on any mobile device unless they change the orientation but that has no adverse effect and shouldn’t. Shouldn’t be too hard.

Mobile web design: here I come!

I hate not finding the right documentation

I really do. Recently I was trying to see if I could help anybody out with their WordPress questions and came across the sub-forum of localhost installs. I figure why not? I once had issues trying to figure out why I couldn’t see the pages.

The issue that was on the plate was a server 500 error. I’ve had quiet a few of those and to this day I don’t like seeing them. Simple thing meaning that the server isn’t configured properly. At least that was the solution after I read the title and posted. I read the first reply which was simple with a link to how to install WordPress on a local machine with different software. I checked it out to see some of the documentation and lo and behold it was a little out of date.

The link to the tutorial was an expired domain. Needless to say it was pretty useless. Hoping to see a tutorial I found nothing but an outdated documentation for something useful. At least I think it is useful. Now part of me wants to create a quick tutorial on how to install the most current version of XAMPP ( 1.8.1 currently ) on a Windows 7 computer. While it is simple since they have been gracious enough to include an executable file for simpletons like myself they also have documentation on how to install without the installer for the more adventurous types out there.

At the same time I feel like it will be an almost moot point in that it is extremely easy to just click a few buttons and call it a day. I hate debating simple things like that sometimes but when it comes down to it some people really don’t know what they are doing. I was like that at one point.

I can remember trying to set up my testing environment and trying to use DreamWeaver almost two years ago when I was taking online courses. It felt like a huge ordeal to get it to work properly until I finally read part of the instructions that made sense to me. As it turned out I was using the wrong directory in DreamWeaver.

One more reason I deterred from using any WYSIWYG editors. I like being able to see the code I am typing. Takes me back to when sites were done using tables where now they are using sections, articles and divisions but I’m getting sidetracked.

I’m tempted to find who is responsible for that page that was linked so that I can report the broken link and see about putting in my own steps to creating a localhost and installing WordPress on it to test and hack. In the mean time I just have to take screenshots of every step taken or find a way to create a screencast for future users.