How to Set default thumbnails size & creating multiple thumbnail sizes?

Registers a new image size. This means WordPress will create a copy of the image with the specified dimensions when a new image is uploaded.

To set the default Featured Image (formerly Post Thumbnail) dimensions use: set_post_thumbnail_size(). 



<?php add_image_size( $name, $width, $height, $crop ); ?>

if ( function_exists( 'add_theme_support' ) ) {
   add_theme_support( 'post-thumbnails');
   set_post_thumbnail_size( 200, 200, true );
}

What does above code really mean?

Does it mean all my thumbnails will be 800x600 or smaller? Because even after setting set_post_thumbnail_size get_post_thumbnail_id($post->ID) points to full-sized thumbnails (like 2500x1200). I don't really need that big images...

When do WordPress create (custom) thumbnails?

Set the image size by cropping the image (not showing part of it):
Set the image size by resizing the image proportionally (without distorting it):

add_image_size( 'custom-size', 220, 220, array( 'left', 'top' ) ); // Hard crop left top

When setting a crop position, the first value in the array is the x axis crop position, the second is the y axis crop position.

• x_crop_position accepts 'left' 'center', or 'right'.
• y_crop_position accepts 'top', 'center', or 'bottom'.

By default, these values default to 'center' when using hard crop mode.

if ( function_exists( 'add_theme_support' ) ) {
  add_theme_support( 'post-thumbnails');
  set_post_thumbnail_size( 900, 600, true );
  add_image_size( 'foo', 400, 300, true );
  add_image_size( 'bar', 200, 250, true ); 
}

When are these custom thumbnails created (like image-900x600.jpg / image-400x300.jpg etc.) ? Only during upload process? What if I'm just changing themes to theme based on add_image_size functions with different thumbnail sizes, do I have to reupload all my images to get right sizes? If yes, then using timthumb over add_image_size wasn't that bad idea..

How to set different thumbnail sizes per custom post type?

Registers a new image size. This means WordPress will create a copy of the image with the specified dimensions when a new image is uploaded.
To set the default Featured Image (formerly Post Thumbnail) dimensions use: set_post_thumbnail_size().

Usage

<?php add_image_size( $name, $width, $height, $crop ); ?>

if you have multiple post types, maybe this will help
(not tested)(in the loop)

<?php
$post_type = get_post_type(); // get's the post type of a post in the loop
$args=array(
  'public'   => true,
  '_builtin' => false
);
$output = 'names'; // names or objects
$operator = 'and'; // 'and' or 'or'
$post_types = get_post_types($args,$output,$operator); // gets all post types you registered
$post_types = array_values($post_types); // makes it a numerically indexed array

if(in_array( $post_type, $post_types)){ // post is a custom post type -> show post type size thumbnail
  $custom_post_thumbnail = get_the_post_thumbnail($post->ID, $post_type.'-thumbnail');
  if($custom_post_thumbnail != ''){ // there is a custom post thumbnail size
    echo $custom_post_thumbnail;
  } else { // no custom post thumbnail size -> show normal thumbnail
    echo get_the_post_thumbnail($post->ID);
  }
} else { // show normal thumbnail for posts and pages
  echo get_the_post_thumbnail($post->ID);
}
?>

You still have to add the image sizes manually in your theme's functions.php

If you have custom post types review and movies:

add_image_size( 'review-thumbnail', 150, 200, true );
add_image_size( 'movies-thumbnail', 400, 9999 );

How to Display Featured Post with Thumbnails Without Plugin in Homepage

On home page, we generally show a fixed number of recent posts with summary. Although, WordPress provides Sticky Posts functionality but not so useful when number of featured posts are more. So I decided to implement this without any plugin.

1. Display featured post with thumbnail.
2. Title will be placed below the thumbnail.
3. Featured posts will be randomly selected and must show default thumbnail if no thumbnail is defined for the post.
4. All selected posts must appear together, no slider to navigate.
5. It must not use any script(Not good for SEO) or plugin.

1. To implement this, First, You need to create a category (say featuredcategory) and add featured posts in the category.
2. Write following code in function.php of your WordPress theme.

<?php

function getFeaturePosts(){

 ?>             

                <ul class="related-posts">

                <?php

                $default_thumbnail = 'http://img.techbrij.com/techbrij%20logo.gif';

                $the_query = new WP_Query('showposts=5&orderby=rand&category_name=featuredcategory');

                while ($the_query->have_posts()) : $the_query->the_post(); ?>

                        <li>

                             <div class="related_thumbnail">

            <a href="<?php the_permalink() ?>" rel="bookmark" title="<?php the_title_attribute(); ?>">                           

                            <?php

                            if (has_post_thumbnail()):

                             the_post_thumbnail();

                            else:

                            ?>

                            <img src="<?php echo $default_thumbnail; ?>" alt="<?php the_title(); ?>" />

                            <?php endif; ?>

                            </a>

        </div>

        <div style="clear:both;"></div>

            <div class="related_permalink">

            <a href="<?php the_permalink() ?>" rel="bookmark" title="<?php the_title_attribute(); ?>"><?php the_title(); ?></a>      

        </div>

                             

                        </li>            

 

                <?php endwhile; ?>

                <?php wp_reset_query(); ?>

                </ul>

<?php

}

 ?>




In the above code, you need to define $default_thumbnail parameter and assign default thumbnail link. If there is no thumbnail then defined $default_thumbnail link will be displayed.
Following line is the most important line.
$the_query = new WP_Query(‘showposts=5&orderby=rand&category_name=featuredcategory’);
showposts=5: define number of posts to be displayed
orderby=rand: posts are randomly selected
category_name=featuredcategory: define category of featured posts.
3. Add following styles in your css file:

?

/* Related OR Feature Posts */ .related-posts {     list-style:none;     margin:0;     padding:0;           }    .related-posts li {     display:block;     text-align:center;     float:left;     margin:0 auto;     padding-left:3px 10px 3px 0px;        width:150px;     height:175px; } .related-posts li :hover{   } .related_permalink{       text-align:center;     padding-top:5px;        padding-bottom:5px; margin-bottom:2px;    }  .related_permalink a{ color:black; font-weight:bold;  text-decoration:none;  }  .related_permalink a:hover{  text-decoration:underline;  } .related_thumbnail{      text-align:center; } .related_thumbnail img { border-width:0px; width:100px; float:none; margin:0 auto; } /* Related Posts End */

you can change thumbnail size by defining height and width in .related_thumbnail img style.
4. Now call method where you want to display featured posts.

?

<?php  getFeaturePosts(); ?>

See following sample display of featured posts:

How to regenerate thumbnails in wordpress

There are times when you may want to change the thumbnail or featured image dimensions in your current WordPress theme or you may have planned to switch to a new theme. In both of these cases, you would feel the need of regenerating thumbnails, compatible to new dimensions. In this post, we have shared a plugin called Regenerate Thumbnails, which allows you to regenerate the new thumbnails after changing the thumbnail sizes in WordPress.

What’s the use of this plugin?

This plugin is very useful if you have changed the thumbnail dimensions (sizes) recently in WordPress (Settings » Media) or if you have switched to a new theme, which is having different thumbnail (featured image) dimensions.

Plugin Configuration

You will be able to configure the plugin's settings for your own particular needs by doing the following:

1. From the left hand navigation menu, click Tools > Regen. Thumbnails.
2. On the next screen, click Regenerate All Thumbnails.

The plugin will then regenerate new image sizes as defined by your theme or on the Settings > Media page

Regenerate  Thumbnails by other plugin

find the AJAX Thumbnail Rebuild to be better than the regenerate thumbnails plugin, because it doesn't tie up your server as bad, allows you to skip certain sizes (which saves time), and gives more visual feedback.

How to solve a conflict between a plugin and a theme in wordpress?

The default transition effect between slides is a crossover effect (like this example), but the effect in my slider seems to be image fade to white, then white fades to image. Not sure why this is happening.

Here is the code that calls other scripts:

The original solution (at the bottom) worked in a specific plugin situation (with WP Touch).
I think this is the proper one:

add_action( 'wp_enqueue_scripts', 'wpse_77772_remove_theme_enqueues', 11 );

