Tag Archives: WordPress

Absolute Minimum for a Working WordPress Theme

Let’s say you are thinking about all the files that a typical WordPress theme contains and wondering what of that is actually necessary for your site to work. If you are in need of a very simple theme, say to display an images or few, you could quickly make it from scratch. Here is the start.

The minimum requirement for a WordPress theme to work are index.php and style.css files.

The style.css file sets the name of your theme which will be displayed in the dashboard. The format is this:

/*
Theme Name: My New Minimal Theme
*/

That’s it, we only enter the theme’s name. Please note the commenting, it is required. Below this part is where your style will be added.

The minimum of content for the index.php file is a loop in it’s simplest form:

<?php
  if ( have_posts() ) : while ( have_posts() ) : the_post();
   the_content();
  endwhile; endif;
?>

That’s it. You will be able to show the content of whatever page or post(s) are set to display as homepage.

Now we can easily build from there. To add a post title, the code should look like this:

<?php
  if ( have_posts() ) : while ( have_posts() ) : the_post();
   the_title();
   the_content();
  endwhile; endif;
?>

And so on… In the next post we’ll be adding navigation. And let’s see just how many lines of code it takes to make a simple, functional and responsive theme.

Inline Style in WordPress Caption Shortcode

Those 10px the [Caption] tag adds to the attachment div, likely breaking your style in the process, are fixed with the following. The style tag setting width has been commented out. 

add_filter( 'img_caption_shortcode', 'cleaner_caption', 10, 3 );

function cleaner_caption( $output, $attr, $content ) {

	/* We're not worried abut captions in feeds, so just return the output here. */
	if ( is_feed() )
		return $output;

	/* Set up the default arguments. */
	$defaults = array(
		'id' => '',
		'align' => 'alignnone',
		'width' => '',
		'caption' => ''
	);

	/* Merge the defaults with user input. */
	$attr = shortcode_atts( $defaults, $attr );

	/* If the width is less than 1 or there is no caption, return the content wrapped between the < tags. */
	if ( 1 > $attr['width'] || empty( $attr['caption'] ) )
		return $content;

	/* Set up the attributes for the caption <div>. */
	$attributes = ( !empty( $attr['id'] ) ? ' id="' . esc_attr( $attr['id'] ) . '"' : '' );
	$attributes .= ' class="wp-caption ' . esc_attr( $attr['align'] ) . '"';
/*	$attributes .= ' style="width: ' . esc_attr( $attr['width'] ) . 'px"';   */

	/* Open the caption <div>. */
	$output = '<div' . $attributes .'>';

	/* Allow shortcodes for the content the caption was created for. */
	$output .= do_shortcode( $content );

	/* Append the caption text. */
	$output .= '
' . $attr['caption'] . '
';

	/* Close the caption </div>. */
	$output .= '</div>';

	/* Return the formatted, clean caption. */
	return $output;
}

WordPress Automatic Update without FTP

Insert this line at the end of your wp-config.php file. This file is found in your site’s public root directory, sometimes called www, httpdocs or public_html.

define('FS_METHOD','direct');

This will allow your site to bypass all the permission and file ownership warnings and update your WordPress installation to the latest version.

Better SEO: Custom Meta Description for Every WordPress Post, without Plugins

Search engines use page’s meta description in search result snippets to provide more information about the content of the page and it’s relevance to the user’s query. Google recommend that you include a unique, descriptive meta description for each page. They sensibly prefer it to an auto-generated one, cobbled together out of words, phrases and chunks of sentences found throughout the page or entire site.

WordPress does not provide meta description out-of-the-box. While there are some excellent plugins that can greatly improve your site’s search engine friendliness, good practice is to keep the number of plugins to a minimum, especially when DIY solution is an easy one, as in this case.

To add the custom meta description feature to our site, we’ll make use of custom fields: the ability to include any number of key/value pairs with a post and then use them as needed.

So, let’s create a key/value pair by typing it into the form as shown bellow. The name of my key will be description, and for its value I’ll type in the meta description I want to use for my post:

wp-custom-field-meta-description-visual-culture.me

Now that we have the content of our new meta description for our post, all that’s let to do is call our meta key up and use it’s value in our page. Place the following code within the <head> tag in your template’s header.php file:

<meta name="description" content="<?php
	get_post_meta($post->ID, 'description', true);
?>" />

This is it. The HTML code for your page will now look like this:

wp-head-tag-code-visualculture-me

And this is how the link will appear in Google search results:

wp-google-snippet-visualculture-me