Wordpress Common Hooks

Hi,

I have developed an admin panel for Woo-commerce Developers http://wordpress.org/plugins/woocommerce-admin-theme-for-shop-manager/ by using various wordpress hooks.

So here are some general hooks and every WordPress Developer will need few of them.

Add these hooks in theme's functions.php.

Remove Update Notices in WordPress Admin Panel
add_action('admin_menu','wooadmin_balram');
function wooadmin_balram(){
   remove_action( 'admin_notices', 'update_nag', 3 );
}

hide WordPress version like we see meta ="generator" and WordPress version in view page source code
remove_action('wp_head', 'wp_generator');

Disable the “please upgrade now” message in WordPress Admin Panel
add_action( 'init', create_function( '$a', "remove_action( 'init', 'wp_version_check' );" ), 2 );
add_filter( 'pre_option_update_core', create_function( '$a', "return null;" ) );

Footer Content Change in WordPress Admin Panel
add_filter('admin_footer_text', 'wooadmin_left_admin_footer_text_output', 11); //left side
function wooadmin_left_admin_footer_text_output($text) {
    $text = bloginfo('name').' Admin Panel';
    return $text;
}
add_filter('update_footer', 'wooadmin_right_admin_footer_text_output', 11); //right side
function wooadmin_right_admin_footer_text_output($text) {
    $text = 'Version 1.0';
    return $text;
}


Enque custom style sheet for admin Panel in WordPress Admin Panel
function wooadmin_my_admin_theme_style() {
    wp_enqueue_style('my-admin-theme', plugins_url('wp-admin.css', __FILE__));
}
add_action('admin_enqueue_scripts', 'wooadmin_my_admin_theme_style');
add_action('login_enqueue_scripts', 'wooadmin_my_admin_theme_style');

Add custom menu in WordPress header in WordPress Admin Panel
function wooadmin_eshopbox_admin_bar() {
    global $wp_admin_bar;
    //Add a link called 'My Link'...
    $wp_admin_bar->add_menu( array(
        'id'    => 'my-link',
        'title' => 'My Link',
        'href'  => admin_url()
    ));
}

To Replace Title href of Logo in Wordpress Admin Panel
add_action( 'admin_head', 'wooadmin_eshop_admin_logo' );
function wooadmin_eshop_admin_logo()
{   
     if( function_exists('get_custom_header') ){
        $width = get_custom_header()->width;
        $height = get_custom_header()->height;
    } else {
        $width = HEADER_IMAGE_WIDTH;
        $height = HEADER_IMAGE_HEIGHT;
    }
    ?> // Do not Forget Add php open tag after closing script tag
    
        
}

To Replace Header Top Right Menus in Admin Panel
add_action( 'admin_head', 'wooadmin_eshop_header_right_menus' );
function wooadmin_eshop_header_right_menus()
{   
    ?>
    
}

Remove Color Scheme in User Profile
function wooadmin_admin_color_scheme() {
   global $_wp_admin_css_colors;
   $_wp_admin_css_colors = 0;
}
add_action('admin_head', 'wooadmin_admin_color_scheme');

Remove Unused Dashboard Widgets
function wooadmin_remove_dashboard_widgets(){
    remove_meta_box('posts', 'users', 'normal');   // Right Now
    remove_meta_box('dashboard_right_now', 'dashboard', 'normal');   // Right Now
    remove_meta_box('dashboard_browser_nag', 'dashboard', 'normal');   // Right Now
    remove_meta_box('dashboard_recent_comments', 'dashboard', 'normal'); // Recent Comments
    remove_meta_box('welcome-panel', 'dashboard', 'normal'); // Welcome Comments
    remove_meta_box('dashboard_incoming_links', 'dashboard', 'normal');  // Incoming Links
    remove_meta_box('dashboard_plugins', 'dashboard', 'normal');   // Plugins
    remove_meta_box('dashboard_quick_press', 'dashboard', 'side');  // Quick Press
    remove_meta_box('dashboard_recent_drafts', 'dashboard', 'side');  // Recent Drafts
    remove_meta_box('dashboard_primary', 'dashboard', 'side');   // WordPress blog
    remove_meta_box('dashboard_secondary', 'dashboard', 'side');   // Other WordPress News
// use 'dashboard-network' as the second parameter to remove widgets from a network dashboard.
}
add_action('wp_dashboard_setup', 'wooadmin_remove_dashboard_widgets');

