What I learned while creating WordPress websites

There are a lot of tutorials on the Internet on WordPress and there is nothing new that I have to add to that content. But still, here I am writing an introduction article and an entire series on WordPress. What I intend to include in this series is to share my experience of using and learning WordPress. I was a complete newbie in WordPress when I started, with zero knowledge of PHP. And yet I learned and am now creating WordPress websites.

This is just an informative article and if you are looking for actually getting started, have a look at these other articles handling all the technical details.

Getting started with wordpress.com

Setting up a website on your server

wordpress.com or wordpress.org

I had created many blogs before in WordPress but designing an entire website was new to me. The first choice came in the form of wordpress.com vs wordpress.org. While both are equal in almost every manner except that if you already have a hosting plan, you should go for wordpress.org.

wordpress.org is absolutely free. All you have to do is install it on your server and you are good to go. Since you are already paying for your hosting services, you should not be paying extra by going for wordpress.com.

If you don’t have a server and don’t intend to own many websites, then go for wordpress.com. It hosts your website at its server and all you have to worry is about the content and appearance of the website. And you also have to pay a certain amount to WordPress as hosting charges. In that case, go to wordpress.com and Get Started. You have to provide basic website information, select a plan or the free version (but in that case, your domain will look something like yourdomain.wordpress.com.) and start blogging.

I already have a SiteGround hosting plan with multiple websites. So, I definitely selected wordpress.org. My main domain was theengineerscafe.com. So, I created an Add-on domain for my website.

WordPress Installation

If you are using wordpress.com, you can safely skip this section and check out the Plugins section, where I describe their power, importance, and disadvantages.

Now, for the warriors configuring the server and installing WordPress, let’s get the hands dirty. If this is the first website on your server, you have to create a domain and if you already have a website hosted on the server, then create an Addon domain. Next, install WordPress. You’ll be asked for a website name, domain information and other such trivial information. Here is a detailed article on setting up a WordPress website on your server. After that, if all goes well, you will be ready to start using your website. Please note that a website may take 24-48 hours to get live. So, keep checking your website and once it is live with the default WordPress page, access the admin panel of your website using yourdomain.com/wp-admin. You’ll be redirected to a login page. Now, login to your account and start exploring your dashboard. It’s pretty intuitive.

Plugins

If WordPress runs your website, plugins beautify and complete it. WordPress has a very active and strongly built community. As a result, there is almost going to be no need of yours, for which someone has not written a plugin. While basic functionalities of most of the plugins are free, you can opt for paid ones too for added needs. As for me, I have not used a paid plugin to date (No, I am not a cheapskate but as they say there’s enough for a man’s need). I just love the WordPress community. They are constantly adding and updating the plugins as per the needs and that too without adding burden to your pocket.

Keep some points in mind when selecting plugin for your website.

Learn from the mistake of others

Always always read the reviews before selecting a plugin. You will easily get to know the pros and cons of the plugin. The number of active installations also shows the success and popularity of a plugin.

Don’t boycott a newbie

What I said earlier doesn’t mean that you should not go for a plugin completely fulfilling your needs simply because its new. Never fear to try something new and if you’ve issues or you just love it, write a review and help others.

Paid vs Free features

Most of the plugins are free with limited functionalities and their paid version gives you full control. So, don’t just get lifted to the sky by reading the feature list of a plugin. Make sure what you need is available in the free version (unless you are very rich and can afford anything), else keep browsing the other options.

Your website already has so many data that adding a plugin with tons of features when you need just one is plain stupidity. Don’t clutter your website with too many and too heavy plugins. Choose a plugin only if it is absolutely necessary. And try to select one that is lightweight. Keep the plugin size as small as possible.

I am listing some of the plugins that you may need. This is my choice. Your requirements may be different and your choices too. This is just to get you started.

Yoast SEO

While there may be many plugins available for SEO, this is the one that we use for theengineerscafe.com and we are perfectly happy with it. We are just using the free version. And it lists out various issues like readability, problem areas for better SEO, internal and external links in the articles, metadata etc. We are on the first page of Google Search for many topics and that’s what counts.

Smush

Compress your images to load them faster. If you are just going to use an image or two then you don’t need any compressing plugin. WordPress does that by default for you. But if your website is going to feature a lot of images, you better use Smush to compress your images. Your image size will be reduced completely without any noticeable difference in the image quality.

Disqus

Disqus provides a full-fledged and elegant comment system in its free version. We use it and we like it.

Monster Insights

