Professional Web Designer - CIPPO Design » Tutorials http://cippodesign.com Custom Web Design – WordPress Design – CMS Design, Web Development – PSD to xHTML – PSD to WordPress, SEO plus other services Fri, 04 Nov 2011 15:55:02 +0000 en hourly 1 http://wordpress.org/?v=3.2.1 WordPress search with pagination http://cippodesign.com/tutorials/wordpress3/wordpress-search-with-pagination.html http://cippodesign.com/tutorials/wordpress3/wordpress-search-with-pagination.html#comments Mon, 22 Aug 2011 17:27:24 +0000 Cippo http://cippodesign.com/?p=973 Find out more →]]> I’ve recently had some issues with wordpress search and custom pagination. Google helped me to find a nice WordPress function that displays the pagination without a plugin. So using the function from that page gave me few headaches but I have managed to solve the navigation with the help of a small plugin that’s called Nice Search.

I’ve also had issues making the pagination work with a wp_query ..

]]> http://cippodesign.com/tutorials/wordpress3/wordpress-search-with-pagination.html/feed 0 How to remove base category in WordPress http://cippodesign.com/tutorials/wordpress3/remove-wordpress-base-category.html http://cippodesign.com/tutorials/wordpress3/remove-wordpress-base-category.html#comments Sat, 08 Jan 2011 17:09:45 +0000 Cippo http://cippodesign.com/?p=945 Find out more →]]> After wasting precious hours ( maybe days ) looking for a way to remove the base /category/ thing from wordpress category list ( when linking to it ) I couldn’t believe my eyes how easy it was.

No plugins, No PHP, No .htaccess

The most easy way to get rid of that /category/, without -plugins, -.htaccess, -PHP or anything else.from your wordpress categories, you have to put a DOT ( . ) in the base category in permalinks settings.

Make sure that you use for permalink settings something like /%category%/%postname%/

]]> http://cippodesign.com/tutorials/wordpress3/remove-wordpress-base-category.html/feed 2 Display backslash in wordpress posts http://cippodesign.com/tutorials/wordpress3/display-backslash-in-wordpress-posts.html http://cippodesign.com/tutorials/wordpress3/display-backslash-in-wordpress-posts.html#comments Mon, 02 Aug 2010 08:18:19 +0000 Cippo http://cippodesign.com/?p=650 Find out more →]]> I had a hard time figuring how to make wordpress display backslashes in posts. There are 2 solutions for this problem:

  1. Use html code for backslash which is \
  2. Use double backslashes like \\

The html code must be inserted from “HTML” view, which might be a little inconvenient while the double backslashes can be used in the “Visual” view.

]]> http://cippodesign.com/tutorials/wordpress3/display-backslash-in-wordpress-posts.html/feed 0 Remove extra slashes http://cippodesign.com/tutorials/wordpress3/remove-extra-slashes.html http://cippodesign.com/tutorials/wordpress3/remove-extra-slashes.html#comments Sun, 01 Aug 2010 13:49:20 +0000 Cippo http://cippodesign.com/?p=576 Find out more →]]> I’ve recently installed the TinyMCE Advanced plugin and when I tried to set properties for my titles, I got something like this:

<h3 class="\"test-class\""> instead of
<h3 class="test-class"> so I asked google about it.

I’ve got the following solution, to strip slashes from all the posts:

add_filter('the_content', 'my_strip_slashes');

function my_strip_slashes($content)
{
return stripslashes($content);
}

Place the code above in your functions.php file and your problems are solved. No more headaches.

]]> http://cippodesign.com/tutorials/wordpress3/remove-extra-slashes.html/feed 0 WordPress 3.0 custom taxonomies http://cippodesign.com/tutorials/wordpress3/custom-taxonomies.html http://cippodesign.com/tutorials/wordpress3/custom-taxonomies.html#comments Mon, 19 Jul 2010 19:51:46 +0000 Cippo http://cippodesign.com/?p=457 Find out more →]]> You have to build a website for a restaurant and you have chosen WordPress to do the job. It’s time to add restaurant’s products but you have to classify them. Well there’s a very easy way to do that.

What products does a restaurant have? Well, I think a regular restaurant has Breakfast, Launch, Dinner, Beverage and Dessert.

Open functions.php from your wordpress theme directory and add the following code:

function create_menu_categories() {

register_taxonomy(‘menu_type’, ‘post’, array(‘hierarchical’=>;false, ‘label’=>’Menu type’, ‘query_var’=>true, ‘rewrite’=>true));

}

add_action(‘init’, ‘create_menu_categories’, 0);

Query for posts, using custom tag

To display only posts that have a specific tag from your custom taxonomies, place the code before the loop:

<?php query_posts(array('menu_type' => 'dessert', 'showposts' => 10)); ?>

You can change dessert to any other tag listed in the custom taxonomies and you can change, of course, how many posts to show by changing the number 10 to your number.

]]> http://cippodesign.com/tutorials/wordpress3/custom-taxonomies.html/feed 0 Custom WordPress 3.0 theme (p1) http://cippodesign.com/tutorials/custom-wordpress-3-theme-development-part-1.html http://cippodesign.com/tutorials/custom-wordpress-3-theme-development-part-1.html#comments Thu, 15 Jul 2010 22:08:11 +0000 Cippo http://cippodesign.com/?p=380 Find out more →]]> I was thinking to give some help regarding WordPress 3.0 theme development using custom post types and other cool new features so I will show you how to create a custom Wordperss 3.0 portfolio theme.

You will be able to add and manage portfolio items, testimonials, posts thumbnail and more to come.

Warning, design is not included :D

How to create a WordPress portfolio theme

To do this, you have to get your hands dirty :)

Alright, what do we need to accomplish this? For the beginning we will need to create the following files:

  • header.php
  • footer.php
  • index.php
  • loop-index.php
  • style.css
  • functions.php
  • front-page.php
  • page.php
  • single.php
  • comments.php
  • sidebar.php

All these files must be placed in a theme directory.

let’s name our theme.. portfolish

Create a folder in wp-content/themes directory, name it portfolish and place there all the files listed above.

create the header.php file


<?php
/**
* The Header for our theme.
*
* @package WordPress
* @subpackage Portfolish
* @since Portfolish version 0.1
*/
?>
<!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head>
<meta charset="<?php bloginfo( 'charset' ); ?>" />
<title>
<?php // Returns the title based on what is being viewed
if ( is_single() ) { // single posts
single_post_title(); echo ' | '; bloginfo( 'name' );
// The home page or, if using a static front page, the blog posts page.
} elseif ( is_home() || is_front_page() ) {
bloginfo( 'name' );
if( get_bloginfo( 'description' ) )
echo ' | ' ; bloginfo( 'description' );

} elseif ( is_page() ) { // WordPress Pages
single_post_title( '' ); echo ' | '; bloginfo( 'name' );
} elseif ( is_search() ) { // Search results
printf( __( 'Search results for %s', 'portfolish' ), '"'.get_search_query().'"' ); echo ' | '; bloginfo( 'name' );
} elseif ( is_404() ) {  // 404 (Not Found)
_e( 'Not Found', 'portfolish' ); echo ' | '; bloginfo( 'name' );
} else if (is_author()) { // author posts
get_the_author(); echo "Author archives "; echo ' | '; bloginfo( 'name' );
// The home page or, if using a static front page, the blog posts page.ci
} else { // Otherwise:
wp_title( ' ' ); echo ' | '; bloginfo( 'name' );
}
?>
</title>
<link rel="profile" href="http://gmpg.org/xfn/11" />
<link rel="stylesheet" type="text/css" media="all" href="<?php bloginfo('stylesheet_url'); ?>" />
// Use our own css file for customization
<link rel="stylesheet" type="text/css" media="all" href="<?php bloginfo( 'template_url' ); ?>/theme.css" />
<link rel="pingback" href="<?php bloginfo( 'pingback_url' ); ?>" />
<?php
/* We add some JavaScript to pages with the comment form
* to support sites with threaded comments (when in use).
*/
if ( is_singular() && get_option( 'thread_comments' ) )
wp_enqueue_script( 'comment-reply' );

/* Always have wp_head() just before the closing </head>
* tag of your theme, or you will break many plugins, which
* generally use this hook to add elements to <head> such
* as styles, scripts, and meta tags.
*/

wp_head();
?>
<body <?php body_class(); ?>>
<a href="<?php echo site_url(); ?>" id="web-portfolio">
<?php // Returns the title based on what is being viewed
if ( is_single() ) { // single posts
single_post_title(); echo ' | '; bloginfo( 'name' );
// The home page or, if using a static front page, the blog posts page.
} elseif ( is_home() || is_front_page() ) {
bloginfo( 'name' );
if( get_bloginfo( 'description' ) )
echo ' | ' ; bloginfo( 'description' );

} elseif ( is_page() ) { // WordPress Pages
single_post_title( '' ); echo ' | '; bloginfo( 'name' );
} elseif ( is_search() ) { // Search results
printf( __( 'Search results for %s', 'portfolish' ), '"'.get_search_query().'"' ); echo ' | '; bloginfo( 'name' );
} elseif ( is_404() ) {  // 404 (Not Found)
_e( 'Not Found', 'portfolish' ); echo ' | '; bloginfo( 'name' );
} else { // Otherwise:
wp_title( ' ' ); echo ' | '; bloginfo( 'name' );
}
?>
</a>
<ul id="wrapper">
<li>
<a href="<?php echo site_url(); ?>"><img src="<?php echo bloginfo('template_url'); ?>/images/logo.png" alt="My Web Portfolio"/></a>
</li>
<li>
<?php wp_nav_menu(array('menu'=>'Main Menu','container'=>'', 'menu_class'=>'absolute')); ?>
</li>



create the footer.php file


<?php
/**
* The template for displaying the footer.
*
* @package WordPress
* @subpackage Portfolish
* @since Portfolish version 0.1
*/
?>
<li>
<ul>
<li id="copy-design"><span>Copyright &copy; <a href="<?php echo site_url(); ?>">Portfolish</a> 2010 - <?php echo date('Y'); ?>  | <a href="<?php echo esc_url( __('http://wordpress.org/', 'portfolish') ); ?>"
title="<?php esc_attr_e('Semantic Personal Publishing Platform', 'portfolish'); ?>" rel="generator">
<?php printf( __('Proudly powered by %s.', portfolish'), 'WordPress' ); ?>
</a></span>
<li>
<?php get_sidebar( 'footer' ); ?>
</li>
</ul>
</li>
</ul>

<?php
/* Always have wp_footer() just before the closing </body>
* tag of your theme, or you will break many plugins, which
* generally use this hook to reference JavaScript files.
*/

wp_footer();
?>

</body>
</html>


I will show you in the next chapter how to create the loop for index and how to create custom post types.

]]> http://cippodesign.com/tutorials/custom-wordpress-3-theme-development-part-1.html/feed 0