Remove Biographical Info From Users Page
add_action( 'personal_options', array ( 'wooadmin_T5_Hide_Profile_Bio_Box', 'start' ) );
class wooadmin_T5_Hide_Profile_Bio_Box
{
    /**
     * Called on 'personal_options'.
     *
     * @return void
     */
    public static function start()
    {
        $action = ( IS_PROFILE_PAGE ? 'show' : 'edit' ) . '_user_profile';
        add_action( $action, array ( __CLASS__, 'stop' ) );
        ob_start();
    }
    /**
     * Strips the bio box from the buffered content.
     *
     * @return void
     */
    public static function stop()
    {
        $html = ob_get_contents();
        ob_end_clean();
        // remove the headline
        $headline = __( IS_PROFILE_PAGE ? 'About Yourself' : 'About the user' );
        $html = str_replace( '

' . $headline . '

', '', $html ); // remove the table row $html = preg_replace( '~\s*

Remove Social Links In User Page in WordPress Admin Theme
function wooadmin_remove_contactmethods($contactmethods ) {
  unset($contactmethods['aim']);
  unset($contactmethods['website']);
  unset($contactmethods['yim']);
  unset($contactmethods['jabber']);
  unset($contactmethods['googleplus']);
  unset($contactmethods['twitter']);
  unset($contactmethods['url']);
  return $contactmethods;
}
add_filter( 'user_contactmethods', 'wooadmin_remove_contactmethods' );

Remove the `profile.php` Admin Color Scheme Options in WordPress Admin Theme
remove_action( 'admin_color_scheme_picker', 'admin_color_scheme_picker' );
if ( ! function_exists( 'cor_remove_personal_options' ) ) {
//   * Removes the leftover 'Visual Editor', 'Keyboard Shortcuts' and 'Toolbar' options
  function cor_remove_personal_options( $subject ) {
    $subject = preg_replace( '#

Personal Options

.+?/table>#s', '', $subject, 1 ); return $subject; } function wooadmin_cor_profile_subject_start() { ob_start( 'cor_remove_personal_options' ); } function wooadmin_cor_profile_subject_end() { ob_end_flush(); } } add_action( 'admin_head-profile.php', 'wooadmin_cor_profile_subject_start' ); add_action( 'admin_footer-profile.php', 'wooadmin_cor_profile_subject_end' );

Hiding Upgrade Notices in WordPress Admin Theme
add_filter( 'pre_site_transient_update_core', create_function( '$a', "return null;" ) );

Remove Help tabs in WordPress Admin Theme
add_action('admin_head', 'wooadmin_mytheme_remove_help_tabs');
function wooadmin_mytheme_remove_help_tabs() {
    $screen = get_current_screen();
    $screen->remove_help_tabs();
    remove_menu_page('edit-comments.php'); // Remove the Tools Menu  
    remove_menu_page('update-core.php'); // Remove the Tools Menu  
}

Remove Plugin's Update Notifications in WordPress Admin Theme
remove_action( 'load-update-core.php', 'wp_update_plugins' );
add_filter( 'pre_site_transient_update_plugins', create_function( '$a', "return null;" ) );

Hide WordPress Admin Bar Strip from the Website when Admin is logged in WordPress Admin Theme
add_filter('show_admin_bar', '__return_false');  

Remove Welcome Message from WordPress Dashboard in WordPress Admin Theme
add_action( 'load-index.php', 'wooadmin_remove_welcome_panel' );
function wooadmin_remove_welcome_panel()
{
    remove_action('welcome_panel', 'wp_welcome_panel');
    $user_id = get_current_user_id();
    if (0 !== get_user_meta( $user_id, 'show_welcome_panel', true ) ) {
        update_user_meta( $user_id, 'show_welcome_panel', 0 );
    }
}

Change Admin Theme logo by the Website Logo in WordPress Admin Theme
add_action( 'login_head', 'wooadmin_namespace_login_style1' );
function wooadmin_namespace_login_style1() {
    if( function_exists('get_custom_header') ){
        $width = get_custom_header()->width;
        $height = get_custom_header()->height;
    } else {
        $width = HEADER_IMAGE_WIDTH;
        $height = HEADER_IMAGE_HEIGHT;
    }
    echo ''.PHP_EOL;
}
function wooadmin_namespace_login_style() {
    $url = plugins_url();
    echo '';
}

Remove Junk From Head in Website View Source Code
function roots_head_cleanup() {
  remove_action('wp_head', 'feed_links', 2);
  remove_action('wp_head', 'feed_links_extra', 3);
  remove_action('wp_head', 'rsd_link');
  remove_action('wp_head', 'wlwmanifest_link');
  remove_action('wp_head', 'adjacent_posts_rel_link_wp_head', 10, 0);
  remove_action('wp_head', 'wp_generator');
  remove_action('wp_head', 'wp_shortlink_wp_head', 10, 0);
  global $wp_widget_factory;
  remove_action('wp_head', array($wp_widget_factory->widgets['WP_Widget_Recent_Comments'], 'recent_comments_style'));
  add_filter('use_default_gallery_style', '__return_null');
}
add_action('init', 'roots_head_cleanup');

Note: Add php opening tag after script closing tags

0 comments:

SCSS - Quick Guide

Hi, If you know CSS and want a quick move to SCSS, you can refer this article.

To install Scss Environment / Compass http://compass-style.org/install/

What is Sass / Scss?
  • An extension of CSS
  • Modular and Easily Maintainable
  • Feature Rich
  • Frameworks (Compass, Bourbon, Susy)
These are the majorly used SCSS Properties.
1. Variables
2. Nesting
3. Mixins
4. Parent Selector
5. Inheritance / extend
6. The Optional Flag
7. Placeholder Selector
8. CSS Namespace
9. Variable Defaults
10. Partials
11. Sass Inbuilt Functions
12. Control Directives

1. Variable : Variables are the straightforward way to use SassScript. They are used as css Properties.

SCSS
$themeErrorColor: red;
.error{
 color: $themeColor;
 border: 1px solid $themeErrorColor;
 background: lighten($themeErrorColor, 20%);
}

CSS
.error{
 color: red;
 border: 1px solid red;
 background: lightred;
}    



2. Nesting : In Css coding, When targeting a child element, many words and lines are repeated like

SCSS
ul{
 color: red;
 ul li{
  width: 200px;
  ul li a{
   padding: 3px;
  }
 }
}

CSS
ul{
 color: red;
}
ul li{
 width: 200px;
}
ul li a{
 padding: 3px;
}



3. Mixins : Even more useful than variables, mixns allow us to reuse whole chunk of css properties or selectors. You can even give them arguments.

SCSS
@mixin border-radius($radius) {
  -webkit-border-radius: $radius;
     -moz-border-radius: $radius;
      -ms-border-radius: $radius;
          border-radius: $radius;
}

.box { @include border-radius(10px); }

CSS
.box {
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -ms-border-radius: 10px;
  border-radius: 10px;
}


4. Parent Selector : Parent Selector, a powerful scss tool, refers to the parent selector using & (ampersand).

SCSS
a{
  color: grey;
  &:hover{        // Parent Selector
   color: blue;
  }
 }
}

CSS
a{
 color: grey;
}
a: hover{
 color: blue;
}

Another Example:

SCSS
.inputBox{
 border: 1px solid grey;
 &.error{
  border: 1px solid red;
 }
}

CSS
.inputBox{
 border: 1px solid grey;
}
.inputBox.error{
 border: 1px solid red;
}


5. Inheritance / Extend : Sass can tell one selector to inherit all the styles of another without duplicating css properties.

SCSS

.message {
  border: 1px solid #ccc;
  padding: 10px;
  color: #333;
}
.success {
  @extend .message;
  border-color: green;
}
.error {
  @extend .message;
  border-color: red;
}
.warning {
  @extend .message;
  border-color: yellow;
}

CSS
.message, .success, .error, .warning {
 border: 1px solid #cccccc;
 padding: 10px;
 color: #333;
}
.success {
  border-color: green;
}
.error {
  border-color: red;
}
.warning {
  border-color: yellow;
}



6. The Optional Flag: Normally when you extend a selector, its an error if that @extend does not work. Sometimes though you want to allow an @extend the selector optionally.

SCSS
a.important{
 @extend .notice!optional;
}


7. Placeholder Selector / @extend-only Selector: Sometimes, you will write styles for a class that you only ever want to extend, and never want to use directly in your html.

Placeholder Selector look like class and id selector except the # or . is replaced by %.

This ruleset does not rendered on its own.

For Example: Suppose we have three buttons in our application, 1. default, 2. primary button, 3. secondary button and we have classes btn, default, primary and secondary. btn class here is a placeholder selector with no individual significance, it can be used with default, primary and secondary buttons.

SCSS

%btn{     // this block will not render
 padding: 4px 6px;
 border-radius: 2px;
 font-size: 12px;
}
.defaultBtn{
 @extend %btn;
 background: white;
 color: #000000;
}
.primaryBtn{
 @extend %btn;
 background: blue;
 color: #ffffff;
}
.secondaryBtn{
 @extend %btn;
 background: grey;
 color: #000000;
}

CSS
.btn{
 padding: 4px 6px;
 border-radius: 2px;
 font-size: 12px;
}
.btn.defaultBtn{
 background: white;
 color: #000000;
}
.btn.primaryBtn{
 background: blue;
 color: #ffffff;
}
.btn.secondaryBtn{
 background: grey;
 color: #000000;
}



8. CSS Namespace : Css has quite a few properties that are in "namespace"; for instance: font-family, font-size, font-weight are all in same font namespace. In Css, you have to type each property seperately while in Scss, you have to type it one time.

SCSS

body{
 backgrond:{
  image: url(http://placehold.it/20x20);
  color: red;
  position: 100px 20px;
 }
}

CSS
body{
 backgrond-image: url(http://placehold.it/20x20);
 background-color: red;
 background-position: 100px 20px;
}


9. Variable Defaults : A very simple SCSS ruleset to define default value of a variable i.e if some variable has not assigned any value, it will take its default value using !default.

SCSS

$themeColor = red!default;


10. Partials :  If you have a SCSS or SASS file that you want to import but don't want to compile to a CSS file, you can add an underscore to the beginning of file name. This will tell Sass not to compile to a CSS file. You can import these files without using underscores using import keyword.

For Instance you might have _reset.scss then no _reset.css file would be created.

@import "colors"; // will import _colors.scss


11. Sass Inbuilt Functions : Sass Provide a good number of builtin functions for Colors, Opacity, String Functions, Number Function, List Function, Map Function. Apart from these functions, you can create your custom function also.
You can get detailed information here:

http://sass-lang.com/documentation/Sass/Script/Functions.html

12. Control Directives : Control Directives avails loop functions like @if, @for, @each and @while etc. For Example:

SCSS
@if Directive
p{
 @if 1 + 1 = 2 {
  border: 1px solid;
 } elseif 5 < 3 {
  border: 1px dotted;
 } else {
  border: 1px double;
 }
}
@for Directive
@for $var from 1 through 3{    // @for $var from  through 
  .item-#{$i} { width: 20px * $i; }    // # to concadinate
}
@each Directive
@each $animal in puma, sea-slug {
 .#{$animal}-icon{
  background-image: url('/img/#{$animal}.png');
 }
}
is compiled to
.puma-icon{
 background-image: url('/img/puma.png');
}
.sea-slug{
 background-image: url('/img/sea-slug.png');
}
@while Directive
$i : 6;
@while $i > 0 {
 .item-#{$i} { width: 2em * $i;}
 $i : $i - 2;
}
is compiled to
.item-6{
 width: 12em;
}
.item-4{
 width: 8em;
}
.item-2{
 width: 4em;
}

You can start with these SCSS rules to switch from CSS to SCSS.
Enjoy Sassy CSS.


Reference:
http://sass-lang.com/
http://thesassway.com/


0 comments:

Add / Edit Product / Categories in Ecommerce Store developed in Wordpress / Woocommerce

I had developed 200 plus E-commerce Websites in Wordpress while working in a software development company and for many of freelancing clients.

In complete development cycle, I face major issue in product upload training, So i have prepared this document for many such developer friends facing this issue and their clients.


This blog explains how to upload a simple product and add a product category.


Initial Requirement:

Make sure you are logged in Website Admin Panel with path



Note: Change WEBSITE_URL with your website url like mydealbazaar.com in this document.

Add Category :

In Left Side Menu Bar, goto Product -> Categories

or click the url below:



In right side of the page, we can see a list of categories existing in our website. To add new Category
Enter Name of the Category in text box in left side and press blue button with text "Add New Category".

To make this category, child of any other category, Sect Name of Parent same as name of the parent category.


Slug, Description and thumbnail can be left blank.





Edit Category :

In the above url, Where we can see list of categories in right side, Click Edit button just below the name of each category. (Edit Button is visible when we hover on a category).






After Click of Edit Category, We get screen like this:







Change Name, Slug, Image and Parent of category from here.


Add Product :

goto Products -> Add Product in left side menus

or click url:

http://WEBSITE_URL/wp-admin/post-new.php?post_type=product

After Click we get a screen like this:






In First Field Write Name of the Product.




In Second Large box, Enter Description of the product in detail. You can add media in this part.




In third box (Product Short Description): Add short description of the product.




In forth box, we have screen like this. We will add Price of the Product from here for a Simple Product.

In this Part, Enter sku of the product, add Regular Price and Sale Price of the product.

In same Block in next Tab Inventory, We can add no of available products / quantity available to us for that product. Tick "Enable Stock Management at Product Level"  and enter stck quanity of that product.






In same page, In right side, there is a block of Product Categories, where you can see list of all the categories, you made from product -> categories. Tick the categories underwhich this product reside.
You can also add new product category from here.






goto right side at the bottom of the page, and click on "Set Featured Image", you can upload product photo from here.




To add other photos, related to this product, click "Product Gallery" in right side of the page at the bottom, just above Set Featured Image Block.
You can choose multiple images from here.





After doing this, in the same page, click blue color "Publish" button showing in the right side of the page.



You can now view your product now from view Product button showing in top black strip.


By: Balram Singh


Woocommerce Admin Theme

Woocommerce Admin Panel for Shop Manager || Hide woocommerce and wordpress from Shop Manager.




Do not forget to upload header image for better use.





Requirement: User Role Plugin http://wordpress.org/plugins/user-role-editor/


The current features are as follows: 1. Enqued a Custom style sheet for WordPress dashboard which is easy to be customized by the requirement.

2. Footer Left text (Thanks Text) and Footer Right Text (version text) is added.

3. Added a button in header left to "Visit Site".

4. Replaced logo in dashboard and Login Screen.

5. Added a new Set of buttons (Profile, Messages, Settings, Logout) in Header Right Strip.

Profile Page - Profile of Shop Manager

Settings - Woocommerce Settings

Messages - All the comments of customers.

Logout - Simply Logout

6. Set an Order of Main Right Menus in sequence

Dashboard - Customized Dasboard for Shop Manager

Home - dashboard Page

Reports- Woocommerce Reports Page

Seperator1 - Commerce Management

Order Menu - Woocommerce Orders page


Users/ Customers - Woocommerce Customers page

All Users/ Customers - Renamed as Customers

Add a customer - Shop keeper can add Customers and Subscribers but can not add Admin.

Products - Woocommerce Products Page

Products - Woocommerce Product Page

Categories - Woocommerce Categories Page

Tags - Woocommerce Tags Page

Shipping Classes - Woocommerce Shipping Tab

Attributes - Woocommerce Attribbutes Tab

Seperator2 - Marketng Suit

Coupons

SEO

Seperator3 - Content Management

Pages (Woocommerce Pages like Cart, My Account, Change password pages are hidden from Shop Manager) Media

Post / Blog - Renamed as Blog

Link

Seperator4 - Website Design

Widgets - Widget Page (All the widgets are renamed from woocommerce to My Shop)

Menus - All the menus used in the Website

Header - Change Logo Image

Background - Change Backgorund Color of the website.

Seperato5 - My Shop Extend


Note: Seperators are not clickable.
All the Existance of woocommerce is replaced with My Shop.
Header Right Menu Settings Button redirects to woocommerce settings page where all the main menus are replaced with the sub menus of Woocommerce Settings. Back to Dashboard - Link for main dashboard General - Woocommerce Settings Page Catalog - Woocommerce Settings Catalog Tab Pages - Woocommerce Pages Tab Inventory - Woocommerce Inventory Mangement Shipping - Woocommerce Settings Page Shipping Tab Payment Gateways - Woocommerce Settings Page Payment Gateway tab Emails - Woocommerce Settings Page Email Tab Integration - Woocommerce Settings Page Integration Tab


Removed all the other unused Menus by the shopkeeper and also restrict permission fpr the shopkeeper to add or edit plugin, tools menu and add or modify theme.


Removed Color Scheme from user Profile


Removed Default WordPress widgets on Dashboard. Woocommerce Widgets like Monthly Sales Graph etc is shown in Dashboard.


12.Removed Biographical Info From users Page.


13.Removed Role, Email and Posts Columns from All Users / Customers Page In Admin Panel.


Removed Social Links from User / Customer Page like AIM, YIM and jabber. (Twitter and website is to be removed).


Removed all the items under “Personal Options” on user profile page.


Upgrade Notices are Hidden.


Removed Help tabs on wordpress.


Hide the WordPress Upgrade Message in the Dashboard


Removed Notices in wordpress.


20.Added a custom Field in Add User / Customer Page.


Decide Role of Shop Keeper or Other Users from their capability.


Relpaced customer from users heading and title.


Title of All the Pages in Dashboard includes wordpress that is completely removed and replaced by My Shop.


WpAdmin Bar Top Strip is not shown when the ShopManager is loggedin.


Woocommerce Pages are completely hideen from dashboard Shop Page Cart Page My Account Payment Thanks Page Payment Page Edit Address View Orders Page Woocommerce Terms Page Checkout Page These are the few points which are covered till now. Hope for few More Features...




Tags: admin, Admin Bar Addition, Admin Page Framework, admin panel, admin-theme, Anuj admin, Anuj Sachan, Balram Admin Theme, Balram Singh, Balram Singh Admin Theme, Balram Singh Stackoverflow, Best Admin for Admin, Best Admin Panel, Custom Double Headers, custom-menu, disable admin bar, Disable Admin Bar and ToolBar, Disable Admin Bar Removal,Enhanced Admin Bar, hide woocommerce from Online Store, hide woocommerce from theme,hide wordpress from theme, Highest Demanded Woocommerce Plugin, Highest Download,Highest Downloaded Plugin, Highest Success Rate, http://balramsingh.in, International Woocommerce, My Admin Theme, New One, plugin, Simplify Admin Panel, Welcome in Woocommerce Admin, widget, woocommerce, Woocommerce Admin, WooCommerce Admin Bar,WooCommerce Admin Bar Addition, woocommerce admin panel, woocommerce admin theme,woocommerce custom dashboard, woocommerce shop manager dashboard, Woocommerce Social Login, Woocommerce Theme, wordpress, WordPress Admin Bar Addition, WordPress admin Panel, wordpress admin theme, Wp My Admin Bar










By: