Powered by WordPress

I’m tidying up Itsonlybarney.com and turning it into more of a personal website, and WordPress related code, tutorials and reviews will now be part of a more appropriate website, Powered by WordPress.

I like playing with WordPress, in particular WordPress themes that are built upon the Genesis theme framework and I have shared my thoughts about WordPress and themes here on the blog, but I would rather this site be primarily a personal part of my online presence, and I dedicate a site to my learning about WordPress and Genesis, and that is what this move is about.

If you are signed up to my RSS feed for the WordPress code and discussions, please update your feed to point to the RSS feed of Powered by WordPress.

 

Custom Post Type with Custom Fields

I’m working on my first web design client at the moment, mind you I don’t think I will have the opportunity to modify the CSS in any significant shape or form, but I am in the process of creating a custom post type, and an output page that will only display information that is actually inserted into the custom fields.

<?php
// Clubs Post Type
add_action( 'init', 'codex_custom_init' );
function codex_custom_init() {
  $labels = array(
    'name' => _x('Caravan Clubs', 'post type general name'),
    'singular_name' => _x('Caravan Club', 'post type singular name'),
    'add_new' => _x('Add New', 'cclub'),
    'add_new_item' => __('Add New Caravan Club'),
    'edit_item' => __('Edit Caravan Club'),
    'new_item' => __('New Caravan Club'),
    'all_items' => __('All Caravan Clubs'),
    'view_item' => __('View Caravan Club'),
    'search_items' => __('Search Caravan Clubs'),
    'not_found' => __('No Caravan Clubs found'),
    'not_found_in_trash' => __('No Caravan Clubs found in Trash'),
    'parent_item_colon' => '',
    'menu_name' => 'Caravan Clubs'

  );
  $args = array(
    'labels' => $labels,
    'public' => true,
    'publicly_queryable' => true,
    'show_ui' => true,
    'show_in_menu' => true,
    'query_var' => true,
    'rewrite' => array('slug' => 'club', 'with_front' => false),
    'capability_type' => 'page',
    'has_archive' => true,
    'hierarchical' => false,
    'menu_position' => 6,
    'supports' => array( 'title', 'thumbnail', 'custom-fields')
  );
  register_post_type('cclub',$args);
}
view raw functions.php This Gist brought to you by GitHub.
<?php
remove_action('genesis_loop', 'genesis_do_loop'); //remove genesis loop
add_action('genesis_loop', 'ccnsw_clubs_loop'); //add the special loop

function ccnsw_clubs_loop() {
the_title( '<h1 class="ccnsw_title">', '</h1>' );

if( genesis_custom_field('ccnsw_logo') != '' ) { ?>
<img src="<?php genesis_custom_field('ccnsw_logo'); ?>" class="aligncenter" />
<?php }

if ( genesis_custom_field('ccnsw_photo') != '' ) { ?>
<img src="<?php genesis_custom_field('ccnsw_photo'); ?>" class="aligncenter" />
<?php }

if ( genesis_custom_field('ccnsw_president_name') != '' ) { ?>
<div class="ccnsw-left-col">President:</div><div class="ccnsw-right-col"><?php genesis_custom_field('ccnsw_president_name'); ?></div>
<?php }

if ( genesis_custom_field('ccnsw_secretary_name') != '' ) { ?>
<div class="ccnsw-left-col">Secretary:</div><div class="ccnsw-right-col"><?php genesis_custom_field('ccnsw_secretary_name'); ?></div>
<?php }

if ( genesis_custom_field('ccnsw_phone') != '' ) { ?>
<div class="ccnsw-left-col">Phone:</div><div class="ccnsw-right-col"><?php genesis_custom_field('ccnsw_phone'); ?></div>
<?php }

if ( genesis_custom_field('ccnsw_email') != '' ) { ?>
<div class="ccnsw-left-col">Email:</div><div class="ccnsw-right-col"><a href="mailto:<?php genesis_custom_field('ccnsw_email'); ?>"><?php genesis_custom_field('ccnsw_email'); ?></a></div>
<?php }

if ( genesis_custom_field('ccnsw_website') != '' ) { ?>
<div class="ccnsw-left-col">Website:</div><div class="ccnsw-right-col"><a href="<?php genesis_custom_field('ccnsw_website'); ?>"><?php genesis_custom_field('ccnsw_website'); ?></a></div>
<?php }
}

genesis();

I don’t think that this is the prettiest solution, but it is one that definitely works.

Feel free to borrow any of my code, however please let me know where you use it, and whether you improve on it so that we both learn in a collaborative manner.

If you can potentially suggest a better solution, I would love to see your thoughts and comments.

Itsonlybarney.com Version 1

You will have noticed that I have been yearning to updated the look here on the blog for a few weeks now, and I am getting closer to that stage where I am ready to launch a new theme.  As part of launching a new theme, I am open to releasing the previous version here via the blog.

For those of you interested in seeing how to setup the bookmarks page of the site, and the Genesis code and CSS I used, you can delve right in and grab the whole theme from Github, or you can check out the repository and pull the relevant part of code direct form the repo.

Thanks for the theme really goes to StudioPress for creating the magnificent Genesis framework, the Scribble theme, and VegasGeek for the Bookmarks child theme idea.

I hope you can learn from it, and I look forward to seeing what new themes you create.

Basic Minimalism

Basic Minimalism is a minimalist theme built as a child theme on the Genesis Framework.

As the site currently stands, I am working using multiple Cascading Style Sheets (CSS) so that I can focus on one aspect of the site at a time, whether it be the column layouts, typography or styling of elements, I can focus on just those elements rather than working around the other CSS aspects as well.