Just like the name, the plugin is really cool. This is an important plugin if you want to monitor the traffic on your website. With this plugin, you can link your website to Google Analytics and get all the data about your website usage, audience and what not.

MailChimp for WP

If you want to create and maintain a subscriber’s list who get notified every time you publish a post, or for subscribing to your newsletter or ebook, use this plugin. Our subscribers get emails through MailChimp and we don’t have any complaints till now. A mailing list is a useful way of notifying your readers about your posts and makes sure that they never miss it.

Developer’s Arena

Let me state some of the plugins that came handy to me as a developer. To use these plugins, you need to know atleast basic coding. I also want to show the power of functions.php file. This file, though not mandatory in a theme, is used almost by all developers to make WordPress act according to your will.

Page specific Stylesheets

This plugin is a gem. There are times when you can’t just apply your styling because it is being overridden. Or there is a certain page that has an entirely different style and that is not used anywhere. And you don’t want to burden other pages with that style code. What Page specific Stylesheet does is add a stylesheet box where you can add all the css. And your styling works like charm. This plugin is relatively new and isn’t updated either but its lightweight and is a simple and easy way to manage page specific stylesheets.

Custom Post Types UI

Adding and managing Custom Post Types and taxonomies is very easy using this plugin. You can add custom post types easily without touching the functions.php file and in just a few clicks.

The mighty functions.php

functions.php is the file that holds the power to singlehandedly control anything on your website. No matter what you want to do on your website, there is nothing that can’t be achieved by adding a few lines of code to the functions.php file.

Every theme has a functions.php file and it contains the basic settings and configuration related to the theme and in general. You can add code to this file as per your needs. However, be careful while handling this file. Any wrong or ambiguous code and you may get a crashed website or one that is behaving insanely. Make sure that your code is right and if possible, check your code locally before uploading it to the live website.

Now, let me tell you some of the things that I’ve implemented till now.

Hide the title

On the Home page, I wanted a customized header and hence didn’t want to display the default title. One way is that you don’t set the title but that is not mostly recommended. Instead just add the given code to the functions.php file and that should do the deed. This code checks if the page is Home or front page and returns an empty string instead of the title. You can use any page based on id or name instead of the home page.

add_filter( 'the_title', 'remove_page_title', 10, 2 );

function remove_page_title( $title, $id ) {
    if( is_home() || is_front_page() )
        return '';

    return $title;
}
Add a shortcode for a code block

If you want to display a certain data from the database or even an HTML block that you need to reuse across your website. A great way is to create a shortcode for it in functions.php and just use the shortcode wherever you want to display that data instead of rewriting that entire code. This code gets last 5 published posts of custom type designer_stories from the database and displays them. Now, wherever I want to display this data all I have to add is the shortcode for fetching the data, [SampleData].

add_shortcode('SampleData', 'GetData');
function GetData(){
 $args = array( 'numberposts' => 5, 'offset' => 0, 'category' => 0, 'orderby' => 'post_date', 'order' => 'DESC', 'include' => '', 'exclude' => '', 'meta_key' => '', 'meta_value' =>'', 'post_type' => 'designer_stories', 'post_status' => 'publish', 'suppress_filters' => true ); 
$recent_posts = wp_get_recent_posts( $args, ARRAY_A );?>
<div class="data">
<?php for($i=0;$i<5;$i++){

<a href="<?php echo esc_url( get_permalink($recent_posts[$i]['ID']) ); ?>" ><?php echo $recent_posts[$i]['post_title']?></a>
<?php echo get_the_post_thumbnail($recent_posts[$i]['ID'], 'full');
}?>
</div>
<?php } ?>
Add javascript files to the front end

As we all know, in a WordPress website, we don’t have much control over the head section of the page. If you want to add any custom stylesheet or a javascript file, there is no straightforward way to do it. Either you have to use a plugin or add the file manually in the header template or modify the functions file. Let’s see how this can be done using the functions file. This code will add myscript.js file to <head>.

function add_my_scripts() {
	wp_register_script( 'script-name', get_stylesheet_directory_uri() . '/js/myscript.js', array(), '1.0.0', true );
        wp_enqueue_script('script-name');
}

add_action( 'wp_enqueue_scripts', 'add_my_scripts' );

And this is just the tip of the iceberg. So, keep exploring.

I guess now you are all armed to dive into the world of WordPress and start your website. Do ask your queries in the comments section. As always we will be happy to help.

Site Footer

© 2018 The Engineer's Cafe. All Rights Reserved.