WordPress Theme Development Part 3 – Stylesheet

In my themes root folder I create style.css file

And add this code into it.


/*
Theme Name: Travel
Theme URI: https://yourdomain.com
Author: Shakil Zaman
Author URI: https://wpcooltrics.org/
Description: This is a simple Travel theme
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: travel, adventure, tourism.
Text Domain: travel
*/

These are the primary information of this theme. You can change these info according to your theme name, author name, version, tags etc.

WordPress Theme Development Part 2 – Getting started

Well you are reading this article it means you already know about web development and you have basic ideas about WordPress. Before start to learn WordPress theme development you need knowledge about these following things –

  • HTML
  • CSS
  • WordPress Admin Panel
  • Basic PHP and MySQL

If you already know php programming that is great. If you have little bit idea that will ok. But if you don’t have experience with php, its maybe a difficult task for you. Although I know some person who are good in WordPress theme development without having any knowledge about php. Because of WordPress is super user friendly, when you see any WordPress function you can assume its uses by its name.

Install XAMPP or WAMP

PHP is a server side programming and WordPress made with php so you must install XAMPP or WAMP server in you pc. For Mac use MAMP and for Linux use LAMP.

Install WordPress

Download and Install the latest version of WordPress in XAMPP. Then open both, Website and WordPress admin panel in your browser.

Add HTML template

In the WordPress root directory you will see wp-content folder. There you will find themes folder. Inside themes folder there are already some themes are given by WordPress. Here you will create your new theme. I’m using a Travel html theme to convert WordPress.  So I give the folder name travel.

Inside the travel folder I will add all my HTML, CSS and JS files.

Lots of HTML files in the theme root folder. I don’t need all of them now. So I’m creating a folder layouts and move all HTML files into it except index.html.

I create a index.php file into the themes root folder and copy all the html codes from index.html and paste into index.php. Then remove the index.html file from root.

This is how I start. Check next tutorial to learn more.

WordPress Theme Development Part 1 – Introduction

Without any doubt WordPress is world’s most popular CMS for any type of website. Few years ago, one of my friends recommended me to check WordPress as a web development tool. Over night I complete to check all admin menus and felt WOW !!!  How easy to create a website this days. Interesting part is whole the world felt same like me. Now if you plan to create any blog, magazine, e-commerce and even multi vendor, WordPress is everywhere.

Advantages of WordPress

  • Community

When the matter is support then community is a fact. WordPress have the biggest community in website world.  If you face any problem to operate WordPress or its internal coding, simply google it and you will understand that how easy to work with a CMS if the community is huge.

  • SEO 

WordPress is the best SEO solution for a website. If you use WordPress then most of the On Page SEO work as permalinks, title, content, image,  alt tag seo is simply cover by WordPress.

  • Themes

Any category of WordPress themes are available in the market. Theme is the most powerful feature. If a client want a website for animal foods. Then most of the developers first find a WordPress theme for that. Because many features are already included on the theme that the client looking for.

  • Plugin

Just like themes large number of WordPress plugins are available in the market. Plugins reduces developers work significantly. If you want to add Facebook like, comment & share options in your website. Just install a plugin and activate it. It will take 5 minutes maximum.

  • User Friendly

WordPress is easy for both users and developers. Create a new page or post in WordPress is simply easy as create a Facebook status. It has super easy system for manage category wise  contents of a website.

  • Security

WordPress Developers upgrades its version very frequently. So when a security threat comes, developers always concern about that and fix it at the next version.

So these are some reasons that will help you to understand why you will create your web development career with WordPress. If you want to create the next version of you in the world of WordPress then start to learn WordPress theme development from the next tutorial. Wish you a good luck.

How to change the Admin Login Logo in WordPress

Your buyer want to operate his website from WordPress admin panel. And he wish to use his own logo on the admin login page instead of WordPress logo. So how to do this thing.

Step 1 :

Use this code to your functions.php


// Admin login logo
function custom_admin_loginlogo() {
echo '<style type="text/css">
h1 a {background-image: url('.get_bloginfo('template_directory').'/images/client-logo.png) !important; }
</style>';
}
add_action('login_head', 'custom_admin_loginlogo');

Step 2 :

And upload the logo in your themes images folder.  Check the admin login. Hope it works fine. Thanks !

How to Replace ‘Enter title here’ Text in WordPress

When we create a custom post and click Add New Post,we see everything same at the admin end. For example you added a new custom post Team. So instead of “Enter Title Here” on the Title section you want to show “Name of Team Member”. How can we do that.

First you have a create a custom post as I create a custom post Team. get_current_screen() is a function that is used for get the current screen object. I create a function change_default_title() and use get_current_screen() function inside it. And finally filtering the function by use add_filter. At the first parameter ‘enter_title_here’ is the current version. And you can change it by add the function name  at the second parameter.



// Change default Title
function change_default_title( $title ){
$screen = get_current_screen();
	
// For Team
if ( 'team' == $screen->post_type ) {
$title = 'Name of Team Member';
}   

return $title;
}

add_filter( 'enter_title_here', 'change_default_title' );

When you want to change ‘Enter Title Here’ in multiple custom posts. You can use like this.


// Change default Title
function change_default_title( $title ){
    $screen = get_current_screen();

    // For Testimonials
    if  ( 'testimonials' == $screen->post_type ) {
        $title = 'Customer Name';

    // For Services
    } elseif ( 'services' == $screen->post_type ) {
        $title = 'Service Name';

    // For Projects
    } elseif ( 'projects' == $screen->post_type ) {
        $title = 'Project Name';
    }
	
	// For Slider
    elseif ( 'slider' == $screen->post_type ) {
        $title = 'Slider Heading';
    }
	
	// For Team
    elseif ( 'team' == $screen->post_type ) {
        $title = 'Name of Team Member';
    }   

    return $title;
}

add_filter( 'enter_title_here', 'change_default_title' );

Hope this tutorial works. Thanks !