The theme reset is based on HTML5 reset in preparation for HTML5 coming to the Genesis Framework.

Download

Future Plans

  • Combine the CSS files to have a single CSS file and a custom.css file for theme customisations
  • Tidy up the header area
  • Add code library of options

Changelog

v 0.9.0 – Initial Release
  • Basic layouts setup
  • Basic CSS setup

Updated Website

You may have noticed in the last week, that I have added a page to the site with a list of websites that I have bookmarked as useful, and websites that I still need to read.

The idea of the page is based upon the Bookmarks child theme built on the Genesis framework. There is also a Chrome plugin that allows me to easily add these links to the website straight from the browser.

The Chrome extension adds the link to a WordPress installation using the Link Post Format.  The standard WordPress loop includes all post formats by default, but when I add links on an almost weekly basis, I don’t want these links to overrun the main point of this blog.  Unfortunately the Chrome extension doesn’t support custom post types, so I needed a work-around to exclude the “Link” post format from the loop.

I initially posted to the StudioPress support forum, and was directed to the WordPress Codex. I did some further digging around, and arrived at Otto’s website about Advanced Taxonomy Queries using WordPress 3.1.

As you are aware I use Genesis here on Itsonlybarney.com and I added the necessary code based on Otto‘s example code to exclude the Link post format from the loop here on the site.

Here is the code I am using, and I hope you find it useful:

function child_grid_loop_helper() {
genesis_grid_loop( array(
'features' => 2,
'feature_image_size' => 0,
'feature_image_class' => 'aligncenter post-image',
'feature_content_limit' => 0,
'grid_image_size' => 0,
'grid_content_limit' => 400,
'more' => __( '[Continue reading...]', 'genesis' ),
'posts_per_page' => 6,

// Exclude Link Post Format
'tax_query' => array(
array(
'taxonomy' => 'post_format',
'field' => 'slug',
'terms' => array( 'post-format-link' ),
'operator' => 'NOT IN',
)
)
// End Exclude Link Post Format

) );
}
remove_action( 'genesis_loop', 'genesis_do_loop' );
add_action( 'genesis_loop', 'child_grid_loop_helper' );
view raw home.php This Gist brought to you by GitHub.

The code above assumes you are using the Genesis Grid Loop, if you are using the regular loop, the code will need to be modified and applied to the standard loop via queries.

If you want to exclude additional post formats, you need to add them to the array.

Did you find this code useful, please let me know in the comments below.

Adding Social Twitter

I haven’t implemented this here on the blog, however I am definitely considering doing so.  Do you want to make sharing of your blog articles on Twitter easier than ever?

The easiest option is to add a Twitter button on each post.  The following code does just that, and the button will only appear on a single post, and not blog, archive, or search pages.

add_action( 'the_content' , 'itsb_tweet_button' );
function itsb_tweet_button( $content ) {
if ( is_single() )
return '<div class="twitter-button"><a href="http://twitter.com/share" class="twitter-share-button" data-url="'. get_permalink() .'" data-count="vertical" data-via="oursexsecrets">Tweet</a><script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script></div>' . $content;
return $content;
}
view raw functions.php This Gist brought to you by GitHub.

The code adds a div before the main content that you can style as you want.  You can float it to the left or the right, and position as you want.

You can also customise the output of the function, and move the twitter button to the end of the content.  Or add other social media buttons as well, tweaking the output and position the way you like it.

Using LessCSS

I’ve been experimenting with a number of CSS methods to try and make WordPress theme development more friendly for both myself, and for others who may want to tweak the theme when I have released it into the wild internet.

One particlar method I have been using is LessCSS.

I use the following code to add the less.js file, as well as linking to a .less file.

add_action( 'wp_head' , 'itsb_lesscss' );
function itsb_lesscss() {
?>
<link rel="stylesheet/less" type="text/css" href="<?php echo get_template_directory_uri(); ?>/style.less">
<script src="<?php echo get_template_directory_uri(); ?>/js/less.js" type="text/javascript"></script>
<?php // Download the less.js file from http://lesscss.org/
}
view raw functions.php This Gist brought to you by GitHub.

You can adjust the locations of the files to suit your file structure for your theme, but this will add the necessary code.

Private Git Repository?

Again I’m not happy with my blog theme design, and thinking about a design update for the blog, hopefully to something that reflects me.

But as I’m designing the theme, I want to keep it private until I have a 95% ready issue.  So how would you go about working it?  I’m thinking of using Github as I have a number of other themes over there, but at the same time, I would rather a private repository to store the files until I am ready to release it publically.

So who would you use?  Github and pay to have a private repo?  Or an alternative provider that gives private repos for free accounts?  I’m thinking the latter because I’m not really a fully-fledged designer to warrant paying, but going with a hosted repo with a reputation seems like a good thing to go with.

What are your thoughts?

Moved to Git

Since I’m looking at some theme design these holidays, I’ve decided to move my code to a hosted repository such as Git for version control and storage.

I have also updated the Minimalism Theme I created, and moved that to Github, where you can easily download the latest theme code.

If you would like to share your design processes, as well as workflows with Github, I’d love to hear from you.

Minimalism Theme

I’m happy to announce the release of my first Genesis child theme, Minimalism.  This WordPress theme works on the Genesis framework and can be downloaded directly from my Github repository.

Theme Features

  • Built on top of the Genesis Framework
  • The Minimalism theme is currently a basic theme upon which can be built a fully fledged theme
  • 2 layout options
  • Minimal image use to reduce server calls

Screenshot

Will be added shortly

Download: Minimalism Theme (Github Download)