function wpse_77772_remove_theme_enqueues()
{
    if( is_front_page() || is_home() ) 
    {
        wp_dequeue_script('hatch_pro_fancybox');
        // etc
    }
}

**
 * Proper way to enqueue scripts and styles
 */
function theme_name_scripts() {
 wp_enqueue_style( 'style-name', get_stylesheet_uri() );
 wp_enqueue_script( 'script-name', get_template_directory_uri() . '/js/example.js', array(), '1.0.0', true );
}

add_action( 'wp_enqueue_scripts', 'theme_name_scripts' );

Wordpress Developer Documentation

WordPress is fast, lightweight, and easy to use. To ensure it stays that way, the Core Team thinks carefully about adding functionality to the core WordPress code. Still, users often find the need to graft additional functionality onto WordPress to meet their needs. This section of the Codex offers guidelines and references for anyone wishing to modify, extend, or contribute to WordPress.

How to create custom theme options in wordpress ?

How to add custom logo in wordpress theme

The WordPress theme customizer is famous for being able to change your theme colors in real time, but did you know it can handle almost any type of theme option?
You can add layout options, image uploaders, text fields, and lots more. The possibilities are endless!
There is almost no need for theme options pages anymore. I personally like the idea of having no theme options page, and limiting everything to the theme customizer.
I’m going to show you how to add a custom logo uploader to your theme customizer, then display it in place of the site title and tagline.

Create the logo uploader setting

This may be review for some of you, but I’ll go over my basic setup for using the theme customizer. In my custom theme folder most of the code is going into /inc/customizer.php, and then we will include that file via functions.php. You could put all the code into functions.php and it will work, but it’s nice to keep functions.php uncluttered.
First, we create our function to register the new settings. I’ve prefixed my function name with m1, but you can use whatever you want:

function m1_customize_register( $wp_customize ) {

    // All the code in this tutorial goes here

}

add_action( 'customize_register', 'm1_customize_register' );

Inside our function we need to register a setting. This saves the logo url in the database so we can use it in our theme.

function m1_customize_register( $wp_customize ) {

    $wp_customize->add_setting( 'm1_logo' ); // Add setting for logo uploader

}

add_action( 'customize_register', 'm1_customize_register' );

Next, we add the uploader and assign it to a section. You could create a new section, but I think it goes nicely with the title and tagline. If you are using a different name for your setting, make sure you change all instances of m1_logo to something else.

function m1_customize_register( $wp_customize ) {

    $wp_customize->add_setting( 'm1_logo' ); // Add setting for logo uploader

         

    // Add control for logo uploader (actual uploader)

    $wp_customize->add_control( new WP_Customize_Image_Control( $wp_customize, 'm1_logo', array(

        'label'    => __( 'Upload Logo (replaces text)', 'm1' ),

        'section'  => 'title_tagline',

        'settings' => 'm1_logo',

    ) ) );

}

add_action( 'customize_register', 'm1_customize_register' );

That’s it for the code in customizer.php. To make sure our theme uses this file, simply add this one line of code in functions.php:

require get_template_directory() . '/inc/customizer.php';

That’s it! We kept our functions.php file clean as a whistle.
Next we need to display our logo.

Displaying the logo

We are going to work in our theme’s header.php file to display the logo. If there is no logo, we’ll just display the site title and description.
To get the logo url from our theme customizer, you use this code:

get_theme_mod( 'm1_logo' )

You can store that in a variable if you want, or echo it out as is. Since we are only using this value once in our theme, we don’t need to store it in a variable.
Wherever your site title is displayed in header.php, you’ll want to replace it with this code:

<?php if ( get_theme_mod( 'm1_logo' ) ) : ?>

    <a href="<?php echo esc_url( home_url( '/' ) ); ?>" id="site-logo" title="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>" rel="home">

        <img src="<?php echo get_theme_mod( 'm1_logo' ); ?>" alt="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>">

    </a>

    <?php else : ?>

               

    <hgroup>

        <h1 class="site-title"><a href="<?php echo esc_url( home_url( '/' ) ); ?>" title="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>" rel="home"><?php bloginfo( 'name' ); ?></a></h1>

        <p class="site-description"><?php bloginfo( 'description' ); ?></p>

    </hgroup>

               

<?php endif; ?>

So let’s talk through that chunk of code. First, we create an if statement that says, “if a theme logo has been uploaded, display this logo code. Otherwise, display the site title and site description.”
The logo is linked to the homepage, it has some alt text, blah blah blah. The important part is this:

src="<?php echo get_theme_mod( 'm1_logo' ); ?>"

Make sure to tell the user a recommended logo size, otherwise they can upload a huge file that doesn’t fit quite right. You might also want to give the container around the logo a constrained width, so it will fit no matter what.

How to disable admin bar in wordpress

Set the display status of the Toolbar for the front side of your website (you cannot turn off the toolbar on the WordPress dashboard).
Placing the above line of code in theme's function.php file will prevent the Toolbar from rendering on the front end of your site.
You can also determine for which users the admin bar is shown. For example the following lines will only display the admin bar for users with administrative privileges.

if ( ! current_user_can( 'manage_options' ) ) {
    show_admin_bar( false );
}

With newer version of WordPress you may need to use the following which 
will leave the Toolbar available in the Dashboard but hide it on all 
front facing pages. 

add_filter('show_admin_bar', '__return_false'); 

how to disable comments in wordpress

Settings >> Discussion >> uncheck "Allow people to post comments on new articles"
This applies to new posts that you will publish from now on. To disallow comments from already publish posts:
Posts >> select them all and "Edit" under bulk actions and hit apply >> choose "do not allow" next to comments and hit update posts. and other way

The topic title talks about "pages". Assuming that you want to continue have discussion on your blog posts but turn it off only from "pages, you'll have to remove the code snippet "<?php comments_template(); ?>" from the page.php of your theme, as mercime advised.

Disable free shipping on discount products in woocommerce

Hello everyone!
In my store, I am allowing free shipping on orders with minimum amount.
I would like to disable the free shipping when there are discounted products on the cart.
I probably need to add the check if discount is > 0 and disallow free shipping code, but since I am not a developer I cant find where and how to add this.
Thanks for your help!
Sanjoy.
https://wordpress.org/plugins/woocommerce/

How to install Wordpress in locahost?

First thing you need to do is go to WampServer website and download the latest WampServer. You will be presented with various options on their download page. Simply choose the one that applies to your Windows (64-bit or 32-bit). When in doubt, select the 32-bit version because it will work on 64-bit versions of Windows.
Once you have downloaded WampServer, run the installation program and follow on-screen instructions. At one point during the installation, WampServer will ask for the location of the default web browser. By default it will use Internet Explorer, but you can change that to Google Chrome or Firefox by locating the browser in Program Files.

Once you are done with the installation, launch WampServer.

Setting Up a Database for WordPress

WampServer comes with phpMyAdmin, a web based application to manage MySQL databases. Click on the Wampserver icon in windows taskbar and then click on phpmyadmin.

phpMyAdmin will open in a new browser window. Click on Databases in phpmMyAdmin to create a new database for WordPress. Choose a name for your database and click on Create button.

Installing WordPress on Windows with WAMP

Download a copy of WordPress from WordPress.org. Extract the zip file and copy the wordpress folder. Go to C:\wamp\www and paste wordpress folder there. You can rename the wordpress folder to anything you want for example mysite, wpbeginner, etc. For the sake of this tutorial, we renamed our wordpress directory to mysite. Now open a web browser and go to:
http://localhost/mysite/
WordPress will inform you that it can not find a wp-config.php file. Click on the Create a Configuration File button to create it.

On the next screen, you need to provide your database information. The database name will be the one that you selected. In our case, we called it test_db.
Please note that your default database username will be root and leave the password blank. Click on the submit button and WordPress will create a configuration file for you.

After this you will see a screen informing you that WordPress has successfully created the configuration file, and you can proceed with the installation. Click on Run Install button.

On the next screen, fill out the installation form. You need to provide a title for your website, choose an admin username and password, and provide admin email address. Finally press the Install WordPress button.

WordPress will quickly run the installation and create database tables. Once done, you will see a success message after the installation. You can then proceed to your WordPress by clicking on the Log in butto