Wednesday 27 May 2015

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.

How to turn off wordpress update notification

For all the WordPress users, it is really annoying when WordPress update notice is displayed on the dashboard if there are any upgrade available for the installed WordPress version as shown in the figure below. The notice will not clear until the WordPress is upgraded to latest version. Similarly the update notice for installed plugins & themes is displayed on the WordPress dashboard, plugins & themes pages. Actually it is good to know that updates are available but administrators who maintain multiple installations of WordPress on behalf of other people (eg. clients) may not want theme update notifications to be shown to the users of these installations, then disabling such notifications becomes necessary. In this article, I will show how to disable update notifications for core WordPress as well as for plugins and themes.

1. To Disable Update WordPress nag :

Insert the following code to the functions.php file of your active theme. It will remove the WordPress update nag e.g. WordPress 3.9.1 is available! Please update now, from the all users dashboard, admin dashboard & from Updates page as well.

add_action('after_setup_theme','remove_core_updates');
function remove_core_updates()
{
 if(! current_user_can('update_core')){return;}
 add_action('init', create_function('$a',"remove_action( 'init', 'wp_version_check' );"),2);
 add_filter('pre_option_update_core','__return_null');
 add_filter('pre_site_transient_update_core','__return_null');
}
 

2. To Disable Plugin Update Notifications :

Insert the following code to the functions.php file of your active theme. It will remove the update notifications of all the installed plugins.

remove_action('load-update-core.php','wp_update_plugins');
add_filter('pre_site_transient_update_plugins','__return_null');
 

3. To Disable all the Nags & Notifications :

Insert the following code the functions.php file of your active theme. This code disables all the updates notifications regarding plugins, themes & WordPress completely.

function remove_core_updates(){
global $wp_version;return(object) array('last_checked'=> time(),'version_checked'=> $wp_version,);
}
add_filter('pre_site_transient_update_core','remove_core_updates');
add_filter('pre_site_transient_update_plugins','remove_core_updates');
add_filter('pre_site_transient_update_themes','remove_core_updates');
 
Apart form these codes there are some WordPress plugins available to Disable WordPress Update Notifications & Nags :
If you install & activate these plugins, you will have to keep yourself updated with the latest version of your active WordPress, plugins & themes so that your blog or website wont be susceptible to security vulnerabilities or performance issues. Just deactivate the plugin for short period of time & update yourself.
 

 

 

Tuesday 19 May 2015

how to change woocommerce language?

WooCommerce comes localization ready out of the box – all that’s needed is your translation, if the plugin does not come bundled with one for your language.
There are several methods to create a translation, most of which are outlined in the WordPress Codex. However, we find the easiest method is to use a plugin called Loco Translate. More advanced users can use PoEdit. Both methods are covered in this doc.

Before you begin 

WooCommerce includes a language file (.po or .pot file) which contains all of the English text. You can find this language file inside the plugin folder in woocommerce/i18n/languages/.

Set up WordPress

WordPress needs to be told which language it should run under.
  1. Go to: Dashboard > Settings > General and change the Site language.
Once this has been done, the shop will be displayed in your locale if the language file exists. Otherwise you need to create the language files (process explained below).

WooCommerce 2.2+ Language Packs 

From version 2.2, WooCommerce includes a language pack downloader. PO and MO files will no longer be bundled with the plugin – they will be downloadable from your dashboard if you have the WPLANG constant set, or from a git repository if you wish to grab them manually. A notice will be displayed within your administration:
Update WooCommerce 2.2+ Translation Packs
Update WooCommerce 2.2+ Translation Packs
If for some reason the translation packs install fails, you can force the download in WooCommerce > System Status > Tools > Force Translation Upgrade:
Force Translation Upgrade (WooCommerce > System Status > Tools)
Force Translation Upgrade (WooCommerce > System Status > Tools)
PO and MO files are copied in wp-content/languages/woocommerce/

How to re-order the product tabs?

Change it as you want it and add to the functions.php, but here is a snippet to put the reviews first, description second and additional info third:

add_filter( 'woocommerce_product_tabs', 'woo_reorder_tabs', 98 );
function woo_reorder_tabs( $tabs ) {
 
$tabs['reviews']['priority'] = 5; // Reviews first
$tabs['description']['priority'] = 10; // Description second
$tabs['additional_information']['priority'] = 15; // Additional information third
 
return $tabs;
}

Connect your eBay store to your WooCommerce shop with ease

Using this easy yet flexible plugin, you can link up your eBay store with your WooCommerce shop as well as benefit from all the added features, including verifying items and getting listing fees before actually listing them. WP-Lister for eBay plugin

WP-Lister for eBay Download

How to add videos to your products for customers to watch

This simple little "WooCommerce Video Product Tab"   plugin to  allows you to add a Video to the Product page with an additional tab that allows your customers to view the video you embedded..simple! Click below link to download this woocommerce addon


WooCommerce Video Product Tab  Download

How to remove the ‘reviews’ tab so that only ‘product description’ appears

Just add this little line of code to your custom.css file:
.woocommerce .woocommerce-tabs ul.tabs {display:none !important}

How to remove specific (or all) of the product tabs

Use this snippet in the functions.php if you want to remove any (or all) of the product tabs, such as the description and reviews:


       
add_filter( 'woocommerce_product_tabs', 'woo_remove_product_tabs', 98 );
function woo_remove_product_tabs( $tabs ) {
unset( $tabs['description'] ); // Remove the description tab unset( $tabs['reviews'] ); // Remove the reviews tab
unset( $tabs['additional_information'] ); // Remove the additional information tab
return $tabs;
}

Add a border around the product description

Modify the border size (1px, 2px, etc), style (solid, dotted, dashed) and color (#xxxxxx) to suit your needs in custom.css:
.woocommerce .woocommerce-tabs {border: 1px solid #e6e6e6}

Want to remove the orderby dropdown for products?

To remove the drop down and ordering options completely, add the following to your functions.php file:
1
remove_action( 'woocommerce_before_shop_loop', 'woocommerce_catalog_ordering', 30 );
However, if you want to edit the drop down and make it something else.  You can find the file at the following location:
/wp-content/plugins/woocommerce/template/loops/ordering.php

You can then copy that file to your theme folder, edit it, and override the default drop down.
/wp-content/themes/yourtheme/woocommerce/loops/ordering.php

How to add cart and my account link in header of woocommerce?

Displays a link to the user account section. If the user is not logged in the link will display ‘Login / Register’ and take the use to the login / signup page. If the user is logged in the link will display ‘My account’ and take them directly to their account.

<?php if ( is_user_logged_in() ) { ?>
<a href="<?php echo get_permalink( get_option('woocommerce_myaccount_page_id') ); ?>" title="<?php _e('My Account','woothemes'); ?>"><?php _e('My Account','woothemes'); ?></a>
<?php }
else { ?>
<a href="<?php echo get_permalink( get_option('woocommerce_myaccount_page_id') ); ?>" title="<?php _e('Login / Register','woothemes'); ?>"><?php _e('Login / Register','woothemes'); ?></a>
<?php } ?>

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/

Woocommerce - Shipping option and category discount

WooCommerce - 2.3.8
Wordpress - 4.2.2
First Question
Shipping is
Free shipping if order over $50
Otherwise
Standard shipping - $5
Rural Shipping - $8
Free Shipping is easy
However the the two flat rate options 5 and 8
I cannot work out how to set this, this is all within the same country, the customer picks either rural or standard depending on where they are in the country.
But i can't seem to figure out how to get it to work, can i just clone the flat rate option (I can't even figure out how to do that)
The other questions is,
What if i want to give 20% of on the T-Shirts category is there a way to blanket do this, or do i have to manually edit each product
Thanks in advance

WooCommerce extremely slow after WordPress 4.2 update

After updating to WordPress 4.2, it is literally taking 10 mins to open up one WooCommerce product in the admin backend. Everything else seems to be fine -- opening products for edit or creating new products is the thing screwing up. Any idea what is up?


Open products works at the usual speed for me. Consider the debug procedure: Deactivate plugins and try the default theme to try to identify the element that's causing the problem.. 


The theme and other plugins is not the issue. WordPress 4.2 made some change that is effecting WooCommerce.
How many products and purchases do you have? Your WooCommerce database may be small enough to not feel the change. I have over 1,000 products and over 1,000,000 purchases.

WooCommerce - excelling eCommerce

 WooCommerce - excelling eCommerce    Download


WooCommerce - 2.3.8
Wordpress - 4.2.2
First Question
Shipping is
Free shipping if order over $50
Otherwise
Standard shipping - $5
Rural Shipping - $8
Free Shipping is easy
However the the two flat rate options 5 and 8
I cannot work out how to set this, this is all within the same country, the customer picks either rural or standard depending on where they are in the country.
But i can't seem to figure out how to get it to work, can i just clone the flat rate option (I can't even figure out how to do that)
The other questions is,
What if i want to give 20% of on the T-Shirts category is there a way to blanket do this, or do i have to manually edit each product
Thanks in advance
https://wordpress.org/plugins/woocommerce/

How to create and edit Custom Templates of woocommerce

WooCommerce (and almost all add-ons) provides a templating system. This means that every element displayed on a WooCommerce page can be overridden.
This system’s advantage is that you can modify the display of an element without editing WooCommerce core files (which is absolutely NOT recommended, if you do so, all your modifications will be lost at the next WooCommerce update, so just don’t do it). All templates are located in a woocommerce/templates folder. As explained in our documentation, all you have to do is to create a woocommerce folder within your theme’s directory, and in this folder duplicate the files you’d like to override. Please note that we strongly recommend using a child theme in order not to lose any modifications during your theme update.
Overriding default templates also allow you to customize all emails sent by WooCommerce ;-)

Example:

Let’s say you would like to add a new class to product tabs in order to apply custom CSS code to the tabs. You would need to duplicate the woocommerce/templates/single-product/tabs/tabs.php file in the following folder wp-content/themes/your-theme-folder/woocommerce/single-product/tabs/ and change the following code <ul class=« tabs”> to <ul class=« tabs my-custom-tabs-class « >.

Sunday 10 May 2015

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.
Installing Wampserver
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.
launching phpMyAdmin in Wamp
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.
Creating a database in phpMyAdmin for WordPress

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.
Create wordpress configuration wp-config file
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.
Provide your database information to install WordPress on localhost with WAMP
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.
Run WordPress Installation Script
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 Installation Page
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

Popular Articles